-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathHomepage.html
163 lines (144 loc) · 7.95 KB
/
Homepage.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>NUTRIVERSE</title>
<link rel="stylesheet" href="Homepage.css">
</head>
<body>
<!-- Navigation Bar -->
<nav>
<div class="logo">
<a href="#home"><img src="z 2.png" alt="Nutriverse Logo" height="70" width="70" /></a>
<h1 ><a href="#home">NUTRIVERSE</a></h1>
</div>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#features">Features</a></li>
<li><a href="#reviews">Reviews</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<button class="login"><a href="signin_page.html">Login/Signup</a></button>
</nav>
<!-- Main Content -->
<main>
<!-- Home Section -->
<section id="home" class="home-section">
<div class="home-content">
<h2>Welcome to NUTRIVERSE</h2>
<p>Step into Nutriverse, where every meal is an opportunity to celebrate health!<br> Join a community of passionate food lovers and discover how our app transforms nutrition into a joyful adventure.<br> Together, we’ll make wellness a delightful part of everyday life!</p>
</div>
<div class="app-interface">
<img src="FoodSnap - Camera Interface.png" alt="Nutriverse App Interface">
</div>
</section>
<!-- About Section -->
<section class="about-section" id="about">
<h2>About Nutriverse</h2>
<div class="about-content">
<p>
Welcome to Nutriverse, your friendly guide on a delicious journey to healthier eating! 🌟
We believe that managing your diet shouldn’t be boring or bland. Here, we provide you with all the tools
you need to conquer your dietary goals without sacrificing the joy of eating!
</p>
<p>
With our intuitive app, you can effortlessly track your carbohydrate, protein, and calorie intake.
Say goodbye to confusing diets and hello to delicious, balanced meals! 🍏🥗
</p>
<p>
Join our community of food lovers who are transforming their lives one meal at a time. Together, we can
inspire each other to make healthier choices while having fun along the way! 🎉
</p>
</div>
</section>
<!-- Features Section -->
<section class="features-section" id="features"> <!-- Add id for navigation -->
<h2>Features of Nutriverse</h2>
<div class="features-grid">
<div class="feature-item">
<h3>🍽️ Count Your Calories</h3>
<p>
Keep track of your daily calorie intake effortlessly! Our app allows you to set your <u>caloric goals</u> and
monitor your consumption with just a few taps. Plus, use our innovative camera feature to recognize food items
and receive tailored suggestions! 📷
</p>
</div>
<div class="feature-item">
<h3>🎯 Weekly and Daily Goals</h3>
<p>
Set personalized goals that help you stay on track. With our streak monitoring system, you'll feel the thrill of
<u>consistent progress</u> and celebrate every achievement, no matter how small! 🥳
</p>
</div>
<div class="feature-item">
<h3>📊 Data Analytics</h3>
<p>
Gain insights into your eating habits with our visual analytics. Understand your <u>trends</u>, discover
<u>impulsive buying behaviors</u>, and learn how to make healthier choices based on real data! 📈
</p>
</div>
<div class="feature-item">
<h3>🌱 Eating Programs</h3>
<p>
Choose from a variety of eating programs tailored to your needs, including plant-based diets and fasting.
Our programs are designed to help you meet your <u>caloric goals</u> while enjoying a diverse range of meals!
🌟
</p>
</div>
<div class="feature-item">
<h3>👥 Community Groups</h3>
<p>
Connect with like-minded individuals on a similar journey! Share your progress, exchange tips, and find support
in our vibrant community groups. Together, we can achieve more! 🤝
</p>
</div>
<div class="feature-item">
<h3>🤖 AI Accountability Partner</h3>
<p>
Meet your personal AI advisor! This feature provides real-time dietary adjustments and meal planning suggestions,
ensuring you stay on track while navigating your health journey. 🚀
</p>
</div>
</div>
</section>
<!-- Reviews Section -->
<section class="customer-reviews" id="reviews"> <!-- Add id for navigation -->
<h2>Customer Reviews</h2>
<div class="reviews-container">
<div class="reviews-wrapper">
<div class="review-item">🌟 "Nutriverse has completely changed my eating habits for the better!" - Alex M.</div>
<div class="review-item">🌟 "The calorie counting feature is super helpful and easy to use." - Sarah J.</div>
<div class="review-item">🌟 "I love the community aspect; I've met so many great people!" - Mike T.</div>
<div class="review-item">🌟 "The AI partner is like having a personal trainer with me!" - Emma W.</div>
<div class="review-item">🌟 "I achieved my goals faster than I thought possible!" - James R.</div>
<div class="review-item">🌟 "The app makes dieting fun and engaging!" - Linda G.</div>
<div class="review-item">🌟 "The data analytics helped me understand my eating habits." - Daniel B.</div>
<div class="review-item">🌟 "I can't believe how easy it is to set my goals!" - Chloe S.</div>
<div class="review-item">🌟 "The meal suggestions are fantastic and delicious!" - Josh K.</div>
<div class="review-item">🌟 "Nutriverse is a game changer for anyone serious about health!" - Mia L.</div>
</div>
</div>
</section>
<!-- Contact Section -->
<section id="contact" class="contact-us">
<h2>Contact Us</h2>
<p>If you have any questions or need assistance, feel free to reach out to us!</p>
<form class="contact-form">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required placeholder="Your Name">
<label for="email">Email:</label>
<input type="email" id="email" name="email" required placeholder="Your Email">
<label for="message">Message:</label>
<textarea id="message" name="message" rows="5" required placeholder="Your Message"></textarea>
<button type="submit">Send Message</button>
</form>
</section>
</main>
<footer class="footer">
<p>© 2024 Nutriverse. All rights reserved.</p>
</footer>
<script src="try.js"></script>
</body>
</html>