-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
ce9db98
commit b6d1254
Showing
1 changed file
with
165 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,165 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
<meta name="author" content="" /> | ||
<meta name="description" content="" /> | ||
<meta name="topic" content="" /> | ||
<meta name="keywords" content="" /> | ||
<link rel="icon" href="../assets/img/favicon.png" /> | ||
<!-- CSS --> | ||
<!-- Should be applied first --> | ||
<link rel="stylesheet" href="../assets/css/general.css" /> | ||
<!-- Then this --> | ||
<link rel="stylesheet" href="../assets/css/style.css" /> | ||
<!-- CSS --> | ||
<!-- Font --> | ||
<link rel="preconnect" href="https://fonts.googleapis.com" /> | ||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> | ||
<link | ||
href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap" | ||
rel="stylesheet" | ||
/> | ||
<!-- Font --> | ||
<!-- JS --> | ||
<script defer src="../assets/js/app.js"></script> | ||
<!-- JS --> | ||
</head> | ||
<body> | ||
<header class="header"> | ||
<img class="img-logo" src="../assets/img/omnifood-logo.png" /> | ||
<nav class="navigation"> | ||
<ul class="main-nav-list"> | ||
<li><a class="main-nav-links" href="#">How it works</a></li> | ||
<li><a class="main-nav-links" href="#">Meals</a></li> | ||
<li><a class="main-nav-links" href="#">Testimonials</a></li> | ||
<li><a class="main-nav-links" href="#">Pricing</a></li> | ||
<li> | ||
<a class="nav-btn btn btn--cta" href="#"> Try for Free </a> | ||
</li> | ||
</ul> | ||
</nav> | ||
</header> | ||
<main> | ||
<section class="section-hero"> | ||
<div class="hero"> | ||
<div class="hero-text-box"> | ||
<h1 class="heading-primary"> | ||
A healthy meal delivered to your door, every single day | ||
</h1> | ||
<p class="hero-description"> | ||
The smart 365-days-per-year food subscription that will make you | ||
eat healthy again. Tailored to your personal tastes and | ||
nutritional needs. We have delivered 250,000+ meals last year! | ||
</p> | ||
<div class="btn-container"> | ||
<a class="btn btn--cta" href="#">Start eating well</a> | ||
<a class="btn btn--learn" href="#">Learn more ↓</a> | ||
</div> | ||
<div class="customer--faces"> | ||
<img | ||
class="cust--image cust-1" | ||
src="../assets/img/customers/customer-1.jpg" | ||
/> | ||
<img | ||
class="cust--image" | ||
src="../assets/img/customers/customer-2.jpg" | ||
/> | ||
<img | ||
class="cust--image" | ||
src="../assets/img/customers/customer-3.jpg" | ||
/> | ||
<img | ||
class="cust--image" | ||
src="../assets/img/customers/customer-4.jpg" | ||
/> | ||
<img | ||
class="cust--image" | ||
src="../assets/img/customers/customer-5.jpg" | ||
/> | ||
<img | ||
class="cust--image last-image" | ||
src="../assets/img/customers/customer-6.jpg" | ||
/> | ||
<p class="para"> | ||
<span class="orders--count">250,000+</span> delivered meals last | ||
year! | ||
</p> | ||
</div> | ||
</div> | ||
<div class="hero-img-box"> | ||
<img | ||
loading="lazy" | ||
class="hero-img" | ||
src="../assets/img/hero.png" | ||
alt="A Woman enjoying food, meals and storage" | ||
/> | ||
</div> | ||
</div> | ||
</section> | ||
<section class="section-how"> | ||
<div class="container"> | ||
<span class="subheading">How it works</span> | ||
<h2 class="heading-secondary">Your daily dose of help in 3 steps</h2> | ||
</div> | ||
<div class="container grid grid--2-cols grid-center-vertically"> | ||
<!-- Step -01 --> | ||
<div class="step-text-box"> | ||
<p class="step-number">01</p> | ||
<h3 class="heading-tertary"> | ||
Tell us what you like (and what not) | ||
</h3> | ||
<p class="step-description"> | ||
Never again waste time thinking about what to eat! Omnifood AI | ||
will create a 100% personalized weekly meal plan just for you. It | ||
makes sure you get all the nutrients and vitamins you need, no | ||
matter what diet you follow! | ||
</p> | ||
</div> | ||
<div class="step-image-box"> | ||
<img | ||
class="step-img" | ||
src="../assets/img/app/app-screen-1.png" | ||
alt="Iphone app preferences screen" | ||
/> | ||
</div> | ||
<!-- Step -02--> | ||
<div class="step-image-box"> | ||
<img | ||
class="step-img" | ||
src="../assets/img/app/app-screen-1.png" | ||
alt="Iphone app preferences screen" | ||
/> | ||
</div> | ||
<div class="step-text-box"> | ||
<p class="step-number">02</p> | ||
<h3 class="heading-tertary">Approve your weekly meal plan</h3> | ||
<p class="step-description"> | ||
Once per week, approve the meal plan generated for you by Omnifood | ||
AI. You can change ingredients, swap entire meals, or even add | ||
your own recipes | ||
</p> | ||
</div> | ||
<!-- Step -03 --> | ||
<div class="step-text-box"> | ||
<p class="step-number">03</p> | ||
<h3 class="heading-tertary">Receive meals at convenient time</h3> | ||
<p class="step-description"> | ||
Best chefs in town will cook your selected meal every day, and we | ||
will deliver it to your door whenever works best for you. You can | ||
change delivery schedule and address daily! | ||
</p> | ||
</div> | ||
<div class="step-image-box"> | ||
<img | ||
class="step-img" | ||
src="../assets/img/app/app-screen-1.png" | ||
alt="Iphone app preferences screen" | ||
/> | ||
</div> | ||
</div> | ||
</section> | ||
</main> | ||
</body> | ||
</html> |