Hugging Face's logo

Spaces:
cliffhop
/
classactionfinder
Running

App Files Community
cliffhop commited on
Commit
b1f7590
·
verified ·
1 Parent(s): def2405

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +1319 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Test
3
- emoji: 👀
4
- colorFrom: indigo
5
- colorTo: pink
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: test
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: blue
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,1319 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>SettleRight - Find Your Class Action Claim</title>
7
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
8
+ <style>
9
+ :root {
10
+ --primary: #2c3e50;
11
+ --secondary: #3498db;
12
+ --accent: #e74c3c;
13
+ --light: #ecf0f1;
14
+ --dark: #2c3e50;
15
+ --gray: #95a5a6;
16
+ --success: #27ae60;
17
+ }
18
+
19
+ * {
20
+ margin: 0;
21
+ padding: 0;
22
+ box-sizing: border-box;
23
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
24
+ }
25
+
26
+ body {
27
+ background-color: #f5f7fa;
28
+ color: var(--dark);
29
+ line-height: 1.6;
30
+ }
31
+
32
+ header {
33
+ background-color: var(--primary);
34
+ color: white;
35
+ padding: 1rem 5%;
36
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
37
+ position: sticky;
38
+ top: 0;
39
+ z-index: 100;
40
+ }
41
+
42
+ nav {
43
+ display: flex;
44
+ justify-content: space-between;
45
+ align-items: center;
46
+ }
47
+
48
+ .logo {
49
+ display: flex;
50
+ align-items: center;
51
+ gap: 10px;
52
+ }
53
+
54
+ .logo i {
55
+ font-size: 1.8rem;
56
+ color: var(--secondary);
57
+ }
58
+
59
+ .logo h1 {
60
+ font-size: 1.5rem;
61
+ font-weight: 700;
62
+ }
63
+
64
+ .nav-links {
65
+ display: flex;
66
+ gap: 1.5rem;
67
+ }
68
+
69
+ .nav-links a {
70
+ color: white;
71
+ text-decoration: none;
72
+ font-weight: 500;
73
+ transition: color 0.3s;
74
+ }
75
+
76
+ .nav-links a:hover {
77
+ color: var(--secondary);
78
+ }
79
+
80
+ .menu-toggle {
81
+ display: none;
82
+ background: none;
83
+ border: none;
84
+ color: white;
85
+ font-size: 1.5rem;
86
+ cursor: pointer;
87
+ }
88
+
89
+ .hero {
90
+ background: linear-gradient(135deg, var(--primary), var(--secondary));
91
+ color: white;
92
+ padding: 4rem 5%;
93
+ text-align: center;
94
+ }
95
+
96
+ .hero h2 {
97
+ font-size: 2.5rem;
98
+ margin-bottom: 1rem;
99
+ }
100
+
101
+ .hero p {
102
+ font-size: 1.1rem;
103
+ max-width: 700px;
104
+ margin: 0 auto 2rem;
105
+ }
106
+
107
+ .search-container {
108
+ max-width: 800px;
109
+ margin: 0 auto;
110
+ background: white;
111
+ padding: 1.5rem;
112
+ border-radius: 10px;
113
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
114
+ }
115
+
116
+ .search-box {
117
+ display: flex;
118
+ gap: 10px;
119
+ }
120
+
121
+ .search-box input {
122
+ flex: 1;
123
+ padding: 12px 15px;
124
+ border: 1px solid var(--gray);
125
+ border-radius: 5px;
126
+ font-size: 1rem;
127
+ }
128
+
129
+ .search-box button {
130
+ padding: 12px 25px;
131
+ background-color: var(--accent);
132
+ color: white;
133
+ border: none;
134
+ border-radius: 5px;
135
+ font-weight: 600;
136
+ cursor: pointer;
137
+ transition: background-color 0.3s;
138
+ }
139
+
140
+ .search-box button:hover {
141
+ background-color: #c0392b;
142
+ }
143
+
144
+ .search-tags {
145
+ display: flex;
146
+ flex-wrap: wrap;
147
+ gap: 10px;
148
+ margin-top: 1rem;
149
+ justify-content: center;
150
+ }
151
+
152
+ .search-tag {
153
+ padding: 5px 15px;
154
+ background-color: var(--light);
155
+ color: var(--dark);
156
+ border-radius: 20px;
157
+ font-size: 0.9rem;
158
+ cursor: pointer;
159
+ transition: all 0.3s;
160
+ }
161
+
162
+ .search-tag:hover {
163
+ background-color: var(--secondary);
164
+ color: white;
165
+ }
166
+
167
+ .container {
168
+ padding: 3rem 5%;
169
+ }
170
+
171
+ .section-header {
172
+ text-align: center;
173
+ margin-bottom: 2rem;
174
+ }
175
+
176
+ .section-header h2 {
177
+ font-size: 2rem;
178
+ color: var(--primary);
179
+ margin-bottom: 0.5rem;
180
+ }
181
+
182
+ .section-header p {
183
+ color: var(--gray);
184
+ max-width: 700px;
185
+ margin: 0 auto;
186
+ }
187
+
188
+ .filter-container {
189
+ display: flex;
190
+ gap: 15px;
191
+ margin-bottom: 2rem;
192
+ flex-wrap: wrap;
193
+ }
194
+
195
+ .filter-dropdown {
196
+ flex: 1;
197
+ min-width: 200px;
198
+ }
199
+
200
+ .filter-dropdown label {
201
+ display: block;
202
+ margin-bottom: 5px;
203
+ font-weight: 500;
204
+ color: var(--primary);
205
+ }
206
+
207
+ .filter-dropdown select {
208
+ width: 100%;
209
+ padding: 10px;
210
+ border: 1px solid var(--gray);
211
+ border-radius: 5px;
212
+ background-color: white;
213
+ }
214
+
215
+ .lawsuits-grid {
216
+ display: grid;
217
+ grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
218
+ gap: 1.5rem;
219
+ }
220
+
221
+ .lawsuit-card {
222
+ background-color: white;
223
+ border-radius: 8px;
224
+ overflow: hidden;
225
+ box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
226
+ transition: transform 0.3s, box-shadow 0.3s;
227
+ }
228
+
229
+ .lawsuit-card:hover {
230
+ transform: translateY(-5px);
231
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
232
+ }
233
+
234
+ .lawsuit-img {
235
+ height: 150px;
236
+ background-color: var(--light);
237
+ position: relative;
238
+ overflow: hidden;
239
+ }
240
+
241
+ .lawsuit-img img {
242
+ width: 100%;
243
+ height: 100%;
244
+ object-fit: cover;
245
+ }
246
+
247
+ .lawsuit-category {
248
+ position: absolute;
249
+ top: 15px;
250
+ left: 15px;
251
+ padding: 3px 10px;
252
+ background-color: var(--secondary);
253
+ color: white;
254
+ border-radius: 3px;
255
+ font-size: 0.8rem;
256
+ font-weight: 500;
257
+ }
258
+
259
+ .lawsuit-content {
260
+ padding: 1.5rem;
261
+ }
262
+
263
+ .lawsuit-content h3 {
264
+ font-size: 1.2rem;
265
+ margin-bottom: 0.5rem;
266
+ color: var(--primary);
267
+ }
268
+
269
+ .lawsuit-company {
270
+ display: flex;
271
+ align-items: center;
272
+ gap: 5px;
273
+ color: var(--gray);
274
+ font-size: 0.9rem;
275
+ margin-bottom: 0.5rem;
276
+ }
277
+
278
+ .lawsuit-desc {
279
+ font-size: 0.9rem;
280
+ color: var(--dark);
281
+ margin-bottom: 1rem;
282
+ display: -webkit-box;
283
+ -webkit-line-clamp: 3;
284
+ -webkit-box-orient: vertical;
285
+ overflow: hidden;
286
+ }
287
+
288
+ .lawsuit-stats {
289
+ display: flex;
290
+ justify-content: space-between;
291
+ margin-bottom: 1rem;
292
+ padding-bottom: 1rem;
293
+ border-bottom: 1px solid var(--light);
294
+ }
295
+
296
+ .stat-item {
297
+ text-align: center;
298
+ }
299
+
300
+ .stat-item .stat-value {
301
+ font-weight: 700;
302
+ color: var(--accent);
303
+ }
304
+
305
+ .stat-item .stat-label {
306
+ font-size: 0.8rem;
307
+ color: var(--gray);
308
+ }
309
+
310
+ .lawsuit-footer {
311
+ display: flex;
312
+ justify-content: space-between;
313
+ align-items: center;
314
+ }
315
+
316
+ .lawsuit-deadline {
317
+ font-size: 0.9rem;
318
+ color: var(--accent);
319
+ font-weight: 600;
320
+ }
321
+
322
+ .lawsuit-btn {
323
+ padding: 8px 15px;
324
+ background-color: var(--secondary);
325
+ color: white;
326
+ border: none;
327
+ border-radius: 5px;
328
+ font-weight: 500;
329
+ cursor: pointer;
330
+ transition: background-color 0.3s;
331
+ }
332
+
333
+ .lawsuit-btn:hover {
334
+ background-color: #2980b9;
335
+ }
336
+
337
+ .firms-section {
338
+ background-color: var(--light);
339
+ padding: 3rem 5%;
340
+ }
341
+
342
+ .firms-grid {
343
+ display: grid;
344
+ grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
345
+ gap: 1.5rem;
346
+ }
347
+
348
+ .firm-card {
349
+ background-color: white;
350
+ border-radius: 8px;
351
+ padding: 1.5rem;
352
+ box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
353
+ text-align: center;
354
+ }
355
+
356
+ .firm-logo {
357
+ width: 80px;
358
+ height: 80px;
359
+ margin: 0 auto 1rem;
360
+ background-color: var(--light);
361
+ border-radius: 50%;
362
+ display: flex;
363
+ align-items: center;
364
+ justify-content: center;
365
+ overflow: hidden;
366
+ }
367
+
368
+ .firm-logo img {
369
+ max-width: 100%;
370
+ max-height: 100%;
371
+ }
372
+
373
+ .firm-card h3 {
374
+ font-size: 1.1rem;
375
+ margin-bottom: 0.5rem;
376
+ }
377
+
378
+ .firm-specialty {
379
+ font-size: 0.8rem;
380
+ color: var(--gray);
381
+ margin-bottom: 1rem;
382
+ }
383
+
384
+ .firm-rating {
385
+ color: var(--accent);
386
+ margin-bottom: 1rem;
387
+ font-size: 0.9rem;
388
+ }
389
+
390
+ .firm-btn {
391
+ padding: 8px 15px;
392
+ background-color: var(--primary);
393
+ color: white;
394
+ border: none;
395
+ border-radius: 5px;
396
+ font-size: 0.9rem;
397
+ cursor: pointer;
398
+ transition: background-color 0.3s;
399
+ }
400
+
401
+ .firm-btn:hover {
402
+ background-color: var(--dark);
403
+ }
404
+
405
+ .cta-section {
406
+ background: linear-gradient(135deg, var(--secondary), var(--primary));
407
+ color: white;
408
+ padding: 4rem 5%;
409
+ text-align: center;
410
+ }
411
+
412
+ .cta-content {
413
+ max-width: 700px;
414
+ margin: 0 auto;
415
+ }
416
+
417
+ .cta-content h2 {
418
+ font-size: 2rem;
419
+ margin-bottom: 1rem;
420
+ }
421
+
422
+ .cta-content p {
423
+ margin-bottom: 2rem;
424
+ }
425
+
426
+ .cta-btn {
427
+ padding: 12px 30px;
428
+ background-color: white;
429
+ color: var(--primary);
430
+ border: none;
431
+ border-radius: 5px;
432
+ font-weight: 600;
433
+ font-size: 1rem;
434
+ cursor: pointer;
435
+ transition: all 0.3s;
436
+ }
437
+
438
+ .cta-btn:hover {
439
+ background-color: var(--accent);
440
+ color: white;
441
+ }
442
+
443
+ footer {
444
+ background-color: var(--dark);
445
+ color: white;
446
+ padding: 3rem 5%;
447
+ }
448
+
449
+ .footer-content {
450
+ display: grid;
451
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
452
+ gap: 2rem;
453
+ margin-bottom: 2rem;
454
+ }
455
+
456
+ .footer-column h3 {
457
+ font-size: 1.1rem;
458
+ margin-bottom: 1rem;
459
+ color: var(--secondary);
460
+ }
461
+
462
+ .footer-column ul {
463
+ list-style: none;
464
+ }
465
+
466
+ .footer-column ul li {
467
+ margin-bottom: 0.5rem;
468
+ }
469
+
470
+ .footer-column ul li a {
471
+ color: var(--light);
472
+ text-decoration: none;
473
+ transition: color 0.3s;
474
+ }
475
+
476
+ .footer-column ul li a:hover {
477
+ color: var(--secondary);
478
+ }
479
+
480
+ .footer-bottom {
481
+ text-align: center;
482
+ padding-top: 2rem;
483
+ border-top: 1px solid rgba(255, 255, 255, 0.1);
484
+ color: var(--gray);
485
+ font-size: 0.9rem;
486
+ }
487
+
488
+ .pagination {
489
+ display: flex;
490
+ justify-content: center;
491
+ gap: 10px;
492
+ margin-top: 2rem;
493
+ }
494
+
495
+ .pagination button {
496
+ padding: 8px 15px;
497
+ background-color: white;
498
+ border: 1px solid var(--light);
499
+ border-radius: 5px;
500
+ cursor: pointer;
501
+ transition: all 0.3s;
502
+ }
503
+
504
+ .pagination button.active {
505
+ background-color: var(--secondary);
506
+ color: white;
507
+ border-color: var(--secondary);
508
+ }
509
+
510
+ .pagination button:hover:not(.active) {
511
+ background-color: var(--light);
512
+ }
513
+
514
+ @media (max-width: 768px) {
515
+ .nav-links {
516
+ display: none;
517
+ flex-direction: column;
518
+ position: absolute;
519
+ top: 70px;
520
+ left: 0;
521
+ width: 100%;
522
+ background-color: var(--primary);
523
+ padding: 1rem;
524
+ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
525
+ }
526
+
527
+ .nav-links.active {
528
+ display: flex;
529
+ }
530
+
531
+ .menu-toggle {
532
+ display: block;
533
+ }
534
+
535
+ .hero h2 {
536
+ font-size: 2rem;
537
+ }
538
+
539
+ .search-box {
540
+ flex-direction: column;
541
+ }
542
+
543
+ .lawsuit-card,
544
+ .firm-card {
545
+ min-width: 100%;
546
+ }
547
+ }
548
+
549
+ /* Modal styles */
550
+ .modal {
551
+ display: none;
552
+ position: fixed;
553
+ top: 0;
554
+ left: 0;
555
+ width: 100%;
556
+ height: 100%;
557
+ background-color: rgba(0, 0, 0, 0.7);
558
+ z-index: 1000;
559
+ justify-content: center;
560
+ align-items: center;
561
+ }
562
+
563
+ .modal-content {
564
+ background-color: white;
565
+ width: 90%;
566
+ max-width: 600px;
567
+ border-radius: 10px;
568
+ overflow: hidden;
569
+ box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
570
+ max-height: 90vh;
571
+ overflow-y: auto;
572
+ }
573
+
574
+ .modal-header {
575
+ background-color: var(--primary);
576
+ color: white;
577
+ padding: 1rem;
578
+ display: flex;
579
+ justify-content: space-between;
580
+ align-items: center;
581
+ }
582
+
583
+ .modal-header h3 {
584
+ font-size: 1.3rem;
585
+ }
586
+
587
+ .close-modal {
588
+ background: none;
589
+ border: none;
590
+ color: white;
591
+ font-size: 1.5rem;
592
+ cursor: pointer;
593
+ }
594
+
595
+ .modal-body {
596
+ padding: 1.5rem;
597
+ }
598
+
599
+ .eligibility-check {
600
+ margin-bottom: 1.5rem;
601
+ }
602
+
603
+ .eligibility-check h4 {
604
+ margin-bottom: 0.5rem;
605
+ color: var(--primary);
606
+ }
607
+
608
+ .form-group {
609
+ margin-bottom: 1rem;
610
+ }
611
+
612
+ .form-group label {
613
+ display: block;
614
+ margin-bottom: 0.5rem;
615
+ font-weight: 500;
616
+ }
617
+
618
+ .form-group input,
619
+ .form-group select,
620
+ .form-group textarea {
621
+ width: 100%;
622
+ padding: 10px;
623
+ border: 1px solid var(--gray);
624
+ border-radius: 5px;
625
+ }
626
+
627
+ .modal-footer {
628
+ padding: 1rem;
629
+ border-top: 1px solid var(--light);
630
+ display: flex;
631
+ justify-content: flex-end;
632
+ gap: 10px;
633
+ }
634
+
635
+ .btn {
636
+ padding: 8px 15px;
637
+ border-radius: 5px;
638
+ cursor: pointer;
639
+ font-weight: 500;
640
+ }
641
+
642
+ .btn-primary {
643
+ background-color: var(--secondary);
644
+ color: white;
645
+ border: none;
646
+ }
647
+
648
+ .btn-secondary {
649
+ background-color: var(--light);
650
+ color: var(--dark);
651
+ border: 1px solid var(--gray);
652
+ }
653
+ </style>
654
+ </head>
655
+ <body>
656
+ <header>
657
+ <nav>
658
+ <div class="logo">
659
+ <i class="fas fa-gavel"></i>
660
+ <h1>SettleRight</h1>
661
+ </div>
662
+ <button class="menu-toggle">
663
+ <i class="fas fa-bars"></i>
664
+ </button>
665
+ <div class="nav-links">
666
+ <a href="#search">Find Claims</a>
667
+ <a href="#lawsuits">Active Cases</a>
668
+ <a href="#firms">Law Firms</a>
669
+ <a href="#about">About</a>
670
+ <a href="#contact">Contact</a>
671
+ </div>
672
+ </nav>
673
+ </header>
674
+
675
+ <section class="hero">
676
+ <h2>Find Unclaimed Class Action Settlements</h2>
677
+ <p>Discover if you're eligible for compensation from ongoing class action lawsuits. Our database tracks thousands of cases and estimated payout amounts.</p>
678
+ <div class="search-container" id="search">
679
+ <div class="search-box">
680
+ <input type="text" placeholder="Search by company, product, or lawsuit type..." id="search-input">
681
+ <button id="search-btn">Search</button>
682
+ </div>
683
+ <div class="search-tags">
684
+ <div class="search-tag" data-category="data-breach">Data Breaches</div>
685
+ <div class="search-tag" data-category="product-defect">Product Defects</div>
686
+ <div class="search-tag" data-category="employment">Employment</div>
687
+ <div class="search-tag" data-category="consumer">Consumer Fraud</div>
688
+ <div class="search-tag" data-category="securities">Securities</div>
689
+ </div>
690
+ </div>
691
+ </section>
692
+
693
+ <section class="container" id="lawsuits">
694
+ <div class="section-header">
695
+ <h2>Active Class Action Lawsuits</h2>
696
+ <p>Browse through the most recent class action settlements open for claims.</p>
697
+ </div>
698
+
699
+ <div class="filter-container">
700
+ <div class="filter-dropdown">
701
+ <label for="category-filter">Category</label>
702
+ <select id="category-filter">
703
+ <option value="all">All Categories</option>
704
+ <option value="data-breach">Data Breaches</option>
705
+ <option value="product-defect">Product Defects</option>
706
+ <option value="employment">Employment</option>
707
+ <option value="consumer">Consumer Fraud</option>
708
+ <option value="securities">Securities</option>
709
+ </select>
710
+ </div>
711
+ <div class="filter-dropdown">
712
+ <label for="status-filter">Status</label>
713
+ <select id="status-filter">
714
+ <option value="all">All Statuses</option>
715
+ <option value="open">Open for Claims</option>
716
+ <option value="pending">Pending Approval</option>
717
+ <option value="settled">Settled - Paying Out</option>
718
+ </select>
719
+ </div>
720
+ <div class="filter-dropdown">
721
+ <label for="sort-by">Sort By</label>
722
+ <select id="sort-by">
723
+ <option value="newest">Newest First</option>
724
+ <option value="deadline">Claim Deadline</option>
725
+ <option value="payout">Highest Payout</option>
726
+ </select>
727
+ </div>
728
+ </div>
729
+
730
+ <div class="lawsuits-grid" id="lawsuits-grid">
731
+ <!-- Lawsuit cards will be inserted here by JavaScript -->
732
+ </div>
733
+
734
+ <div class="pagination">
735
+ <button class="active">1</button>
736
+ <button>2</button>
737
+ <button>3</button>
738
+ <button>4</button>
739
+ <button>5</button>
740
+ </div>
741
+ </section>
742
+
743
+ <section class="firms-section" id="firms">
744
+ <div class="section-header">
745
+ <h2>Top Class Action Law Firms</h2>
746
+ <p>These firms are currently handling multiple class action cases.</p>
747
+ </div>
748
+
749
+ <div class="firms-grid" id="firms-grid">
750
+ <!-- Firm cards will be inserted here by JavaScript -->
751
+ </div>
752
+ </section>
753
+
754
+ <section class="cta-section">
755
+ <div class="cta-content">
756
+ <h2>Don't See Your Case Listed?</h2>
757
+ <p>We're constantly updating our database with new class action settlements. Sign up to receive alerts when new cases become available that match your profile.</p>
758
+ <button class="cta-btn">Get Settlement Alerts</button>
759
+ </div>
760
+ </section>
761
+
762
+ <footer>
763
+ <div class="footer-content">
764
+ <div class="footer-column">
765
+ <h3>SettleRight</h3>
766
+ <ul>
767
+ <li><a href="#about">About Us</a></li>
768
+ <li><a href="#how-it-works">How It Works</a></li>
769
+ <li><a href="#faq">FAQ</a></li>
770
+ <li><a href="#blog">Blog</a></li>
771
+ </ul>
772
+ </div>
773
+ <div class="footer-column">
774
+ <h3>Legal Types</h3>
775
+ <ul>
776
+ <li><a href="#consumer">Consumer Class Actions</a></li>
777
+ <li><a href="#employment">Employment Lawsuits</a></li>
778
+ <li><a href="#data-breach">Data Breaches</a></li>
779
+ <li><a href="#securities">Securities Fraud</a></li>
780
+ </ul>
781
+ </div>
782
+ <div class="footer-column">
783
+ <h3>Resources</h3>
784
+ <ul>
785
+ <li><a href="#guides">Claim Guides</a></li>
786
+ <li><a href="#timeline">Settlement Timeline</a></li>
787
+ <li><a href="#calculator">Payout Calculator</a></li>
788
+ <li><a href="#glossary">Legal Glossary</a></li>
789
+ </ul>
790
+ </div>
791
+ <div class="footer-column">
792
+ <h3>Contact</h3>
793
+ <ul>
794
+ <li><a href="mailto:[email protected]">[email protected]</a></li>
795
+ <li><a href="tel:+18005551234">(800) 555-1234</a></li>
796
+ <li><a href="#contact">Contact Form</a></li>
797
+ <li><a href="#press">Press Inquiries</a></li>
798
+ </ul>
799
+ </div>
800
+ </div>
801
+ <div class="footer-bottom">
802
+ <p>&copy; 2023 SettleRight. All rights reserved. | <a href="#privacy">Privacy Policy</a> | <a href="#terms">Terms of Service</a></p>
803
+ <p>Disclaimer: SettleRight is not a law firm and does not provide legal advice. The information provided is for educational purposes only.</p>
804
+ </div>
805
+ </footer>
806
+
807
+ <!-- Modal for lawsuit details -->
808
+ <div class="modal" id="lawsuit-modal">
809
+ <div class="modal-content">
810
+ <div class="modal-header">
811
+ <h3 id="modal-title">Class Action Lawsuit Details</h3>
812
+ <button class="close-modal">&times;</button>
813
+ </div>
814
+ <div class="modal-body">
815
+ <div class="eligibility-check">
816
+ <h4>Check Your Eligibility</h4>
817
+ <p>Complete this short questionnaire to see if you qualify for this settlement.</p>
818
+
819
+ <div class="form-group">
820
+ <label for="purchase-date">Did you purchase/use the product between these dates?</label>
821
+ <input type="text" id="purchase-date" placeholder="Enter approximate dates" readonly>
822
+ </div>
823
+
824
+ <div class="form-group">
825
+ <label for="product-owned">Did you own/use the product?</label>
826
+ <select id="product-owned">
827
+ <option value="">Select an option</option>
828
+ <option value="yes">Yes</option>
829
+ <option value="no">No</option>
830
+ </select>
831
+ </div>
832
+
833
+ <div class="form-group">
834
+ <label for="issue-experienced">Did you experience the issue described in the lawsuit?</label>
835
+ <select id="issue-experienced">
836
+ <option value="">Select an option</option>
837
+ <option value="yes">Yes</option>
838
+ <option value="no">No</option>
839
+ <option value="unsure">I'm not sure</option>
840
+ </select>
841
+ </div>
842
+
843
+ <div class="form-group">
844
+ <label for="additional-info">Additional Information (Optional)</label>
845
+ <textarea id="additional-info" rows="3" placeholder="Provide any additional details that may help determine eligibility"></textarea>
846
+ </div>
847
+ </div>
848
+
849
+ <div>
850
+ <h4>Next Steps</h4>
851
+ <p>If you believe you're eligible, you'll need to:</p>
852
+ <ol>
853
+ <li>Gather any documentation (receipts, product serial numbers, etc.)</li>
854
+ <li>Complete the official claim form through the settlement administrator</li>
855
+ <li>Submit by the deadline: <span id="modal-deadline">TBD</span></li>
856
+ </ol>
857
+ <p>Average payout for this case: <strong id="modal-payout">$TBD</strong></p>
858
+ <p>This case is being handled by: <strong id="modal-firm">TBD Law Firm</strong></p>
859
+ </div>
860
+ </div>
861
+ <div class="modal-footer">
862
+ <button class="btn btn-secondary close-modal">Cancel</button>
863
+ <button class="btn btn-primary" id="submit-eligibility">Submit Eligibility Check</button>
864
+ </div>
865
+ </div>
866
+ </div>
867
+
868
+ <script>
869
+ // Sample data for lawsuits
870
+ const lawsuits = [
871
+ {
872
+ id: 1,
873
+ title: "Facebook Data Privacy Settlement",
874
+ company: "Meta Platforms, Inc.",
875
+ category: "data-breach",
876
+ description: "Settlement over allegations that Facebook collected and stored biometric data without user consent.",
877
+ image: "https://via.placeholder.com/400x200?text=Facebook+Case",
878
+ stats: {
879
+ avgPayout: "$400",
880
+ claimants: "1.6M",
881
+ totalSettlement: "$650M"
882
+ },
883
+ deadline: "2023-11-15",
884
+ status: "open",
885
+ lawFirm: "Edelson PC"
886
+ },
887
+ {
888
+ id: 2,
889
+ title: "Johnson & Johnson Talcum Powder Lawsuit",
890
+ company: "Johnson & Johnson",
891
+ category: "product-defect",
892
+ description: "Settlement alleging that talcum powder products caused ovarian cancer in long-term users.",
893
+ image: "https://via.placeholder.com/400x200?text=J%26J+Talcum+Powder",
894
+ stats: {
895
+ avgPayout: "$150,000",
896
+ claimants: "25,000",
897
+ totalSettlement: "$8.9B"
898
+ },
899
+ deadline: "2024-01-31",
900
+ status: "pending",
901
+ lawFirm: "Beasley Allen Law Firm"
902
+ },
903
+ {
904
+ id: 3,
905
+ title: "Google Location Tracking Settlement",
906
+ company: "Google LLC",
907
+ category: "data-breach",
908
+ description: "Settlement over allegations that Google misled users about location tracking practices.",
909
+ image: "https://via.placeholder.com/400x200?text=Google+Tracking",
910
+ stats: {
911
+ avgPayout: "$75",
912
+ claimants: "4.2M",
913
+ totalSettlement: "$93M"
914
+ },
915
+ deadline: "2023-12-01",
916
+ status: "open",
917
+ lawFirm: "Lieff Cabraser"
918
+ },
919
+ {
920
+ id: 4,
921
+ title: "Walmart Wage Theft Class Action",
922
+ company: "Walmart Inc.",
923
+ category: "employment",
924
+ description: "Lawsuit alleging wage theft and overtime violations across multiple states.",
925
+ image: "https://via.placeholder.com/400x200?text=Walmart+Employment",
926
+ stats: {
927
+ avgPayout: "$1,200",
928
+ claimants: "187,000",
929
+ totalSettlement: "$65M"
930
+ },
931
+ deadline: "2024-03-15",
932
+ status: "open",
933
+ lawFirm: "Morgan & Morgan"
934
+ },
935
+ {
936
+ id: 5,
937
+ title: "Boeing 737 MAX Defect Settlement",
938
+ company: "Boeing Company",
939
+ category: "product-defect",
940
+ description: "Settlement for passengers affected by the grounding of 737 MAX aircraft.",
941
+ image: "https://via.placeholder.com/400x200?text=Boeing+737+MAX",
942
+ stats: {
943
+ avgPayout: "$9,000",
944
+ claimants: "12,500",
945
+ totalSettlement: "$110M"
946
+ },
947
+ deadline: "2023-09-30",
948
+ status: "open",
949
+ lawFirm: "Motley Rice LLC"
950
+ },
951
+ {
952
+ id: 6,
953
+ title: "Robinhood Market Manipulation",
954
+ company: "Robinhood Markets",
955
+ category: "securities",
956
+ description: "Settlement over allegations of market manipulation during the 2021 meme stock events.",
957
+ image: "https://via.placeholder.com/400x200?text=Robinhood+Settlement",
958
+ stats: {
959
+ avgPayout: "$2,800",
960
+ claimants: "320,000",
961
+ totalSettlement: "$75M"
962
+ },
963
+ deadline: "2023-10-15",
964
+ status: "pending",
965
+ lawFirm: "Bernstein Litowitz"
966
+ }
967
+ ];
968
+
969
+ // Sample law firms data
970
+ const lawFirms = [
971
+ {
972
+ id: 1,
973
+ name: "Edelson PC",
974
+ specialty: "Data Privacy & Consumer Protection",
975
+ rating: "4.8/5",
976
+ logo: "https://via.placeholder.com/100x100?text=Edelson",
977
+ cases: 47
978
+ },
979
+ {
980
+ id: 2,
981
+ name: "Lieff Cabraser",
982
+ specialty: "Consumer Fraud & Securities",
983
+ rating: "4.7/5",
984
+ logo: "https://via.placeholder.com/100x100?text=Lieff",
985
+ cases: 62
986
+ },
987
+ {
988
+ id: 3,
989
+ name: "Morgan & Morgan",
990
+ specialty: "Employment & Personal Injury",
991
+ rating: "4.6/5",
992
+ logo: "https://via.placeholder.com/100x100?text=Morgan",
993
+ cases: 85
994
+ },
995
+ {
996
+ id: 4,
997
+ name: "Motley Rice LLC",
998
+ specialty: "Product Liability & Class Actions",
999
+ rating: "4.5/5",
1000
+ logo: "https://via.placeholder.com/100x100?text=Motley",
1001
+ cases: 72
1002
+ },
1003
+ {
1004
+ id: 5,
1005
+ name: "Bernstein Litowitz",
1006
+ specialty: "Securities & Financial Fraud",
1007
+ rating: "4.9/5",
1008
+ logo: "https://via.placeholder.com/100x100?text=Bernstein",
1009
+ cases: 38
1010
+ },
1011
+ {
1012
+ id: 6,
1013
+ name: "Beasley Allen",
1014
+ specialty: "Product Defects & Toxic Torts",
1015
+ rating: "4.7/5",
1016
+ logo: "https://via.placeholder.com/100x100?text=Beasley",
1017
+ cases: 56
1018
+ }
1019
+ ];
1020
+
1021
+ // DOM elements
1022
+ const lawsuitsGrid = document.getElementById('lawsuits-grid');
1023
+ const firmsGrid = document.getElementById('firms-grid');
1024
+ const modal = document.getElementById('lawsuit-modal');
1025
+ const closeModalButtons = document.querySelectorAll('.close-modal');
1026
+ const searchBtn = document.getElementById('search-btn');
1027
+ const searchInput = document.getElementById('search-input');
1028
+ const searchTags = document.querySelectorAll('.search-tag');
1029
+ const categoryFilter = document.getElementById('category-filter');
1030
+ const statusFilter = document.getElementById('status-filter');
1031
+ const sortBy = document.getElementById('sort-by');
1032
+ const menuToggle = document.querySelector('.menu-toggle');
1033
+ const navLinks = document.querySelector('.nav-links');
1034
+
1035
+ // Functions
1036
+ function renderLawsuits() {
1037
+ lawsuitsGrid.innerHTML = '';
1038
+
1039
+ // Get filter values
1040
+ const category = categoryFilter.value;
1041
+ const status = statusFilter.value;
1042
+ const sort = sortBy.value;
1043
+
1044
+ // Filter lawsuits
1045
+ let filteredLawsuits = [...lawsuits];
1046
+
1047
+ if (category !== 'all') {
1048
+ filteredLawsuits = filteredLawsuits.filter(lawsuit => lawsuit.category === category);
1049
+ }
1050
+
1051
+ if (status !== 'all') {
1052
+ filteredLawsuits = filteredLawsuits.filter(lawsuit => lawsuit.status === status);
1053
+ }
1054
+
1055
+ // Sort lawsuits
1056
+ if (sort === 'deadline') {
1057
+ filteredLawsuits.sort((a, b) => new Date(a.deadline) - new Date(b.deadline));
1058
+ } else if (sort === 'payout') {
1059
+ filteredLawsuits.sort((a, b) => {
1060
+ const payoutA = parseFloat(a.stats.avgPayout.replace(/[^0-9.]/g, ''));
1061
+ const payoutB = parseFloat(b.stats.avgPayout.replace(/[^0-9.]/g, ''));
1062
+ return payoutB - payoutA;
1063
+ });
1064
+ } else {
1065
+ // Default is newest first (assuming higher id = newer)
1066
+ filteredLawsuits.sort((a, b) => b.id - a.id);
1067
+ }
1068
+
1069
+ // Render filtered lawsuits
1070
+ filteredLawsuits.forEach(lawsuit => {
1071
+ const lawsuitCard = document.createElement('div');
1072
+ lawsuitCard.className = 'lawsuit-card';
1073
+ lawsuitCard.dataset.id = lawsuit.id;
1074
+
1075
+ let statusBadge = '';
1076
+ if (lawsuit.status === 'open') {
1077
+ statusBadge = `<span class="lawsuit-category" style="background-color: var(--success);">Accepting Claims</span>`;
1078
+ } else if (lawsuit.status === 'pending') {
1079
+ statusBadge = `<span class="lawsuit-category" style="background-color: var(--accent);">Pending Approval</span>`;
1080
+ }
1081
+
1082
+ lawsuitCard.innerHTML = `
1083
+ <div class="lawsuit-img">
1084
+ <img src="${lawsuit.image}" alt="${lawsuit.title}">
1085
+ ${statusBadge}
1086
+ </div>
1087
+ <div class="lawsuit-content">
1088
+ <h4>${lawsuit.title}</h4>
1089
+ <div class="lawsuit-company">
1090
+ <i class="fas fa-building"></i>
1091
+ <span>${lawsuit.company}</span>
1092
+ </div>
1093
+ <p class="lawsuit-desc">${lawsuit.description}</p>
1094
+ <div class="lawsuit-stats">
1095
+ <div class="stat-item">
1096
+ <div class="stat-value">${lawsuit.stats.avgPayout}</div>
1097
+ <div class="stat-label">Avg Payout</div>
1098
+ </div>
1099
+ <div class="stat-item">
1100
+ <div class="stat-value">${lawsuit.stats.claimants}</div>
1101
+ <div class="stat-label">Claimants</div>
1102
+ </div>
1103
+ <div class="stat-item">
1104
+ <div class="stat-value">${lawsuit.stats.totalSettlement}</div>
1105
+ <div class="stat-label">Total</div>
1106
+ </div>
1107
+ </div>
1108
+ <div class="lawsuit-footer">
1109
+ <div class="lawsuit-deadline">
1110
+ <i class="far fa-clock"></i> Deadline: ${formatDate(lawsuit.deadline)}
1111
+ </div>
1112
+ <button class="lawsuit-btn claim-btn">Claim Now</button>
1113
+ </div>
1114
+ </div>
1115
+ `;
1116
+
1117
+ lawsuitsGrid.appendChild(lawsuitCard);
1118
+ });
1119
+
1120
+ // Add event listeners to claim buttons
1121
+ document.querySelectorAll('.claim-btn').forEach(btn => {
1122
+ btn.addEventListener('click', function() {
1123
+ const card = this.closest('.lawsuit-card');
1124
+ const lawsuitId = parseInt(card.dataset.id);
1125
+ openModal(lawsuitId);
1126
+ });
1127
+ });
1128
+ }
1129
+
1130
+ function renderFirms() {
1131
+ firmsGrid.innerHTML = '';
1132
+
1133
+ lawFirms.sort((a, b) => b.cases - a.cases).forEach(firm => {
1134
+ const firmCard = document.createElement('div');
1135
+ firmCard.className = 'firm-card';
1136
+
1137
+ firmCard.innerHTML = `
1138
+ <div class="firm-logo">
1139
+ <img src="${firm.logo}" alt="${firm.name}">
1140
+ </div>
1141
+ <h3>${firm.name}</h3>
1142
+ <p class="firm-specialty">${firm.specialty}</p>
1143
+ <div class="firm-rating">
1144
+ <i class="fas fa-star"></i> ${firm.rating}
1145
+ </div>
1146
+ <button class="firm-btn" data-firm-id="${firm.id}">View Cases</button>
1147
+ `;
1148
+
1149
+ firmsGrid.appendChild(firmCard);
1150
+ });
1151
+
1152
+ // Add event listeners to firm buttons
1153
+ document.querySelectorAll('.firm-btn').forEach(btn => {
1154
+ btn.addEventListener('click', function() {
1155
+ const firmId = parseInt(this.dataset.firmId);
1156
+ filterByFirm(firmId);
1157
+ });
1158
+ });
1159
+ }
1160
+
1161
+ function openModal(lawsuitId) {
1162
+ const lawsuit = lawsuits.find(l => l.id === lawsuitId);
1163
+ if (!lawsuit) return;
1164
+
1165
+ document.getElementById('modal-title').textContent = lawsuit.title;
1166
+ document.getElementById('modal-deadline').textContent = formatDate(lawsuit.deadline);
1167
+ document.getElementById('modal-payout').textContent = lawsuit.stats.avgPayout;
1168
+ document.getElementById('modal-firm').textContent = lawsuit.lawFirm;
1169
+
1170
+ modal.style.display = 'flex';
1171
+ }
1172
+
1173
+ function closeModal() {
1174
+ modal.style.display = 'none';
1175
+ }
1176
+
1177
+ function formatDate(dateString) {
1178
+ const options = { year: 'numeric', month: 'long', day: 'numeric' };
1179
+ return new Date(dateString).toLocaleDateString(undefined, options);
1180
+ }
1181
+
1182
+ function filterByFirm(firmId) {
1183
+ const firm = lawFirms.find(f => f.id === firmId);
1184
+ if (!firm) return;
1185
+
1186
+ searchInput.value = firm.name;
1187
+ searchInput.focus();
1188
+ filterLawsuits();
1189
+ }
1190
+
1191
+ function filterLawsuits() {
1192
+ const searchTerm = searchInput.value.toLowerCase();
1193
+
1194
+ if (!searchTerm) {
1195
+ renderLawsuits();
1196
+ return;
1197
+ }
1198
+
1199
+ const filtered = lawsuits.filter(lawsuit => {
1200
+ return (
1201
+ lawsuit.title.toLowerCase().includes(searchTerm) ||
1202
+ lawsuit.company.toLowerCase().includes(searchTerm) ||
1203
+ lawsuit.description.toLowerCase().includes(searchTerm) ||
1204
+ lawsuit.lawFirm.toLowerCase().includes(searchTerm)
1205
+ );
1206
+ });
1207
+
1208
+ lawsuitsGrid.innerHTML = '';
1209
+
1210
+ if (filtered.length === 0) {
1211
+ lawsuitsGrid.innerHTML = `
1212
+ <div style="grid-column: 1/-1; text-align: center; padding: 2rem;">
1213
+ <i class="fas fa-search" style="font-size: 3rem; color: var(--gray); margin-bottom: 1rem;"></i>
1214
+ <h3>No lawsuits found matching your search</h3>
1215
+ <p>Try different keywords or browse by category</p>
1216
+ </div>
1217
+ `;
1218
+ return;
1219
+ }
1220
+
1221
+ filtered.forEach(lawsuit => {
1222
+ const lawsuitCard = document.createElement('div');
1223
+ lawsuitCard.className = 'lawsuit-card';
1224
+ lawsuitCard.dataset.id = lawsuit.id;
1225
+
1226
+ lawsuitCard.innerHTML = `
1227
+ <div class="lawsuit-img">
1228
+ <img src="${lawsuit.image}" alt="${lawsuit.title}">
1229
+ <span class="lawsuit-category">${lawFirms.find(f => f.name === lawsuit.lawFirm)?.specialty || 'Class Action'}</span>
1230
+ </div>
1231
+ <div class="lawsuit-content">
1232
+ <h3>${lawsuit.title}</h3>
1233
+ <div class="lawsuit-company">
1234
+ <i class="fas fa-building"></i>
1235
+ <span>${lawsuit.company}</span>
1236
+ </div>
1237
+ <p class="lawsuit-desc">${lawsuit.description}</p>
1238
+ <div class="lawsuit-stats">
1239
+ <div class="stat-item">
1240
+ <div class="stat-value">${lawsuit.stats.avgPayout}</div>
1241
+ <div class="stat-label">Avg Payout</div>
1242
+ </div>
1243
+ <div class="stat-item">
1244
+ <div class="stat-value">${lawsuit.stats.claimants}</div>
1245
+ <div class="stat-label">Claimants</div>
1246
+ </div>
1247
+ <div class="stat-item">
1248
+ <div class="stat-value">${lawsuit.stats.totalSettlement}</div>
1249
+ <div class="stat-label">Total</div>
1250
+ </div>
1251
+ </div>
1252
+ <div class="lawsuit-footer">
1253
+ <div class="lawsuit-deadline">
1254
+ <i class="far fa-clock"></i> Deadline: ${formatDate(lawsuit.deadline)}
1255
+ </div>
1256
+ <button class="lawsuit-btn claim-btn">Claim Now</button>
1257
+ </div>
1258
+ </div>
1259
+ `;
1260
+
1261
+ lawsuitsGrid.appendChild(lawsuitCard);
1262
+ });
1263
+
1264
+ // Add event listeners to claim buttons
1265
+ document.querySelectorAll('.claim-btn').forEach(btn => {
1266
+ btn.addEventListener('click', function() {
1267
+ const card = this.closest('.lawsuit-card');
1268
+ const lawsuitId = parseInt(card.dataset.id);
1269
+ openModal(lawsuitId);
1270
+ });
1271
+ });
1272
+ }
1273
+
1274
+ // Event listeners
1275
+ document.addEventListener('DOMContentLoaded', () => {
1276
+ renderLawsuits();
1277
+ renderFirms();
1278
+ });
1279
+
1280
+ closeModalButtons.forEach(btn => {
1281
+ btn.addEventListener('click', closeModal);
1282
+ });
1283
+
1284
+ modal.addEventListener('click', (e) => {
1285
+ if (e.target === modal) {
1286
+ closeModal();
1287
+ }
1288
+ });
1289
+
1290
+ searchBtn.addEventListener('click', filterLawsuits);
1291
+
1292
+ searchInput.addEventListener('keypress', (e) => {
1293
+ if (e.key === 'Enter') {
1294
+ filterLawsuits();
1295
+ }
1296
+ });
1297
+
1298
+ searchTags.forEach(tag => {
1299
+ tag.addEventListener('click', () => {
1300
+ categoryFilter.value = tag.dataset.category;
1301
+ renderLawsuits();
1302
+ });
1303
+ });
1304
+
1305
+ categoryFilter.addEventListener('change', renderLawsuits);
1306
+ statusFilter.addEventListener('change', renderLawsuits);
1307
+ sortBy.addEventListener('change', renderLawsuits);
1308
+
1309
+ menuToggle.addEventListener('click', () => {
1310
+ navLinks.classList.toggle('active');
1311
+ });
1312
+
1313
+ document.getElementById('submit-eligibility').addEventListener('click', () => {
1314
+ alert('Thank you for submitting your eligibility information. A representative will review your submission and contact you if you qualify for this settlement.');
1315
+ closeModal();
1316
+ });
1317
+ </script>
1318
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: absolute; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">This website has been generated by <a href="https://enzostvs-deepsite.hf.space" style="color: #fff;" target="_blank" >DeepSite</a> <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;"></p></body>
1319
+ </html>