-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
187 lines (146 loc) · 6.89 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
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
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CoffeCLUB</title>
<link rel="stylesheet" href="style.css">
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
</head>
<body>
<header class="header">
<a href="#home" class="logo">
Coffee<span>CLUB</span>
</a>
<i class='bx bx-menu' id="menu-icon"></i>
<nav class="navbar">
<a href="#home" class="active">Home</a>
<a href="#about">About Us</a>
<a href="#coffees">Coffees</a>
<a href="#reviews">Reviews</a>
<a href="#contact">Contact</a>
</nav>
</header>
<section class="home" id="home">
<div class="home-content">
<h3>Welcome to</h3>
<h1>Coffee<span>CLUB</span></h1>
<p>Sip. Savor. Socialize!</p>
<a href="#" class="btn"> Order Now</a>
</div>
</section>
<section class="about" id="about">
<div class="about-content">
<h2 class="heading">About <span>Us</span></h2>
<p>CoffeClub was born out of a passion for creating a cozy, welcoming space where friends and strangers alike can gather, connect, and enjoy top-qualiy coffee. We are committed to crafting the perfect cup of coffee using ethically sourced beans from around the world, ensuring every sip is as satisfying as the last. Our friendly knowledgeable baristas are always ready to assist you in finding your new favorite drink or snack, making your time at CoffeClub truly unforgettable.</p>
<a href="#" class="btn">Read More</a>
</div>
</section>
<section class="coffees" id="coffees">
<h2 class="heading">Coffees</h2>
<div class="coffees-container">
<div class="coffees-box">
<img src="myassets/1.png.png" alt="">
<div class="coffees-info">
<h4>Coffee 1</h4>
<p>Café au lait</p>
<a href="#">
<i class='bx bxs-coffee'></i>
</a>
</div>
</div>
<div class="coffees-box">
<img src="myassets/3.png.png" alt="">
<div class="coffees-info">
<h4>Coffee 2</h4>
<p>Hacienda La Esmeralda</p>
<a href="#">
<i class='bx bxs-coffee'></i>
</a>
</div>
</div>
<div class="coffees-box">
<img src="myassets/4.png.png" alt="">
<div class="coffees-info">
<h4>Coffee 3</h4>
<p>Kopi Luwak</p>
<a href="#">
<i class='bx bxs-coffee'></i>
</a>
</div>
</div>
</div>
</section>
<section class="reviews" id="reviews">
<h2 class="heading">Reviews</h2>
<div class="reviews-container">
<div class="reviews-box">
<i class='bx bx-user-circle'></i>
<h3>Zenhlanhla Ngubane</h3>
<p> absolutely love CoffeeClub! Their coffee is always smooth and delicious, and the baristas are incredibly friendly. It's the perfect place to catch up with friends or get some work done in a cozy atmosphere.</p>
<a href="#" class="btn">Read More</a>
</div>
<div class="reviews-box">
<i class='bx bx-user-circle'></i>
<h3>Nqobile Zulu </h3>
<p>Unfortunately, my experience at CoffeeClub didn't live up to the hype. The service was quite slow, and the coffee tasted burnt. The atmosphere was not cozy or inviting, making it difficult to enjoy my time there. While the staff seemed friendly, the overall quality just wasn't what I expected based on the reviews.</p>
<a href="#" class="btn">Read More</a>
</div>
<div class="reviews-box">
<i class='bx bx-user-circle'></i>
<h3>Shannon Mano</h3>
<p>CoffeeClub has the best atmosphere! The interior is warm and inviting, and their selection of coffee and snacks is fantastic. I always look forward to spending time here, whether it's for a quick caffeine fix or a relaxing weekend visit.</p>
<a href="#" class="btn">Read More</a>
</div>
<div class="reviews-box">
<i class='bx bx-user-circle'></i>
<h3>Naomi Osaka</h3>
<p>CoffeeClub is my go-to spot for my daily coffee fix. The atmosphere is warm and inviting, and their commitment to using ethically sourced beans makes me feel good about supporting them. I always leave feeling satisfied and energized for the day ahead.</p>
<a href="#" class="btn">Read More</a>
</div>
</div>
</section>
<section class="contact" id="contact">
<h2 class="heading">Contact <span>Us</span></h2>
<form action="#">
<div class="input-box">
<input type="text" placeholder="Full Name">
<input type="email" placeholder="Email">
</div>
<div class="input-box">
<input type="number" placeholder="Phone Name">
<input type="text" placeholder="Subject">
</div>
<textarea name="" id="" cols="30" rows="10"placeholder="Your Message"></textarea>
<input type="submit" value="Send Message" class="btn">
</form>
</section>
<footer class="footer">
<div class="social">
<a href="#"><i class='bx bxl-instagram-alt' ></i></a>
<a href="#"><i class='bx bxl-facebook-square' ></i></a>
<a href="#"><i class='bx bxl-pinterest' ></i></a>
<a href="#"><i class='bx bxl-pinterest' ></i></a>
</div>
<ul class="list">
<li>
<a href="#">FAQ</a>
</li>
<li>
<a href="#">Products</a>
</li>
<li>
<a href="#">About Us</a>
</li>
<li>
<a href="#">Contact</a>
</li>
<li>
<a href="#">Privacy Policy</a>
</li>
</ul>
<p class="copyright">© 2024 CoffeeClub and its partners Themba Nzuza and Nhlaka Khumalo. All rights reserved. CoffeeClub, the CoffeeClub logo, and other CoffeeClub marks are trademarks of CoffeeClub, Inc. All other trademarks are the property of their respective owners.</p>
</footer>
<script src="script.js"></script>
</body>
</html>