Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>SettleRight - Find Your Class Action Claim</title> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| :root { | |
| --primary: #2c3e50; | |
| --secondary: #3498db; | |
| --accent: #e74c3c; | |
| --light: #ecf0f1; | |
| --dark: #2c3e50; | |
| --gray: #95a5a6; | |
| --success: #27ae60; | |
| } | |
| * { | |
| margin: 0; | |
| padding: 0; | |
| box-sizing: border-box; | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| } | |
| body { | |
| background-color: #f5f7fa; | |
| color: var(--dark); | |
| line-height: 1.6; | |
| } | |
| header { | |
| background-color: var(--primary); | |
| color: white; | |
| padding: 1rem 5%; | |
| box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); | |
| position: sticky; | |
| top: 0; | |
| z-index: 100; | |
| } | |
| nav { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| } | |
| .logo { | |
| display: flex; | |
| align-items: center; | |
| gap: 10px; | |
| } | |
| .logo i { | |
| font-size: 1.8rem; | |
| color: var(--secondary); | |
| } | |
| .logo h1 { | |
| font-size: 1.5rem; | |
| font-weight: 700; | |
| } | |
| .nav-links { | |
| display: flex; | |
| gap: 1.5rem; | |
| } | |
| .nav-links a { | |
| color: white; | |
| text-decoration: none; | |
| font-weight: 500; | |
| transition: color 0.3s; | |
| } | |
| .nav-links a:hover { | |
| color: var(--secondary); | |
| } | |
| .menu-toggle { | |
| display: none; | |
| background: none; | |
| border: none; | |
| color: white; | |
| font-size: 1.5rem; | |
| cursor: pointer; | |
| } | |
| .hero { | |
| background: linear-gradient(135deg, var(--primary), var(--secondary)); | |
| color: white; | |
| padding: 4rem 5%; | |
| text-align: center; | |
| } | |
| .hero h2 { | |
| font-size: 2.5rem; | |
| margin-bottom: 1rem; | |
| } | |
| .hero p { | |
| font-size: 1.1rem; | |
| max-width: 700px; | |
| margin: 0 auto 2rem; | |
| } | |
| .search-container { | |
| max-width: 800px; | |
| margin: 0 auto; | |
| background: white; | |
| padding: 1.5rem; | |
| border-radius: 10px; | |
| box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); | |
| } | |
| .search-box { | |
| display: flex; | |
| gap: 10px; | |
| } | |
| .search-box input { | |
| flex: 1; | |
| padding: 12px 15px; | |
| border: 1px solid var(--gray); | |
| border-radius: 5px; | |
| font-size: 1rem; | |
| } | |
| .search-box button { | |
| padding: 12px 25px; | |
| background-color: var(--accent); | |
| color: white; | |
| border: none; | |
| border-radius: 5px; | |
| font-weight: 600; | |
| cursor: pointer; | |
| transition: background-color 0.3s; | |
| } | |
| .search-box button:hover { | |
| background-color: #c0392b; | |
| } | |
| .search-tags { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 10px; | |
| margin-top: 1rem; | |
| justify-content: center; | |
| } | |
| .search-tag { | |
| padding: 5px 15px; | |
| background-color: var(--light); | |
| color: var(--dark); | |
| border-radius: 20px; | |
| font-size: 0.9rem; | |
| cursor: pointer; | |
| transition: all 0.3s; | |
| } | |
| .search-tag:hover { | |
| background-color: var(--secondary); | |
| color: white; | |
| } | |
| .container { | |
| padding: 3rem 5%; | |
| } | |
| .section-header { | |
| text-align: center; | |
| margin-bottom: 2rem; | |
| } | |
| .section-header h2 { | |
| font-size: 2rem; | |
| color: var(--primary); | |
| margin-bottom: 0.5rem; | |
| } | |
| .section-header p { | |
| color: var(--gray); | |
| max-width: 700px; | |
| margin: 0 auto; | |
| } | |
| .filter-container { | |
| display: flex; | |
| gap: 15px; | |
| margin-bottom: 2rem; | |
| flex-wrap: wrap; | |
| } | |
| .filter-dropdown { | |
| flex: 1; | |
| min-width: 200px; | |
| } | |
| .filter-dropdown label { | |
| display: block; | |
| margin-bottom: 5px; | |
| font-weight: 500; | |
| color: var(--primary); | |
| } | |
| .filter-dropdown select { | |
| width: 100%; | |
| padding: 10px; | |
| border: 1px solid var(--gray); | |
| border-radius: 5px; | |
| background-color: white; | |
| } | |
| .lawsuits-grid { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); | |
| gap: 1.5rem; | |
| } | |
| .lawsuit-card { | |
| background-color: white; | |
| border-radius: 8px; | |
| overflow: hidden; | |
| box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08); | |
| transition: transform 0.3s, box-shadow 0.3s; | |
| } | |
| .lawsuit-card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); | |
| } | |
| .lawsuit-img { | |
| height: 150px; | |
| background-color: var(--light); | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .lawsuit-img img { | |
| width: 100%; | |
| height: 100%; | |
| object-fit: cover; | |
| } | |
| .lawsuit-category { | |
| position: absolute; | |
| top: 15px; | |
| left: 15px; | |
| padding: 3px 10px; | |
| background-color: var(--secondary); | |
| color: white; | |
| border-radius: 3px; | |
| font-size: 0.8rem; | |
| font-weight: 500; | |
| } | |
| .lawsuit-content { | |
| padding: 1.5rem; | |
| } | |
| .lawsuit-content h3 { | |
| font-size: 1.2rem; | |
| margin-bottom: 0.5rem; | |
| color: var(--primary); | |
| } | |
| .lawsuit-company { | |
| display: flex; | |
| align-items: center; | |
| gap: 5px; | |
| color: var(--gray); | |
| font-size: 0.9rem; | |
| margin-bottom: 0.5rem; | |
| } | |
| .lawsuit-desc { | |
| font-size: 0.9rem; | |
| color: var(--dark); | |
| margin-bottom: 1rem; | |
| display: -webkit-box; | |
| -webkit-line-clamp: 3; | |
| -webkit-box-orient: vertical; | |
| overflow: hidden; | |
| } | |
| .lawsuit-stats { | |
| display: flex; | |
| justify-content: space-between; | |
| margin-bottom: 1rem; | |
| padding-bottom: 1rem; | |
| border-bottom: 1px solid var(--light); | |
| } | |
| .stat-item { | |
| text-align: center; | |
| } | |
| .stat-item .stat-value { | |
| font-weight: 700; | |
| color: var(--accent); | |
| } | |
| .stat-item .stat-label { | |
| font-size: 0.8rem; | |
| color: var(--gray); | |
| } | |
| .lawsuit-footer { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| } | |
| .lawsuit-deadline { | |
| font-size: 0.9rem; | |
| color: var(--accent); | |
| font-weight: 600; | |
| } | |
| .lawsuit-btn { | |
| padding: 8px 15px; | |
| background-color: var(--secondary); | |
| color: white; | |
| border: none; | |
| border-radius: 5px; | |
| font-weight: 500; | |
| cursor: pointer; | |
| transition: background-color 0.3s; | |
| } | |
| .lawsuit-btn:hover { | |
| background-color: #2980b9; | |
| } | |
| .firms-section { | |
| background-color: var(--light); | |
| padding: 3rem 5%; | |
| } | |
| .firms-grid { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); | |
| gap: 1.5rem; | |
| } | |
| .firm-card { | |
| background-color: white; | |
| border-radius: 8px; | |
| padding: 1.5rem; | |
| box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08); | |
| text-align: center; | |
| } | |
| .firm-logo { | |
| width: 80px; | |
| height: 80px; | |
| margin: 0 auto 1rem; | |
| background-color: var(--light); | |
| border-radius: 50%; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| overflow: hidden; | |
| } | |
| .firm-logo img { | |
| max-width: 100%; | |
| max-height: 100%; | |
| } | |
| .firm-card h3 { | |
| font-size: 1.1rem; | |
| margin-bottom: 0.5rem; | |
| } | |
| .firm-specialty { | |
| font-size: 0.8rem; | |
| color: var(--gray); | |
| margin-bottom: 1rem; | |
| } | |
| .firm-rating { | |
| color: var(--accent); | |
| margin-bottom: 1rem; | |
| font-size: 0.9rem; | |
| } | |
| .firm-btn { | |
| padding: 8px 15px; | |
| background-color: var(--primary); | |
| color: white; | |
| border: none; | |
| border-radius: 5px; | |
| font-size: 0.9rem; | |
| cursor: pointer; | |
| transition: background-color 0.3s; | |
| } | |
| .firm-btn:hover { | |
| background-color: var(--dark); | |
| } | |
| .cta-section { | |
| background: linear-gradient(135deg, var(--secondary), var(--primary)); | |
| color: white; | |
| padding: 4rem 5%; | |
| text-align: center; | |
| } | |
| .cta-content { | |
| max-width: 700px; | |
| margin: 0 auto; | |
| } | |
| .cta-content h2 { | |
| font-size: 2rem; | |
| margin-bottom: 1rem; | |
| } | |
| .cta-content p { | |
| margin-bottom: 2rem; | |
| } | |
| .cta-btn { | |
| padding: 12px 30px; | |
| background-color: white; | |
| color: var(--primary); | |
| border: none; | |
| border-radius: 5px; | |
| font-weight: 600; | |
| font-size: 1rem; | |
| cursor: pointer; | |
| transition: all 0.3s; | |
| } | |
| .cta-btn:hover { | |
| background-color: var(--accent); | |
| color: white; | |
| } | |
| footer { | |
| background-color: var(--dark); | |
| color: white; | |
| padding: 3rem 5%; | |
| } | |
| .footer-content { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); | |
| gap: 2rem; | |
| margin-bottom: 2rem; | |
| } | |
| .footer-column h3 { | |
| font-size: 1.1rem; | |
| margin-bottom: 1rem; | |
| color: var(--secondary); | |
| } | |
| .footer-column ul { | |
| list-style: none; | |
| } | |
| .footer-column ul li { | |
| margin-bottom: 0.5rem; | |
| } | |
| .footer-column ul li a { | |
| color: var(--light); | |
| text-decoration: none; | |
| transition: color 0.3s; | |
| } | |
| .footer-column ul li a:hover { | |
| color: var(--secondary); | |
| } | |
| .footer-bottom { | |
| text-align: center; | |
| padding-top: 2rem; | |
| border-top: 1px solid rgba(255, 255, 255, 0.1); | |
| color: var(--gray); | |
| font-size: 0.9rem; | |
| } | |
| .pagination { | |
| display: flex; | |
| justify-content: center; | |
| gap: 10px; | |
| margin-top: 2rem; | |
| } | |
| .pagination button { | |
| padding: 8px 15px; | |
| background-color: white; | |
| border: 1px solid var(--light); | |
| border-radius: 5px; | |
| cursor: pointer; | |
| transition: all 0.3s; | |
| } | |
| .pagination button.active { | |
| background-color: var(--secondary); | |
| color: white; | |
| border-color: var(--secondary); | |
| } | |
| .pagination button:hover:not(.active) { | |
| background-color: var(--light); | |
| } | |
| @media (max-width: 768px) { | |
| .nav-links { | |
| display: none; | |
| flex-direction: column; | |
| position: absolute; | |
| top: 70px; | |
| left: 0; | |
| width: 100%; | |
| background-color: var(--primary); | |
| padding: 1rem; | |
| box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); | |
| } | |
| .nav-links.active { | |
| display: flex; | |
| } | |
| .menu-toggle { | |
| display: block; | |
| } | |
| .hero h2 { | |
| font-size: 2rem; | |
| } | |
| .search-box { | |
| flex-direction: column; | |
| } | |
| .lawsuit-card, | |
| .firm-card { | |
| min-width: 100%; | |
| } | |
| } | |
| /* Modal styles */ | |
| .modal { | |
| display: none; | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background-color: rgba(0, 0, 0, 0.7); | |
| z-index: 1000; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| .modal-content { | |
| background-color: white; | |
| width: 90%; | |
| max-width: 600px; | |
| border-radius: 10px; | |
| overflow: hidden; | |
| box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2); | |
| max-height: 90vh; | |
| overflow-y: auto; | |
| } | |
| .modal-header { | |
| background-color: var(--primary); | |
| color: white; | |
| padding: 1rem; | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| } | |
| .modal-header h3 { | |
| font-size: 1.3rem; | |
| } | |
| .close-modal { | |
| background: none; | |
| border: none; | |
| color: white; | |
| font-size: 1.5rem; | |
| cursor: pointer; | |
| } | |
| .modal-body { | |
| padding: 1.5rem; | |
| } | |
| .eligibility-check { | |
| margin-bottom: 1.5rem; | |
| } | |
| .eligibility-check h4 { | |
| margin-bottom: 0.5rem; | |
| color: var(--primary); | |
| } | |
| .form-group { | |
| margin-bottom: 1rem; | |
| } | |
| .form-group label { | |
| display: block; | |
| margin-bottom: 0.5rem; | |
| font-weight: 500; | |
| } | |
| .form-group input, | |
| .form-group select, | |
| .form-group textarea { | |
| width: 100%; | |
| padding: 10px; | |
| border: 1px solid var(--gray); | |
| border-radius: 5px; | |
| } | |
| .modal-footer { | |
| padding: 1rem; | |
| border-top: 1px solid var(--light); | |
| display: flex; | |
| justify-content: flex-end; | |
| gap: 10px; | |
| } | |
| .btn { | |
| padding: 8px 15px; | |
| border-radius: 5px; | |
| cursor: pointer; | |
| font-weight: 500; | |
| } | |
| .btn-primary { | |
| background-color: var(--secondary); | |
| color: white; | |
| border: none; | |
| } | |
| .btn-secondary { | |
| background-color: var(--light); | |
| color: var(--dark); | |
| border: 1px solid var(--gray); | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <header> | |
| <nav> | |
| <div class="logo"> | |
| <i class="fas fa-gavel"></i> | |
| <h1>SettleRight</h1> | |
| </div> | |
| <button class="menu-toggle"> | |
| <i class="fas fa-bars"></i> | |
| </button> | |
| <div class="nav-links"> | |
| <a href="#search">Find Claims</a> | |
| <a href="#lawsuits">Active Cases</a> | |
| <a href="#firms">Law Firms</a> | |
| <a href="#about">About</a> | |
| <a href="#contact">Contact</a> | |
| </div> | |
| </nav> | |
| </header> | |
| <section class="hero"> | |
| <h2>Find Unclaimed Class Action Settlements</h2> | |
| <p>Discover if you're eligible for compensation from ongoing class action lawsuits. Our database tracks thousands of cases and estimated payout amounts.</p> | |
| <div class="search-container" id="search"> | |
| <div class="search-box"> | |
| <input type="text" placeholder="Search by company, product, or lawsuit type..." id="search-input"> | |
| <button id="search-btn">Search</button> | |
| </div> | |
| <div class="search-tags"> | |
| <div class="search-tag" data-category="data-breach">Data Breaches</div> | |
| <div class="search-tag" data-category="product-defect">Product Defects</div> | |
| <div class="search-tag" data-category="employment">Employment</div> | |
| <div class="search-tag" data-category="consumer">Consumer Fraud</div> | |
| <div class="search-tag" data-category="securities">Securities</div> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="container" id="lawsuits"> | |
| <div class="section-header"> | |
| <h2>Active Class Action Lawsuits</h2> | |
| <p>Browse through the most recent class action settlements open for claims.</p> | |
| </div> | |
| <div class="filter-container"> | |
| <div class="filter-dropdown"> | |
| <label for="category-filter">Category</label> | |
| <select id="category-filter"> | |
| <option value="all">All Categories</option> | |
| <option value="data-breach">Data Breaches</option> | |
| <option value="product-defect">Product Defects</option> | |
| <option value="employment">Employment</option> | |
| <option value="consumer">Consumer Fraud</option> | |
| <option value="securities">Securities</option> | |
| </select> | |
| </div> | |
| <div class="filter-dropdown"> | |
| <label for="status-filter">Status</label> | |
| <select id="status-filter"> | |
| <option value="all">All Statuses</option> | |
| <option value="open">Open for Claims</option> | |
| <option value="pending">Pending Approval</option> | |
| <option value="settled">Settled - Paying Out</option> | |
| </select> | |
| </div> | |
| <div class="filter-dropdown"> | |
| <label for="sort-by">Sort By</label> | |
| <select id="sort-by"> | |
| <option value="newest">Newest First</option> | |
| <option value="deadline">Claim Deadline</option> | |
| <option value="payout">Highest Payout</option> | |
| </select> | |
| </div> | |
| </div> | |
| <div class="lawsuits-grid" id="lawsuits-grid"> | |
| <!-- Lawsuit cards will be inserted here by JavaScript --> | |
| </div> | |
| <div class="pagination"> | |
| <button class="active">1</button> | |
| <button>2</button> | |
| <button>3</button> | |
| <button>4</button> | |
| <button>5</button> | |
| </div> | |
| </section> | |
| <section class="firms-section" id="firms"> | |
| <div class="section-header"> | |
| <h2>Top Class Action Law Firms</h2> | |
| <p>These firms are currently handling multiple class action cases.</p> | |
| </div> | |
| <div class="firms-grid" id="firms-grid"> | |
| <!-- Firm cards will be inserted here by JavaScript --> | |
| </div> | |
| </section> | |
| <section class="cta-section"> | |
| <div class="cta-content"> | |
| <h2>Don't See Your Case Listed?</h2> | |
| <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> | |
| <button class="cta-btn">Get Settlement Alerts</button> | |
| </div> | |
| </section> | |
| <footer> | |
| <div class="footer-content"> | |
| <div class="footer-column"> | |
| <h3>SettleRight</h3> | |
| <ul> | |
| <li><a href="#about">About Us</a></li> | |
| <li><a href="#how-it-works">How It Works</a></li> | |
| <li><a href="#faq">FAQ</a></li> | |
| <li><a href="#blog">Blog</a></li> | |
| </ul> | |
| </div> | |
| <div class="footer-column"> | |
| <h3>Legal Types</h3> | |
| <ul> | |
| <li><a href="#consumer">Consumer Class Actions</a></li> | |
| <li><a href="#employment">Employment Lawsuits</a></li> | |
| <li><a href="#data-breach">Data Breaches</a></li> | |
| <li><a href="#securities">Securities Fraud</a></li> | |
| </ul> | |
| </div> | |
| <div class="footer-column"> | |
| <h3>Resources</h3> | |
| <ul> | |
| <li><a href="#guides">Claim Guides</a></li> | |
| <li><a href="#timeline">Settlement Timeline</a></li> | |
| <li><a href="#calculator">Payout Calculator</a></li> | |
| <li><a href="#glossary">Legal Glossary</a></li> | |
| </ul> | |
| </div> | |
| <div class="footer-column"> | |
| <h3>Contact</h3> | |
| <ul> | |
| <li><a href="mailto:[email protected]">[email protected]</a></li> | |
| <li><a href="tel:+18005551234">(800) 555-1234</a></li> | |
| <li><a href="#contact">Contact Form</a></li> | |
| <li><a href="#press">Press Inquiries</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="footer-bottom"> | |
| <p>© 2023 SettleRight. All rights reserved. | <a href="#privacy">Privacy Policy</a> | <a href="#terms">Terms of Service</a></p> | |
| <p>Disclaimer: SettleRight is not a law firm and does not provide legal advice. The information provided is for educational purposes only.</p> | |
| </div> | |
| </footer> | |
| <!-- Modal for lawsuit details --> | |
| <div class="modal" id="lawsuit-modal"> | |
| <div class="modal-content"> | |
| <div class="modal-header"> | |
| <h3 id="modal-title">Class Action Lawsuit Details</h3> | |
| <button class="close-modal">×</button> | |
| </div> | |
| <div class="modal-body"> | |
| <div class="eligibility-check"> | |
| <h4>Check Your Eligibility</h4> | |
| <p>Complete this short questionnaire to see if you qualify for this settlement.</p> | |
| <div class="form-group"> | |
| <label for="purchase-date">Did you purchase/use the product between these dates?</label> | |
| <input type="text" id="purchase-date" placeholder="Enter approximate dates" readonly> | |
| </div> | |
| <div class="form-group"> | |
| <label for="product-owned">Did you own/use the product?</label> | |
| <select id="product-owned"> | |
| <option value="">Select an option</option> | |
| <option value="yes">Yes</option> | |
| <option value="no">No</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label for="issue-experienced">Did you experience the issue described in the lawsuit?</label> | |
| <select id="issue-experienced"> | |
| <option value="">Select an option</option> | |
| <option value="yes">Yes</option> | |
| <option value="no">No</option> | |
| <option value="unsure">I'm not sure</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label for="additional-info">Additional Information (Optional)</label> | |
| <textarea id="additional-info" rows="3" placeholder="Provide any additional details that may help determine eligibility"></textarea> | |
| </div> | |
| </div> | |
| <div> | |
| <h4>Next Steps</h4> | |
| <p>If you believe you're eligible, you'll need to:</p> | |
| <ol> | |
| <li>Gather any documentation (receipts, product serial numbers, etc.)</li> | |
| <li>Complete the official claim form through the settlement administrator</li> | |
| <li>Submit by the deadline: <span id="modal-deadline">TBD</span></li> | |
| </ol> | |
| <p>Average payout for this case: <strong id="modal-payout">$TBD</strong></p> | |
| <p>This case is being handled by: <strong id="modal-firm">TBD Law Firm</strong></p> | |
| </div> | |
| </div> | |
| <div class="modal-footer"> | |
| <button class="btn btn-secondary close-modal">Cancel</button> | |
| <button class="btn btn-primary" id="submit-eligibility">Submit Eligibility Check</button> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| // Sample data for lawsuits | |
| const lawsuits = [ | |
| { | |
| id: 1, | |
| title: "Facebook Data Privacy Settlement", | |
| company: "Meta Platforms, Inc.", | |
| category: "data-breach", | |
| description: "Settlement over allegations that Facebook collected and stored biometric data without user consent.", | |
| image: "https://via.placeholder.com/400x200?text=Facebook+Case", | |
| stats: { | |
| avgPayout: "$400", | |
| claimants: "1.6M", | |
| totalSettlement: "$650M" | |
| }, | |
| deadline: "2023-11-15", | |
| status: "open", | |
| lawFirm: "Edelson PC" | |
| }, | |
| { | |
| id: 2, | |
| title: "Johnson & Johnson Talcum Powder Lawsuit", | |
| company: "Johnson & Johnson", | |
| category: "product-defect", | |
| description: "Settlement alleging that talcum powder products caused ovarian cancer in long-term users.", | |
| image: "https://via.placeholder.com/400x200?text=J%26J+Talcum+Powder", | |
| stats: { | |
| avgPayout: "$150,000", | |
| claimants: "25,000", | |
| totalSettlement: "$8.9B" | |
| }, | |
| deadline: "2024-01-31", | |
| status: "pending", | |
| lawFirm: "Beasley Allen Law Firm" | |
| }, | |
| { | |
| id: 3, | |
| title: "Google Location Tracking Settlement", | |
| company: "Google LLC", | |
| category: "data-breach", | |
| description: "Settlement over allegations that Google misled users about location tracking practices.", | |
| image: "https://via.placeholder.com/400x200?text=Google+Tracking", | |
| stats: { | |
| avgPayout: "$75", | |
| claimants: "4.2M", | |
| totalSettlement: "$93M" | |
| }, | |
| deadline: "2023-12-01", | |
| status: "open", | |
| lawFirm: "Lieff Cabraser" | |
| }, | |
| { | |
| id: 4, | |
| title: "Walmart Wage Theft Class Action", | |
| company: "Walmart Inc.", | |
| category: "employment", | |
| description: "Lawsuit alleging wage theft and overtime violations across multiple states.", | |
| image: "https://via.placeholder.com/400x200?text=Walmart+Employment", | |
| stats: { | |
| avgPayout: "$1,200", | |
| claimants: "187,000", | |
| totalSettlement: "$65M" | |
| }, | |
| deadline: "2024-03-15", | |
| status: "open", | |
| lawFirm: "Morgan & Morgan" | |
| }, | |
| { | |
| id: 5, | |
| title: "Boeing 737 MAX Defect Settlement", | |
| company: "Boeing Company", | |
| category: "product-defect", | |
| description: "Settlement for passengers affected by the grounding of 737 MAX aircraft.", | |
| image: "https://via.placeholder.com/400x200?text=Boeing+737+MAX", | |
| stats: { | |
| avgPayout: "$9,000", | |
| claimants: "12,500", | |
| totalSettlement: "$110M" | |
| }, | |
| deadline: "2023-09-30", | |
| status: "open", | |
| lawFirm: "Motley Rice LLC" | |
| }, | |
| { | |
| id: 6, | |
| title: "Robinhood Market Manipulation", | |
| company: "Robinhood Markets", | |
| category: "securities", | |
| description: "Settlement over allegations of market manipulation during the 2021 meme stock events.", | |
| image: "https://via.placeholder.com/400x200?text=Robinhood+Settlement", | |
| stats: { | |
| avgPayout: "$2,800", | |
| claimants: "320,000", | |
| totalSettlement: "$75M" | |
| }, | |
| deadline: "2023-10-15", | |
| status: "pending", | |
| lawFirm: "Bernstein Litowitz" | |
| } | |
| ]; | |
| // Sample law firms data | |
| const lawFirms = [ | |
| { | |
| id: 1, | |
| name: "Edelson PC", | |
| specialty: "Data Privacy & Consumer Protection", | |
| rating: "4.8/5", | |
| logo: "https://via.placeholder.com/100x100?text=Edelson", | |
| cases: 47 | |
| }, | |
| { | |
| id: 2, | |
| name: "Lieff Cabraser", | |
| specialty: "Consumer Fraud & Securities", | |
| rating: "4.7/5", | |
| logo: "https://via.placeholder.com/100x100?text=Lieff", | |
| cases: 62 | |
| }, | |
| { | |
| id: 3, | |
| name: "Morgan & Morgan", | |
| specialty: "Employment & Personal Injury", | |
| rating: "4.6/5", | |
| logo: "https://via.placeholder.com/100x100?text=Morgan", | |
| cases: 85 | |
| }, | |
| { | |
| id: 4, | |
| name: "Motley Rice LLC", | |
| specialty: "Product Liability & Class Actions", | |
| rating: "4.5/5", | |
| logo: "https://via.placeholder.com/100x100?text=Motley", | |
| cases: 72 | |
| }, | |
| { | |
| id: 5, | |
| name: "Bernstein Litowitz", | |
| specialty: "Securities & Financial Fraud", | |
| rating: "4.9/5", | |
| logo: "https://via.placeholder.com/100x100?text=Bernstein", | |
| cases: 38 | |
| }, | |
| { | |
| id: 6, | |
| name: "Beasley Allen", | |
| specialty: "Product Defects & Toxic Torts", | |
| rating: "4.7/5", | |
| logo: "https://via.placeholder.com/100x100?text=Beasley", | |
| cases: 56 | |
| } | |
| ]; | |
| // DOM elements | |
| const lawsuitsGrid = document.getElementById('lawsuits-grid'); | |
| const firmsGrid = document.getElementById('firms-grid'); | |
| const modal = document.getElementById('lawsuit-modal'); | |
| const closeModalButtons = document.querySelectorAll('.close-modal'); | |
| const searchBtn = document.getElementById('search-btn'); | |
| const searchInput = document.getElementById('search-input'); | |
| const searchTags = document.querySelectorAll('.search-tag'); | |
| const categoryFilter = document.getElementById('category-filter'); | |
| const statusFilter = document.getElementById('status-filter'); | |
| const sortBy = document.getElementById('sort-by'); | |
| const menuToggle = document.querySelector('.menu-toggle'); | |
| const navLinks = document.querySelector('.nav-links'); | |
| // Functions | |
| function renderLawsuits() { | |
| lawsuitsGrid.innerHTML = ''; | |
| // Get filter values | |
| const category = categoryFilter.value; | |
| const status = statusFilter.value; | |
| const sort = sortBy.value; | |
| // Filter lawsuits | |
| let filteredLawsuits = [...lawsuits]; | |
| if (category !== 'all') { | |
| filteredLawsuits = filteredLawsuits.filter(lawsuit => lawsuit.category === category); | |
| } | |
| if (status !== 'all') { | |
| filteredLawsuits = filteredLawsuits.filter(lawsuit => lawsuit.status === status); | |
| } | |
| // Sort lawsuits | |
| if (sort === 'deadline') { | |
| filteredLawsuits.sort((a, b) => new Date(a.deadline) - new Date(b.deadline)); | |
| } else if (sort === 'payout') { | |
| filteredLawsuits.sort((a, b) => { | |
| const payoutA = parseFloat(a.stats.avgPayout.replace(/[^0-9.]/g, '')); | |
| const payoutB = parseFloat(b.stats.avgPayout.replace(/[^0-9.]/g, '')); | |
| return payoutB - payoutA; | |
| }); | |
| } else { | |
| // Default is newest first (assuming higher id = newer) | |
| filteredLawsuits.sort((a, b) => b.id - a.id); | |
| } | |
| // Render filtered lawsuits | |
| filteredLawsuits.forEach(lawsuit => { | |
| const lawsuitCard = document.createElement('div'); | |
| lawsuitCard.className = 'lawsuit-card'; | |
| lawsuitCard.dataset.id = lawsuit.id; | |
| let statusBadge = ''; | |
| if (lawsuit.status === 'open') { | |
| statusBadge = `<span class="lawsuit-category" style="background-color: var(--success);">Accepting Claims</span>`; | |
| } else if (lawsuit.status === 'pending') { | |
| statusBadge = `<span class="lawsuit-category" style="background-color: var(--accent);">Pending Approval</span>`; | |
| } | |
| lawsuitCard.innerHTML = ` | |
| <div class="lawsuit-img"> | |
| <img src="${lawsuit.image}" alt="${lawsuit.title}"> | |
| ${statusBadge} | |
| </div> | |
| <div class="lawsuit-content"> | |
| <h4>${lawsuit.title}</h4> | |
| <div class="lawsuit-company"> | |
| <i class="fas fa-building"></i> | |
| <span>${lawsuit.company}</span> | |
| </div> | |
| <p class="lawsuit-desc">${lawsuit.description}</p> | |
| <div class="lawsuit-stats"> | |
| <div class="stat-item"> | |
| <div class="stat-value">${lawsuit.stats.avgPayout}</div> | |
| <div class="stat-label">Avg Payout</div> | |
| </div> | |
| <div class="stat-item"> | |
| <div class="stat-value">${lawsuit.stats.claimants}</div> | |
| <div class="stat-label">Claimants</div> | |
| </div> | |
| <div class="stat-item"> | |
| <div class="stat-value">${lawsuit.stats.totalSettlement}</div> | |
| <div class="stat-label">Total</div> | |
| </div> | |
| </div> | |
| <div class="lawsuit-footer"> | |
| <div class="lawsuit-deadline"> | |
| <i class="far fa-clock"></i> Deadline: ${formatDate(lawsuit.deadline)} | |
| </div> | |
| <button class="lawsuit-btn claim-btn">Claim Now</button> | |
| </div> | |
| </div> | |
| `; | |
| lawsuitsGrid.appendChild(lawsuitCard); | |
| }); | |
| // Add event listeners to claim buttons | |
| document.querySelectorAll('.claim-btn').forEach(btn => { | |
| btn.addEventListener('click', function() { | |
| const card = this.closest('.lawsuit-card'); | |
| const lawsuitId = parseInt(card.dataset.id); | |
| openModal(lawsuitId); | |
| }); | |
| }); | |
| } | |
| function renderFirms() { | |
| firmsGrid.innerHTML = ''; | |
| lawFirms.sort((a, b) => b.cases - a.cases).forEach(firm => { | |
| const firmCard = document.createElement('div'); | |
| firmCard.className = 'firm-card'; | |
| firmCard.innerHTML = ` | |
| <div class="firm-logo"> | |
| <img src="${firm.logo}" alt="${firm.name}"> | |
| </div> | |
| <h3>${firm.name}</h3> | |
| <p class="firm-specialty">${firm.specialty}</p> | |
| <div class="firm-rating"> | |
| <i class="fas fa-star"></i> ${firm.rating} | |
| </div> | |
| <button class="firm-btn" data-firm-id="${firm.id}">View Cases</button> | |
| `; | |
| firmsGrid.appendChild(firmCard); | |
| }); | |
| // Add event listeners to firm buttons | |
| document.querySelectorAll('.firm-btn').forEach(btn => { | |
| btn.addEventListener('click', function() { | |
| const firmId = parseInt(this.dataset.firmId); | |
| filterByFirm(firmId); | |
| }); | |
| }); | |
| } | |
| function openModal(lawsuitId) { | |
| const lawsuit = lawsuits.find(l => l.id === lawsuitId); | |
| if (!lawsuit) return; | |
| document.getElementById('modal-title').textContent = lawsuit.title; | |
| document.getElementById('modal-deadline').textContent = formatDate(lawsuit.deadline); | |
| document.getElementById('modal-payout').textContent = lawsuit.stats.avgPayout; | |
| document.getElementById('modal-firm').textContent = lawsuit.lawFirm; | |
| modal.style.display = 'flex'; | |
| } | |
| function closeModal() { | |
| modal.style.display = 'none'; | |
| } | |
| function formatDate(dateString) { | |
| const options = { year: 'numeric', month: 'long', day: 'numeric' }; | |
| return new Date(dateString).toLocaleDateString(undefined, options); | |
| } | |
| function filterByFirm(firmId) { | |
| const firm = lawFirms.find(f => f.id === firmId); | |
| if (!firm) return; | |
| searchInput.value = firm.name; | |
| searchInput.focus(); | |
| filterLawsuits(); | |
| } | |
| function filterLawsuits() { | |
| const searchTerm = searchInput.value.toLowerCase(); | |
| if (!searchTerm) { | |
| renderLawsuits(); | |
| return; | |
| } | |
| const filtered = lawsuits.filter(lawsuit => { | |
| return ( | |
| lawsuit.title.toLowerCase().includes(searchTerm) || | |
| lawsuit.company.toLowerCase().includes(searchTerm) || | |
| lawsuit.description.toLowerCase().includes(searchTerm) || | |
| lawsuit.lawFirm.toLowerCase().includes(searchTerm) | |
| ); | |
| }); | |
| lawsuitsGrid.innerHTML = ''; | |
| if (filtered.length === 0) { | |
| lawsuitsGrid.innerHTML = ` | |
| <div style="grid-column: 1/-1; text-align: center; padding: 2rem;"> | |
| <i class="fas fa-search" style="font-size: 3rem; color: var(--gray); margin-bottom: 1rem;"></i> | |
| <h3>No lawsuits found matching your search</h3> | |
| <p>Try different keywords or browse by category</p> | |
| </div> | |
| `; | |
| return; | |
| } | |
| filtered.forEach(lawsuit => { | |
| const lawsuitCard = document.createElement('div'); | |
| lawsuitCard.className = 'lawsuit-card'; | |
| lawsuitCard.dataset.id = lawsuit.id; | |
| lawsuitCard.innerHTML = ` | |
| <div class="lawsuit-img"> | |
| <img src="${lawsuit.image}" alt="${lawsuit.title}"> | |
| <span class="lawsuit-category">${lawFirms.find(f => f.name === lawsuit.lawFirm)?.specialty || 'Class Action'}</span> | |
| </div> | |
| <div class="lawsuit-content"> | |
| <h3>${lawsuit.title}</h3> | |
| <div class="lawsuit-company"> | |
| <i class="fas fa-building"></i> | |
| <span>${lawsuit.company}</span> | |
| </div> | |
| <p class="lawsuit-desc">${lawsuit.description}</p> | |
| <div class="lawsuit-stats"> | |
| <div class="stat-item"> | |
| <div class="stat-value">${lawsuit.stats.avgPayout}</div> | |
| <div class="stat-label">Avg Payout</div> | |
| </div> | |
| <div class="stat-item"> | |
| <div class="stat-value">${lawsuit.stats.claimants}</div> | |
| <div class="stat-label">Claimants</div> | |
| </div> | |
| <div class="stat-item"> | |
| <div class="stat-value">${lawsuit.stats.totalSettlement}</div> | |
| <div class="stat-label">Total</div> | |
| </div> | |
| </div> | |
| <div class="lawsuit-footer"> | |
| <div class="lawsuit-deadline"> | |
| <i class="far fa-clock"></i> Deadline: ${formatDate(lawsuit.deadline)} | |
| </div> | |
| <button class="lawsuit-btn claim-btn">Claim Now</button> | |
| </div> | |
| </div> | |
| `; | |
| lawsuitsGrid.appendChild(lawsuitCard); | |
| }); | |
| // Add event listeners to claim buttons | |
| document.querySelectorAll('.claim-btn').forEach(btn => { | |
| btn.addEventListener('click', function() { | |
| const card = this.closest('.lawsuit-card'); | |
| const lawsuitId = parseInt(card.dataset.id); | |
| openModal(lawsuitId); | |
| }); | |
| }); | |
| } | |
| // Event listeners | |
| document.addEventListener('DOMContentLoaded', () => { | |
| renderLawsuits(); | |
| renderFirms(); | |
| }); | |
| closeModalButtons.forEach(btn => { | |
| btn.addEventListener('click', closeModal); | |
| }); | |
| modal.addEventListener('click', (e) => { | |
| if (e.target === modal) { | |
| closeModal(); | |
| } | |
| }); | |
| searchBtn.addEventListener('click', filterLawsuits); | |
| searchInput.addEventListener('keypress', (e) => { | |
| if (e.key === 'Enter') { | |
| filterLawsuits(); | |
| } | |
| }); | |
| searchTags.forEach(tag => { | |
| tag.addEventListener('click', () => { | |
| categoryFilter.value = tag.dataset.category; | |
| renderLawsuits(); | |
| }); | |
| }); | |
| categoryFilter.addEventListener('change', renderLawsuits); | |
| statusFilter.addEventListener('change', renderLawsuits); | |
| sortBy.addEventListener('change', renderLawsuits); | |
| menuToggle.addEventListener('click', () => { | |
| navLinks.classList.toggle('active'); | |
| }); | |
| document.getElementById('submit-eligibility').addEventListener('click', () => { | |
| alert('Thank you for submitting your eligibility information. A representative will review your submission and contact you if you qualify for this settlement.'); | |
| closeModal(); | |
| }); | |
| </script> | |
| <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> | |
| </html> |