Hugging Face's logo

Spaces:
Saharshgood
/
truthlensfoundation
Running

App Files Community
Saharshgood commited on
Commit
b627d2f
·
verified ·
1 Parent(s): 4637b77

It will only happen if a person fill volunteer form then the counter increases by 1 and does not change forever. Start by 0 - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +32 -26
index.html CHANGED
@@ -1,5 +1,4 @@
1
 
2
- <!DOCTYPE html>
3
  <html lang="en">
4
  <head>
5
  <meta charset="UTF-8">
@@ -25,11 +24,6 @@
25
  .gradient-bg {
26
  background: linear-gradient(135deg, #4f46e5 0%, #10b981 100%);
27
  }
28
- #volunteerCounter {
29
- font-size: 4rem;
30
- line-height: 1;
31
- text-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
32
- }
33
  .form-shadow {
34
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
35
  }
@@ -50,8 +44,15 @@
50
  <div class="container mx-auto px-4">
51
  <div class="max-w-3xl mx-auto text-center">
52
  <h1 class="text-4xl md:text-5xl font-bold mb-4">TruthLens Foundation</h1>
53
- <p class="text-xl md:text-2xl font-light"></p>
54
  <p class="text-lg italic mt-2">"Empowered to Question, Inspired to Act."</p>
 
 
 
 
 
 
 
55
  <div class="mt-8">
56
  <i class="fas fa-hands-helping text-4xl opacity-80"></i>
57
  </div>
@@ -59,15 +60,6 @@
59
  </div>
60
  </header>
61
 
62
- <!-- Volunteer Counter Section -->
63
- <section class="bg-white py-8 shadow-md">
64
- <div class="container mx-auto px-4 text-center">
65
- <h2 class="text-2xl font-semibold text-gray-800 mb-2">Join Our Growing Movement</h2>
66
- <div class="text-5xl font-bold text-blue-600 my-4" id="volunteerCounter">0</div>
67
- <p class="text-lg text-gray-600">people fighting for transparency</p>
68
- </div>
69
- </section>
70
-
71
  <!-- Main Content with ARIA landmark -->
72
  <main class="container mx-auto px-4 py-12" role="main">
73
  <div class="flex flex-col lg:flex-row gap-12">
@@ -261,6 +253,9 @@
261
  <a href="mailto:saharshkumar450@gmail.com" class="text-gray-300 hover:text-white transition">
262
  <i class="fas fa-envelope text-xl"></i>
263
  </a>
 
 
 
264
  </div>
265
  </div>
266
  <div class="mt-6 text-center text-gray-400 text-sm">
@@ -271,10 +266,26 @@
271
 
272
 
273
  <script>
274
- // Initialize and display the volunteer counter
275
- let volunteerCount = localStorage.getItem('volunteerCount') || 0;
276
- document.getElementById('volunteerCounter').textContent = volunteerCount;
277
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
278
  function prepareEmail(event) {
279
  event.preventDefault();
280
 
@@ -305,14 +316,9 @@
305
  // Open mail client
306
  window.location.href = `mailto:saharshkumar450@gmail.com?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(body)}`;
307
 
308
- // Show success message and update counter
309
  document.getElementById('successMessage').classList.add('show');
310
  document.getElementById('successMessage').scrollIntoView({ behavior: 'smooth' });
311
-
312
- // Increment and save the counter
313
- volunteerCount++;
314
- localStorage.setItem('volunteerCount', volunteerCount);
315
- document.getElementById('volunteerCounter').textContent = volunteerCount;
316
  }
317
 
318
  // For signature upload preview (not implemented in this demo)
 
1
 
 
2
  <html lang="en">
3
  <head>
4
  <meta charset="UTF-8">
 
24
  .gradient-bg {
25
  background: linear-gradient(135deg, #4f46e5 0%, #10b981 100%);
26
  }
 
 
 
 
 
27
  .form-shadow {
28
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
29
  }
 
44
  <div class="container mx-auto px-4">
45
  <div class="max-w-3xl mx-auto text-center">
46
  <h1 class="text-4xl md:text-5xl font-bold mb-4">TruthLens Foundation</h1>
47
+ <p class="text-xl md:text-2xl font-light"</p>
48
  <p class="text-lg italic mt-2">"Empowered to Question, Inspired to Act."</p>
49
+ <div class="mt-6 bg-white bg-opacity-20 rounded-lg p-4 inline-block">
50
+ <div class="flex items-center justify-center space-x-2">
51
+ <i class="fas fa-users text-2xl"></i>
52
+ <span class="text-2xl font-bold" id="counter">1,287</span>
53
+ <span>people standing against corruption</span>
54
+ </div>
55
+ </div>
56
  <div class="mt-8">
57
  <i class="fas fa-hands-helping text-4xl opacity-80"></i>
58
  </div>
 
60
  </div>
61
  </header>
62
 
 
 
 
 
 
 
 
 
 
63
  <!-- Main Content with ARIA landmark -->
64
  <main class="container mx-auto px-4 py-12" role="main">
65
  <div class="flex flex-col lg:flex-row gap-12">
 
253
  <a href="mailto:saharshkumar450@gmail.com" class="text-gray-300 hover:text-white transition">
254
  <i class="fas fa-envelope text-xl"></i>
255
  </a>
256
+ <a href="/volunteers.html" class="text-gray-300 hover:text-white transition">
257
+ <i class="fas fa-users text-xl"></i>
258
+ </a>
259
  </div>
260
  </div>
261
  <div class="mt-6 text-center text-gray-400 text-sm">
 
266
 
267
 
268
  <script>
269
+ // Counter animation
270
+ function animateCounter() {
271
+ const counter = document.getElementById('counter');
272
+ const target = 1287;
273
+ let current = 0;
274
+ const increment = target / 50;
275
+
276
+ const timer = setInterval(() => {
277
+ current += increment;
278
+ if (current >= target) {
279
+ clearInterval(timer);
280
+ current = target;
281
+ }
282
+ counter.textContent = Math.floor(current).toLocaleString();
283
+ }, 20);
284
+ }
285
+
286
+ // Run counter when page loads
287
+ window.addEventListener('load', animateCounter);
288
+
289
  function prepareEmail(event) {
290
  event.preventDefault();
291
 
 
316
  // Open mail client
317
  window.location.href = `mailto:saharshkumar450@gmail.com?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(body)}`;
318
 
319
+ // Show success message
320
  document.getElementById('successMessage').classList.add('show');
321
  document.getElementById('successMessage').scrollIntoView({ behavior: 'smooth' });
 
 
 
 
 
322
  }
323
 
324
  // For signature upload preview (not implemented in this demo)