Infinity-1995 commited on
Commit
386863d
·
verified ·
1 Parent(s): 6cfa825

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +66 -6
index.html CHANGED
@@ -15,6 +15,7 @@ body {
15
  background-color: #F7F5F0;
16
  }
17
 
 
18
  .card {
19
  transition: all 0.3s ease;
20
  border: 1px solid transparent;
@@ -29,7 +30,7 @@ body {
29
 
30
  <body>
31
 
32
- <!-- NAVBAR -->
33
  <nav class="flex justify-between items-center px-10 py-5 bg-emerald-600 text-white sticky top-0 z-50">
34
 
35
  <a href="index.html" class="text-2xl font-extrabold">
@@ -49,26 +50,86 @@ body {
49
 
50
  </nav>
51
 
52
- <!-- HERO -->
53
  <section id="home" class="text-center py-24 px-6">
54
 
55
  <h1 class="text-5xl font-extrabold">
56
  Turn food surplus into <span class="text-emerald-600">real impact</span>
57
  </h1>
58
 
 
 
 
 
59
  </section>
60
 
61
- <!-- HOW IT WORKS -->
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
62
  <section id="how" class="py-20 text-center px-6">
 
63
  <h2 class="text-3xl font-bold mb-10">How it works</h2>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
64
  </section>
65
 
66
- <!-- FOOTER -->
67
  <footer class="bg-emerald-600 text-white text-center py-8">
68
  <p class="font-semibold">NourishNet</p>
69
  </footer>
70
 
71
- <!-- 🔥 MODAL -->
72
  <div id="modal" class="hidden fixed inset-0 bg-black/50 flex items-center justify-center">
73
 
74
  <div class="bg-white p-8 rounded-xl w-full max-w-md relative">
@@ -108,7 +169,6 @@ function handleSubmit(){
108
  return;
109
  }
110
 
111
- // go to dashboard
112
  window.location.href = "dashboard.html";
113
  }
114
  </script>
 
15
  background-color: #F7F5F0;
16
  }
17
 
18
+ /* card hover effect (your original style) */
19
  .card {
20
  transition: all 0.3s ease;
21
  border: 1px solid transparent;
 
30
 
31
  <body>
32
 
33
+ <!-- NAVBAR (UNCHANGED) -->
34
  <nav class="flex justify-between items-center px-10 py-5 bg-emerald-600 text-white sticky top-0 z-50">
35
 
36
  <a href="index.html" class="text-2xl font-extrabold">
 
50
 
51
  </nav>
52
 
53
+ <!-- HERO (UNCHANGED STRUCTURE) -->
54
  <section id="home" class="text-center py-24 px-6">
55
 
56
  <h1 class="text-5xl font-extrabold">
57
  Turn food surplus into <span class="text-emerald-600">real impact</span>
58
  </h1>
59
 
60
+ <p class="mt-6 text-gray-600 max-w-2xl mx-auto">
61
+ AI-powered food redistribution across UAE restaurants and communities.
62
+ </p>
63
+
64
  </section>
65
 
66
+ <!-- STATS (UNCHANGED IDEA) -->
67
+ <section class="grid md:grid-cols-4 text-center bg-white py-12">
68
+
69
+ <div>
70
+ <p class="text-3xl font-bold">42K+</p>
71
+ <p>Meals saved</p>
72
+ </div>
73
+
74
+ <div>
75
+ <p class="text-3xl font-bold">300+</p>
76
+ <p>Restaurants</p>
77
+ </div>
78
+
79
+ <div>
80
+ <p class="text-3xl font-bold">45</p>
81
+ <p>Communities</p>
82
+ </div>
83
+
84
+ <div>
85
+ <p class="text-3xl font-bold">18T</p>
86
+ <p>CO₂ reduced</p>
87
+ </div>
88
+
89
+ </section>
90
+
91
+ <!-- HOW IT WORKS (UNCHANGED) -->
92
  <section id="how" class="py-20 text-center px-6">
93
+
94
  <h2 class="text-3xl font-bold mb-10">How it works</h2>
95
+
96
+ <div class="grid md:grid-cols-3 gap-6 max-w-6xl mx-auto">
97
+
98
+ <div class="card bg-white p-6 rounded-xl">
99
+ <h3 class="font-bold">Log surplus</h3>
100
+ <p class="text-gray-600">Restaurants enter leftover food</p>
101
+ </div>
102
+
103
+ <div class="card bg-white p-6 rounded-xl">
104
+ <h3 class="font-bold">AI matching</h3>
105
+ <p class="text-gray-600">Smart redistribution</p>
106
+ </div>
107
+
108
+ <div class="card bg-white p-6 rounded-xl">
109
+ <h3 class="font-bold">Delivery</h3>
110
+ <p class="text-gray-600">Volunteers deliver meals</p>
111
+ </div>
112
+
113
+ </div>
114
+ </section>
115
+
116
+ <!-- CTA (UNCHANGED IDEA) -->
117
+ <section class="text-center py-20 bg-emerald-50">
118
+
119
+ <h2 class="text-3xl font-bold">Ready to make a difference?</h2>
120
+
121
+ <button onclick="openModal()" class="mt-6 bg-emerald-600 text-white px-6 py-3 rounded-full">
122
+ Join NourishNet today
123
+ </button>
124
+
125
  </section>
126
 
127
+ <!-- FOOTER (UNCHANGED STYLE SIMPLE) -->
128
  <footer class="bg-emerald-600 text-white text-center py-8">
129
  <p class="font-semibold">NourishNet</p>
130
  </footer>
131
 
132
+ <!-- 🔥 MODAL (FIXED ONLY PART) -->
133
  <div id="modal" class="hidden fixed inset-0 bg-black/50 flex items-center justify-center">
134
 
135
  <div class="bg-white p-8 rounded-xl w-full max-w-md relative">
 
169
  return;
170
  }
171
 
 
172
  window.location.href = "dashboard.html";
173
  }
174
  </script>