-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
110 lines (104 loc) · 4.34 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="reset.css">
<link rel="stylesheet" href="style.css">
<link href="https://fonts.googleapis.com/css2?family=Lato&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Project 1A</title>
</head>
<body>
<header>
<nav>
<ul class="nav-bar">
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Order Now</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Location</a></li>
<li><a href="#" class="icon-cart"><i class="fa fa-cart-plus"></i></a></li>
<li><a href="#" class="icon-search"><i class="fa fa-search"></i></a></li>
</ul>
</nav>
</header>
<section class="container">
<section class="container-1">
<div class="hidden-container">
<h1 class="container-title">Welcome <br>To Our Cuisine <br>Restaurant</h1>
<form action="#" class="search-section">
<input type="search" class="search-bar"><button class="btn">Location</button>
</form>
<ul class="icon-bar">
<li><i class="fa fa-facebook-f"></i> 252k</li>
<li><i class="fa fa-twitter"></i> 62k</li>
<li><i class="fa fa-instagram"></i> 55k</li>
</ul>
</div>
</section>
<section class="container-2">
<div class="hidden-container">
<span class="container-quote">About us</span>
<h2 class="container-title">Discover Our <br>Restaurant Story</h2>
<div class="container-body">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Excepturi incidunt aperiam ullam! Fugiat corporis incidunt architecto adipisci quibusdam odit asperiores! Rerum nobis recusandae alias obcaecati ullam accusantium dignissimos mollitia quod maiores animi harum voluptates iure exercitationem odit eligendi dolor voluptatibus soluta rem esse, dolorum minus? Itaque numquam quo omnis laudantium.</p>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Architecto et odio dolorum deserunt? Quasi qui excepturi, reprehenderit saepe odit fuga officia hic nihil enim tempore officiis amet, nostrum modi sequi.</p>
</div>
<button class="btn">Discover Menu</button>
</div>
</section>
<section class="container-3">
<span class="container-quote">Order Online Now</span>
<h1 class="container-title">Our Specialty Cuisine</h1>
<ul class="menu-bar">
<li><a href="#">Breakfast</a></li>
<li><a href="#">Lunch</a></li>
<li><a href="#">Dinner</a></li>
<li><a href="#">Dessert</a></li>
<li><a href="#">Shakes</a></li>
</ul>
<div class="foods">
<div class="foods food-1 hidden"><img src="/blueberries-2278921_1920.jpg" alt=""></div>
<div class="foods food-2 hidden"><img src="/cake-1971552_1920.jpg" alt=""></div>
<div class="foods food-3 hidden"><img src="/eclair-3366430_1920.jpg" alt=""></div>
<div class="foods food-4 hidden"><img src="/food-712665_1920.jpg" alt=""></div>
</div>
</section>
<section class="container-4">
<span class="container-quote">Book Table</span>
<h1 class="container-title">Opening Hours</h1>
<a href="#" class="container-call-icon"><i class="fa fa-phone"></i></a>
<span>Call Now</span>
<h3>+12345 678 910</h3>
<div class="container-store-hours">
<div>
<span>Monday to Thursday</span>
<span>09:00am - 22:00pm</span>
</div>
<div>
<span>Monday to Thursday</span>
<span>11:00am - 20:00pm</span>
</div>
</div>
<div>
<img src="/pexels-cats-coming-920220.jpg" class="container-4-image" alt="">
</div>
</section>
<section class="container-5">
<span class="container-quote">Testimonials</span>
<h1 class="container-title">Customers Say</h1>
<div class="container-image">
<img src="/darby-frey.jpg" class="testimonial-person" alt="customer">
</div>
<span>Bob</span>
<span>The Builder</span>
<span>*****</span>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur, veritatis veniam. Quaerat dolore recusandae laudantium, fuga doloribus earum modi facilis unde mollitia excepturi nobis! Praesentium quod amet eveniet aut! Obcaecati.</p>
</section>
</section>
<script defer src="main.js"></script>
</body>
</html>