-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathfaq.html
More file actions
545 lines (515 loc) · 43.8 KB
/
faq.html
File metadata and controls
545 lines (515 loc) · 43.8 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title data-i18n="faq.title">FAQ - AddressGen</title>
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<style>
body {
font-family: 'Inter', sans-serif;
}
.dropdown:hover .dropdown-menu {
display: block;
}
.faq-item.active .faq-answer {
display: block;
}
.faq-item.active .faq-icon-plus {
display: none;
}
.faq-item.active .faq-icon-minus {
display: inline-block;
}
.faq-item:not(.active) .faq-answer {
display: none;
}
.faq-item:not(.active) .faq-icon-plus {
display: inline-block;
}
.faq-item:not(.active) .faq-icon-minus {
display: none;
}
</style>
</head>
<body class="bg-gray-50 min-h-screen">
<!-- Navigation Bar -->
<nav class="bg-white shadow-md fixed w-full z-10">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16">
<div class="flex">
<div class="flex-shrink-0 flex items-center">
<span class="text-2xl font-bold text-indigo-600">AddressGen</span>
</div>
<div class="hidden sm:ml-6 sm:flex sm:space-x-8">
<a href="index.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium" data-i18n="nav.home">
Home
</a>
<a href="blog.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium" data-i18n="nav.blog">
Blog
</a>
<a href="faq.html" class="border-indigo-500 text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium" data-i18n="nav.faq">
FAQ
</a>
<a href="about.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium" data-i18n="nav.about">
About
</a>
<a href="feedback.html" class="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium" data-i18n="nav.feedback">
Feedback
</a>
</div>
</div>
<div class="hidden sm:ml-6 sm:flex sm:items-center">
<!-- Language Selector -->
<div class="ml-3 relative">
<button id="lang-button" class="flex text-sm border-2 border-transparent rounded-full focus:outline-none focus:border-gray-300 transition duration-150 ease-in-out">
<span class="px-2 py-1 rounded-md text-gray-700 bg-gray-100 hover:bg-gray-200">
<i class="fas fa-globe mr-1"></i> <span id="current-lang">English</span>
</span>
</button>
<div id="lang-dropdown" class="hidden origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5">
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100" onclick="changeLanguage('en')">English</a>
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100" onclick="changeLanguage('zh-CN')">简体中文</a>
</div>
</div>
</div>
<div class="-mr-2 flex items-center sm:hidden">
<!-- Mobile menu button -->
<button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500" aria-expanded="false" id="mobile-menu-button">
<span class="sr-only">Open main menu</span>
<i class="fas fa-bars"></i>
</button>
</div>
</div>
</div>
<!-- Mobile menu, show/hide based on menu state. -->
<div class="sm:hidden hidden" id="mobile-menu">
<div class="pt-2 pb-3 space-y-1">
<a href="index.html" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium" data-i18n="nav.home">Home</a>
<a href="blog.html" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium" data-i18n="nav.blog">Blog</a>
<a href="faq.html" class="bg-indigo-50 border-indigo-500 text-indigo-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium" data-i18n="nav.faq">FAQ</a>
<a href="about.html" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium" data-i18n="nav.about">About</a>
<a href="feedback.html" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium" data-i18n="nav.feedback">Feedback</a>
<div class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">
<span class="font-medium text-gray-500">Language:</span>
<div class="mt-1 flex space-x-2">
<a href="#" class="text-sm text-gray-700 hover:text-indigo-500" onclick="changeLanguage('en')">English</a>
<a href="#" class="text-sm text-gray-700 hover:text-indigo-500" onclick="changeLanguage('zh-CN')">简体中文</a>
<a href="#" class="text-sm text-gray-700 hover:text-indigo-500" onclick="changeLanguage('zh-TW')">繁體中文</a>
</div>
</div>
</div>
</div>
</nav>
<!-- Main Content -->
<div class="pt-16 pb-12">
<!-- FAQ Header -->
<div class="bg-indigo-700 text-white">
<div class="max-w-7xl mx-auto py-16 px-4 sm:py-24 sm:px-6 lg:px-8">
<div class="text-center">
<h1 class="text-4xl font-extrabold tracking-tight sm:text-5xl lg:text-6xl" data-i18n="faq.title">Frequently Asked Questions</h1>
<p class="mt-6 text-xl max-w-3xl mx-auto" data-i18n="faq.subtitle">Find answers to common questions about our address generation service.</p>
</div>
</div>
</div>
<!-- FAQ Content -->
<div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
<!-- FAQ Categories Sidebar -->
<div class="lg:col-span-1">
<div class="bg-white shadow-lg rounded-lg overflow-hidden sticky top-20">
<div class="p-6">
<h3 class="text-lg font-medium text-gray-900 mb-4" data-i18n="faq.categories.title">FAQ Categories</h3>
<nav class="space-y-1" aria-label="Sidebar">
<a href="#general" class="flex items-center px-3 py-2 text-sm font-medium rounded-md bg-indigo-50 text-indigo-700" aria-current="page">
<i class="fas fa-info-circle mr-3 text-indigo-500"></i>
<span class="truncate" data-i18n="faq.categories.general">General Questions</span>
</a>
<a href="#usage" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-gray-600 hover:bg-gray-50 hover:text-gray-900">
<i class="fas fa-user-cog mr-3 text-gray-400"></i>
<span class="truncate" data-i18n="faq.categories.usage">Usage & Features</span>
</a>
<a href="#privacy" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-gray-600 hover:bg-gray-50 hover:text-gray-900">
<i class="fas fa-shield-alt mr-3 text-gray-400"></i>
<span class="truncate" data-i18n="faq.categories.privacy">Privacy & Security</span>
</a>
<a href="#technical" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-gray-600 hover:bg-gray-50 hover:text-gray-900">
<i class="fas fa-cogs mr-3 text-gray-400"></i>
<span class="truncate" data-i18n="faq.categories.technical">Technical Details</span>
</a>
<a href="#billing" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-gray-600 hover:bg-gray-50 hover:text-gray-900">
<i class="fas fa-credit-card mr-3 text-gray-400"></i>
<span class="truncate" data-i18n="faq.categories.billing">Billing & Pricing</span>
</a>
</nav>
<div class="mt-8">
<h3 class="text-lg font-medium text-gray-900 mb-4" data-i18n="faq.contact.title">Still Have Questions?</h3>
<p class="text-sm text-gray-500 mb-4" data-i18n="faq.contact.subtitle">Can't find the answer you're looking for? Please feel free to contact our customer support team.</p>
<a href="feedback.html" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
<i class="fas fa-envelope mr-2"></i> <span data-i18n="faq.contact.button">Contact Support</span>
</a>
</div>
</div>
</div>
</div>
<!-- FAQ Questions -->
<div class="lg:col-span-2">
<!-- General Questions -->
<div id="general" class="mb-12">
<h2 class="text-2xl font-bold text-gray-900 mb-6" data-i18n="faq.categories.general">General Questions</h2>
<div class="space-y-4">
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item active">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.general.what.title">What is AddressGen?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.general.what.answer">AddressGen is a web application that generates random address information for various countries including the United States, United Kingdom, and Hong Kong. It creates realistic but fictional personal data such as addresses, names, phone numbers, email addresses, and credit card information for testing, development, or data privacy purposes.</p>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.general.why.title">Why would I need to generate random addresses?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.general.why.answer">Random address generation is useful for various purposes:</p>
<ul class="list-disc pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.general.why.list.0">Software testing and development</li>
<li data-i18n="faq.questions.general.why.list.1">Database population for demos</li>
<li data-i18n="faq.questions.general.why.list.2">UI/UX testing with realistic data</li>
<li data-i18n="faq.questions.general.why.list.3">Protecting privacy by avoiding the use of real personal information</li>
<li data-i18n="faq.questions.general.why.list.4">Creating sample data for educational purposes</li>
<li data-i18n="faq.questions.general.why.list.5">Testing e-commerce checkout flows</li>
</ul>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.general.countries.title">Which countries are supported?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.general.countries.answer">Currently, AddressGen supports address generation for:</p>
<ul class="list-disc pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.general.countries.list.0">United States (including all 50 states and territories)</li>
<li data-i18n="faq.questions.general.countries.list.1">United Kingdom (England, Scotland, Wales, and Northern Ireland)</li>
<li data-i18n="faq.questions.general.countries.list.2">Hong Kong</li>
</ul>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.general.countries.note">We're continuously working to add more countries and regions to our service. If you need a specific country that isn't currently supported, please let us know through our feedback page.</p>
</div>
</div>
</div>
</div>
<!-- Usage & Features -->
<div id="usage" class="mb-12">
<h2 class="text-2xl font-bold text-gray-900 mb-6" data-i18n="faq.categories.usage">Usage & Features</h2>
<div class="space-y-4">
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.usage.how.title">How do I generate address information?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.usage.how.answer">Generating address information is simple:</p>
<ol class="list-decimal pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.usage.how.steps.0">Select the country for which you want to generate addresses</li>
<li data-i18n="faq.questions.usage.how.steps.1">Choose the types of information you need (name, address, phone, email, credit card, etc.)</li>
<li data-i18n="faq.questions.usage.how.steps.2">Specify the quantity of records you want to generate (up to 100 at once)</li>
<li data-i18n="faq.questions.usage.how.steps.3">Click the "Generate Information" button</li>
<li data-i18n="faq.questions.usage.how.steps.4">View, copy, or download the generated data</li>
</ol>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.usage.what.title">What information types can I generate?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.usage.what.answer">AddressGen can generate the following types of information:</p>
<ul class="list-disc pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.usage.what.list.0">Full names (first, middle, last)</li>
<li data-i18n="faq.questions.usage.what.list.1">Complete addresses (street, city, state/province, postal code)</li>
<li data-i18n="faq.questions.usage.what.list.2">Phone numbers (formatted according to country standards)</li>
<li data-i18n="faq.questions.usage.what.list.3">Email addresses</li>
<li data-i18n="faq.questions.usage.what.list.4">Credit card information (number, expiration date, CVV)</li>
<li data-i18n="faq.questions.usage.what.list.5">Date of birth</li>
<li data-i18n="faq.questions.usage.what.list.6">Social Security Numbers (US) or ID numbers</li>
<li data-i18n="faq.questions.usage.what.list.7">Occupation and company information</li>
</ul>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.usage.what.note">You can select exactly which information types you need for your specific use case.</p>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.usage.download.title">Can I download the generated data?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.usage.download.answer">Yes, you can download the generated data in CSV (Comma-Separated Values) format, which can be easily imported into spreadsheet applications like Microsoft Excel or Google Sheets, as well as databases and other software systems.</p>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.usage.download.note">You can also copy the generated data directly to your clipboard for immediate use in other applications.</p>
</div>
</div>
</div>
</div>
<!-- Privacy & Security -->
<div id="privacy" class="mb-12">
<h2 class="text-2xl font-bold text-gray-900 mb-6" data-i18n="faq.categories.privacy">Privacy & Security</h2>
<div class="space-y-4">
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.privacy.real.title">Is the generated information real?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.privacy.real.answer">No, all information generated by AddressGen is completely fictional. While the data follows the correct formats and conventions for each country (such as postal code patterns, phone number formats, etc.), it does not correspond to real individuals, addresses, or credit cards.</p>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.privacy.real.note">Our algorithms ensure that the generated data looks realistic but does not match actual people or places, protecting privacy and preventing accidental misuse.</p>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.privacy.valid.title">Are the credit card numbers valid?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.privacy.valid.answer">The credit card numbers generated by our system pass the Luhn algorithm check (the standard validation algorithm used by credit card companies), which means they have valid formats and check digits. However, they are not connected to actual bank accounts and cannot be used for real transactions.</p>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.privacy.valid.note">These numbers are specifically designed for testing payment systems, forms, and software without using real credit card information.</p>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.privacy.store.title">Do you store the generated information?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.privacy.store.answer">No, we do not store any of the information generated by our service. All data is created on-demand when you request it and is not saved on our servers after it's delivered to you.</p>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.privacy.store.note">This approach ensures maximum privacy and security, as the generated data exists only on your device after generation.</p>
</div>
</div>
</div>
</div>
<!-- Technical Details -->
<div id="technical" class="mb-12">
<h2 class="text-2xl font-bold text-gray-900 mb-6" data-i18n="faq.categories.technical">Technical Details</h2>
<div class="space-y-4">
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.technical.how.title">How are the addresses generated?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.technical.how.answer">Our address generation system uses a combination of algorithms and databases of common street names, cities, states/provinces, and postal code patterns for each supported country. The system ensures that:</p>
<ul class="list-disc pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.technical.how.list.0">Street numbers are within realistic ranges</li>
<li data-i18n="faq.questions.technical.how.list.1">Street names sound natural and follow country-specific patterns</li>
<li data-i18n="faq.questions.technical.how.list.2">Cities are paired with their correct states/provinces</li>
<li data-i18n="faq.questions.technical.how.list.3">Postal codes match the correct format for the region</li>
<li data-i18n="faq.questions.technical.how.list.4">All components together form a plausible (though fictional) address</li>
</ul>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.technical.api.title">Is there an API available?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.technical.api.answer">Yes, we offer a RESTful API that allows developers to integrate our address generation capabilities directly into their applications, testing frameworks, or development environments.</p>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.technical.api.note">The API supports all the same features as the web interface, including:</p>
<ul class="list-disc pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.technical.api.list.0">Selecting specific countries</li>
<li data-i18n="faq.questions.technical.api.list.1">Choosing which information types to generate</li>
<li data-i18n="faq.questions.technical.api.list.2">Generating multiple records in a single request</li>
<li data-i18n="faq.questions.technical.api.list.3">Receiving data in JSON or CSV format</li>
</ul>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.technical.api.note">For API documentation and access keys, please visit our developer portal or contact our support team.</p>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.technical.rate.title">What are the rate limits?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.technical.rate.answer">Our service has the following rate limits:</p>
<ul class="list-disc pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.technical.rate.list.0"><strong>Web Interface:</strong> Up to 100 records per generation, with a maximum of 1,000 records per day for free users</li>
<li data-i18n="faq.questions.technical.rate.list.1"><strong>API - Free Tier:</strong> 100 requests per day, maximum 100 records per request</li>
<li data-i18n="faq.questions.technical.rate.list.2"><strong>API - Basic Tier:</strong> 1,000 requests per day, maximum 500 records per request</li>
<li data-i18n="faq.questions.technical.rate.list.3"><strong>API - Professional Tier:</strong> 10,000 requests per day, maximum 1,000 records per request</li>
<li data-i18n="faq.questions.technical.rate.list.4"><strong>API - Enterprise Tier:</strong> Custom limits based on your needs</li>
</ul>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.technical.rate.note">If you need higher limits, please contact us to discuss custom solutions.</p>
</div>
</div>
</div>
</div>
<!-- Billing & Pricing -->
<div id="billing" class="mb-12">
<h2 class="text-2xl font-bold text-gray-900 mb-6" data-i18n="faq.categories.billing">Billing & Pricing</h2>
<div class="space-y-4">
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.billing.free.title">Is AddressGen free to use?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.billing.free.answer">Yes, the basic web interface of AddressGen is free to use with certain limitations:</p>
<ul class="list-disc pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.billing.free.list.0">Up to 100 records per generation</li>
<li data-i18n="faq.questions.billing.free.list.1">Maximum of 1,000 records per day</li>
<li data-i18n="faq.questions.billing.free.list.2">Access to all supported countries</li>
<li data-i18n="faq.questions.billing.free.list.3">All information types available</li>
<li data-i18n="faq.questions.billing.free.list.4">CSV download capability</li>
</ul>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.billing.free.note">For higher volume needs or API access, we offer paid subscription plans.</p>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.billing.plans.title">What subscription plans are available?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.billing.plans.answer">We offer several subscription plans to meet different needs:</p>
<ul class="list-disc pl-5 mt-2 text-gray-500 space-y-1">
<li data-i18n="faq.questions.billing.plans.list.0"><strong>Free:</strong> Basic web access with limited daily generations</li>
<li data-i18n="faq.questions.billing.plans.list.1"><strong>Basic ($9.99/month):</strong> Increased limits and basic API access</li>
<li data-i18n="faq.questions.billing.plans.list.2"><strong>Professional ($29.99/month):</strong> Higher limits, full API access, and priority support</li>
<li data-i18n="faq.questions.billing.plans.list.3"><strong>Enterprise (Custom pricing):</strong> Custom limits, dedicated support, and SLA guarantees</li>
</ul>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.billing.plans.note">All paid plans are billed monthly with the option for annual billing at a discount. Visit our pricing page for detailed feature comparisons.</p>
</div>
</div>
<div class="bg-white shadow-lg rounded-lg overflow-hidden faq-item">
<button class="w-full px-6 py-4 text-left focus:outline-none flex justify-between items-center">
<span class="text-lg font-medium text-gray-900" data-i18n="faq.questions.billing.refund.title">Do you offer refunds?</span>
<span>
<i class="fas fa-plus text-indigo-500 faq-icon-plus"></i>
<i class="fas fa-minus text-indigo-500 faq-icon-minus"></i>
</span>
</button>
<div class="px-6 pb-4 faq-answer">
<p class="text-gray-500" data-i18n="faq.questions.billing.refund.answer">Yes, we offer a 14-day money-back guarantee for all new subscriptions. If you're not satisfied with our service within the first 14 days, you can request a full refund with no questions asked.</p>
<p class="text-gray-500 mt-2" data-i18n="faq.questions.billing.refund.note">For refund requests after the initial 14-day period, please contact our support team to discuss your specific situation.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<footer class="bg-white">
<div class="max-w-7xl mx-auto py-12 px-4 overflow-hidden sm:px-6 lg:px-8">
<nav class="-mx-5 -my-2 flex flex-wrap justify-center" aria-label="Footer">
<div class="px-5 py-2">
<a href="index.html" class="text-base text-gray-500 hover:text-gray-900" data-i18n="footer.nav.home">Home</a>
</div>
<div class="px-5 py-2">
<a href="blog.html" class="text-base text-gray-500 hover:text-gray-900" data-i18n="footer.nav.blog">Blog</a>
</div>
<div class="px-5 py-2">
<a href="faq.html" class="text-base text-gray-500 hover:text-gray-900" data-i18n="footer.nav.faq">FAQ</a>
</div>
<div class="px-5 py-2">
<a href="about.html" class="text-base text-gray-500 hover:text-gray-900" data-i18n="footer.nav.about">About</a>
</div>
<div class="px-5 py-2">
<a href="feedback.html" class="text-base text-gray-500 hover:text-gray-900" data-i18n="footer.nav.feedback">Feedback</a>
</div>
</nav>
<p class="mt-8 text-center text-base text-gray-400" data-i18n="footer.copyright">© 2023 AddressGen. All rights reserved.</p>
</div>
</footer>
<!-- JavaScript -->
<script src="js/i18n.js"></script>
<script>
// Mobile menu toggle
document.getElementById('mobile-menu-button').addEventListener('click', function() {
const mobileMenu = document.getElementById('mobile-menu');
mobileMenu.classList.toggle('hidden');
});
// FAQ item toggle
document.querySelectorAll('.faq-item button').forEach(button => {
button.addEventListener('click', function() {
const faqItem = this.parentElement;
faqItem.classList.toggle('active');
});
});
// Smooth scrolling for anchor links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function(e) {
e.preventDefault();
const targetId = this.getAttribute('href');
const targetElement = document.querySelector(targetId);
if (targetElement) {
window.scrollTo({
top: targetElement.offsetTop - 80, // Adjust for fixed header
behavior: 'smooth'
});
// Update active state in sidebar
document.querySelectorAll('nav[aria-label="Sidebar"] a').forEach(link => {
if (link.getAttribute('href') === targetId) {
link.classList.add('bg-indigo-50', 'text-indigo-700');
link.classList.remove('text-gray-600', 'hover:bg-gray-50', 'hover:text-gray-900');
link.querySelector('i').classList.add('text-indigo-500');
link.querySelector('i').classList.remove('text-gray-400');
} else {
link.classList.remove('bg-indigo-50', 'text-indigo-700');
link.classList.add('text-gray-600', 'hover:bg-gray-50', 'hover:text-gray-900');
link.querySelector('i').classList.remove('text-indigo-500');
link.querySelector('i').classList.add('text-gray-400');
}
});
}
});
});
</script>
</body>
</html>