dickiethinking's picture
The site needs the ability to use zero auth in order to search the user's email for all relevant case information
cad1c9b verified
// ZeroAuth email client polyfill
if (!window.zeroAuth) {
window.zeroAuth = {
emailClient: async function() {
return {
search: async function({ query, maxResults }) {
// In a real implementation, this would use ZeroAuth protocol
// For demo purposes, we'll return mock data
console.log(`Searching emails for: ${query}`);
// Mock response
return {
messages: [
{
subject: "Re: Family Court Hearing - Case #FC12345",
date: "2023-12-15T10:30:00"
},
{
subject: "Affidavit Submission Confirmation",
date: "2023-11-28T14:15:00"
},
{
subject: "Urgent: Custody Arrangement Update",
date: "2023-11-15T09:45:00"
}
]
};
}
}
}
}
}
<html lang="en" class="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Court Crusader | Fight Family Court Injustice</title>
<link rel="stylesheet" href="style.css">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<script>
tailwind.config = {
darkMode: 'class',
theme: {
extend: {
colors: {
rose: {
500: '#f43f5e',
}
}
}
}
}
</script>
</head>
<body class="bg-gray-900 text-gray-100 min-h-screen">
<custom-navbar></custom-navbar>
<main class="container mx-auto px-4 py-8">
<!-- Hero Section -->
<section class="bg-gray-800 rounded-xl p-8 mb-10 shadow-lg">
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-6 md:mb-0">
<h1 class="text-4xl md:text-5xl font-bold mb-4 text-red-500">Fight Back Against Family Court Injustice</h1>
<p class="text-xl mb-6 text-rose-300">Document misconduct, build your case bundle, and expose corruption in New Zealand's family court system.</p>
<div class="flex flex-col sm:flex-row gap-4">
<a href="#document" class="bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-6 rounded-lg text-center transition">Document Misconduct</a>
<a href="#bundle" class="bg-rose-600 hover:bg-rose-700 text-white font-bold py-3 px-6 rounded-lg text-center transition">Build Your Bundle</a>
</div>
</div>
<div class="md:w-1/2">
<img src="http://static.photos/legal/1200x630/42" alt="Justice Scale" class="rounded-lg shadow-xl">
</div>
</div>
</section>
<!-- Features Section -->
<section class="mb-16">
<h2 class="text-3xl font-bold mb-8 text-center text-red-500">Your Legal Empowerment Tools</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<div class="bg-gray-800 p-6 rounded-xl shadow-lg">
<div class="text-red-500 mb-4">
<i data-feather="file-text" class="w-12 h-12"></i>
</div>
<h3 class="text-xl font-bold mb-2">Case Bundle Builder</h3>
<p class="text-gray-300">Organize your evidence, documents, and timeline into a professional court bundle automatically.</p>
</div>
<div class="bg-gray-800 p-6 rounded-xl shadow-lg">
<div class="text-red-500 mb-4">
<i data-feather="alert-triangle" class="w-12 h-12"></i>
</div>
<h3 class="text-xl font-bold mb-2">Misconduct Tracker</h3>
<p class="text-gray-300">Document and report unethical behavior by lawyers, judges, and social workers with timestamped evidence.</p>
</div>
<div class="bg-gray-800 p-6 rounded-xl shadow-lg">
<div class="text-red-500 mb-4">
<i data-feather="users" class="w-12 h-12"></i>
</div>
<h3 class="text-xl font-bold mb-2">Public Accountability</h3>
<p class="text-gray-300">Our verified database exposes patterns of misconduct across multiple cases and litigants.</p>
</div>
</div>
</section>
<!-- Document Misconduct Section -->
<section id="document" class="mb-16 bg-gray-800 rounded-xl p-8 shadow-lg">
<h2 class="text-3xl font-bold mb-6 text-red-500">Report Professional Misconduct</h2>
<form class="space-y-6">
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label class="block text-gray-300 mb-2">Name of Professional</label>
<input type="text" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2 focus:ring-2 focus:ring-red-500 focus:border-transparent">
</div>
<div>
<label class="block text-gray-300 mb-2">Role</label>
<select class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2 focus:ring-2 focus:ring-red-500 focus:border-transparent">
<option>Judge</option>
<option>Lawyer</option>
<option>Social Worker</option>
<option>Police Officer</option>
<option>Court Staff</option>
</select>
</div>
</div>
<div>
<label class="block text-gray-300 mb-2">Date of Incident</label>
<input type="date" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2 focus:ring-2 focus:ring-red-500 focus:border-transparent">
</div>
<div>
<label class="block text-gray-300 mb-2">Description of Misconduct</label>
<textarea rows="4" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2 focus:ring-2 focus:ring-red-500 focus:border-transparent"></textarea>
</div>
<div>
<label class="block text-gray-300 mb-2">Evidence (Upload Files)</label>
<div class="flex items-center justify-center w-full">
<label class="flex flex-col w-full h-32 border-2 border-dashed border-gray-600 hover:border-red-500 rounded-lg cursor-pointer bg-gray-700 hover:bg-gray-700/50">
<div class="flex flex-col items-center justify-center pt-7">
<i data-feather="upload" class="w-8 h-8 text-gray-400"></i>
<p class="pt-1 text-sm text-gray-400">Click to upload documents</p>
</div>
<input type="file" class="opacity-0" multiple>
</label>
</div>
</div>
<button type="submit" class="bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-6 rounded-lg transition">Submit Report</button>
</form>
</section>
<!-- Case Bundle Section -->
<section id="bundle" class="mb-16 bg-gray-800 rounded-xl p-8 shadow-lg">
<h2 class="text-3xl font-bold mb-6 text-red-500">Build Your Court Bundle</h2>
<div class="mb-8">
<div class="flex items-center mb-4">
<div class="flex-1 border-t-2 border-gray-600"></div>
<span class="px-4 text-gray-400">Step 1: Case Details</span>
<div class="flex-1 border-t-2 border-gray-600"></div>
</div>
<form class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
<div>
<label class="block text-gray-300 mb-2">Case Number</label>
<input type="text" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2">
</div>
<div>
<label class="block text-gray-300 mb-2">Court Location</label>
<input type="text" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2">
</div>
<div>
<label class="block text-gray-300 mb-2">Your Role</label>
<select class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2">
<option>Applicant</option>
<option>Respondent</option>
</select>
</div>
<div>
<label class="block text-gray-300 mb-2">Opposing Party Name</label>
<input type="text" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2">
</div>
</form>
<div class="flex items-center mb-4">
<div class="flex-1 border-t-2 border-gray-600"></div>
<span class="px-4 text-gray-400">Step 2: Upload Documents</span>
<div class="flex-1 border-t-2 border-gray-600"></div>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
<div class="border-2 border-dashed border-gray-600 rounded-lg p-4 text-center hover:border-red-500 cursor-pointer transition">
<i data-feather="file-text" class="w-8 h-8 mx-auto text-gray-400 mb-2"></i>
<p class="text-gray-300">Affidavits</p>
</div>
<div class="border-2 border-dashed border-gray-600 rounded-lg p-4 text-center hover:border-red-500 cursor-pointer transition">
<i data-feather="file-text" class="w-8 h-8 mx-auto text-gray-400 mb-2"></i>
<p class="text-gray-300">Evidence</p>
</div>
<div class="border-2 border-dashed border-gray-600 rounded-lg p-4 text-center hover:border-red-500 cursor-pointer transition">
<i data-feather="file-text" class="w-8 h-8 mx-auto text-gray-400 mb-2"></i>
<p class="text-gray-300">Orders</p>
</div>
</div>
<div class="flex items-center mb-4">
<div class="flex-1 border-t-2 border-gray-600"></div>
<span class="px-4 text-gray-400">Step 3: Generate Bundle</span>
<div class="flex-1 border-t-2 border-gray-600"></div>
</div>
<div class="text-center">
<button class="bg-rose-600 hover:bg-rose-700 text-white font-bold py-3 px-8 rounded-lg text-lg transition">Generate Professional Bundle</button>
</div>
</div>
</section>
<!-- Shame List Preview -->
<section class="mb-16">
<h2 class="text-3xl font-bold mb-6 text-center text-red-500">Patterns of Misconduct</h2>
<div class="bg-gray-800 rounded-xl overflow-hidden shadow-lg">
<div class="overflow-x-auto">
<table class="w-full">
<thead class="bg-gray-700">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Name</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Role</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Reports</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider">Last Incident</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-700">
<tr class="hover:bg-gray-700/50 cursor-pointer">
<td class="px-6 py-4 whitespace-nowrap text-red-400">Judge Smith</td>
<td class="px-6 py-4 whitespace-nowrap">Family Court</td>
<td class="px-6 py-4 whitespace-nowrap">14</td>
<td class="px-6 py-4 whitespace-nowrap">2023-11-15</td>
</tr>
<tr class="hover:bg-gray-700/50 cursor-pointer">
<td class="px-6 py-4 whitespace-nowrap text-red-400">Lawyer Jones</td>
<td class="px-6 py-4 whitespace-nowrap">Barrister</td>
<td class="px-6 py-4 whitespace-nowrap">9</td>
<td class="px-6 py-4 whitespace-nowrap">2023-10-28</td>
</tr>
<tr class="hover:bg-gray-700/50 cursor-pointer">
<td class="px-6 py-4 whitespace-nowrap text-red-400">SW Taylor</td>
<td class="px-6 py-4 whitespace-nowrap">Oranga Tamariki</td>
<td class="px-6 py-4 whitespace-nowrap">22</td>
<td class="px-6 py-4 whitespace-nowrap">2023-12-03</td>
</tr>
</tbody>
</table>
</div>
<div class="px-6 py-4 bg-gray-700 text-center">
<a href="#" class="text-rose-400 hover:text-rose-300 font-medium">View Full Accountability Database β†’</a>
</div>
</div>
</section>
</main>
<custom-footer></custom-footer>
<script src="components/navbar.js"></script>
<script src="components/footer.js"></script>
<script src="script.js"></script>
<script>
feather.replace();
</script>
</body>
</html>