-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
99 lines (98 loc) · 3.07 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
<!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="./css/styles.css" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
/>
<script
src="https://kit.fontawesome.com/cd4c970380.js"
crossorigin="anonymous"
></script>
<script src="js/app.js" defer></script>
<title>Betty's Groceries</title>
</head>
<body>
<div class="body--wrapper">
<header>
<div class="logo">Betty's Groceries</div>
<nav class="navbar">
<ul class="nav__links">
</ul>
</nav>
</header>
<main>
<section class="hero section" id="home" data-nav="Home">
<div class="hero__text">
<h1>Best Quality and Affordable Groceries</h1>
<p>
Eiusmod Lorem dolore reprehenderit veniam laborum
deserunt culpa laborum amet. Quis cillum ullamco
ullamco cupidatat ut reprehenderit. Exercitation
magna eiusmod non aute sunt. Esse voluptate anim
laborum sit ea excepteur id proident.
</p>
<button class="hero__button">Go Shopping</button>
</div>
</section>
<section class="section__item section" id="section--fruits" data-nav="Fruits">
<div class="item--description">
<h2>Fruits</h2>
<p>Excepteur non anim elit mollit aliquip commodo ad
fugiat elit. Cupidatat laborum commodo voluptate
exercitation. Eu culpa eu ullamco magna occaecat</p>
</div>
<div class="item__img">
<img src="./asset/fruits-unsplash-sm.jpg">
</div>
</section>
<section class="section__item section" id="section--vegs" data-nav="Vegs">
<div class="item--description">
<h2>Vegs</h2>
<p>Excepteur non anim elit mollit aliquip commodo ad
fugiat elit. Cupidatat laborum commodo voluptate
exercitation. Eu culpa eu ullamco magna occaecat</p>
</div>
<div class="item__img">
<img src="./asset/vegs-unsplash-sm.jpg">
</div>
</section>
<section class="section__item section" id="section--snacks" data-nav="Snacks">
<div class="item--description">
<h2>Snacks</h2>
<p>Excepteur non anim elit mollit aliquip commodo ad
fugiat elit. Cupidatat laborum commodo voluptate
exercitation. Eu culpa eu ullamco magna occaecat</p>
</div>
<div class="item__img">
<img src="./asset/zach-rowlandson-snacks-unsplash-sm.jpg">
</div>
</section>
</main>
<footer>
<div class="contact">
<h2>Stay in touch</h2>
<div class="contact__info">
<input
type="text"
name="email"
class="contact__input"
id="email"
placeholder="Enter your email"
/>
<button class="contact__button">Subscribe</button>
</div>
</div>
<div class="social">
<i class="fab fa-facebook-square fa fa-3x"></i>
<i class="fab fa-twitter-square fa-3x"></i>
<i class="fab fa-instagram-square fa-3x"></i>
</div>
</footer>
</div>
</body>
</html>