-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
161 lines (133 loc) · 4.23 KB
/
index.html
File metadata and controls
161 lines (133 loc) · 4.23 KB
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
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Coders Coffeehouse, Dublin based coffeehouse offering free unlimited wifi and quality caffeine to fuel your code.">
<meta name="keywords" content="coffeehouse, coffee, developers cafe, free wifi, dublin">
<meta name="author" content="Coders Coffeehouse">
<link rel="stylesheet" href="assets/css/style.css">
<title>Coders Coffeehouse</title>
</head>
<body>
<header class="text-center page-header flex horizontal-center" id="home">
<div class="vertical-center">
<h1>Welcome to Coders Coffeehouse!</h1>
<p>Turning caffeine into code since 1999.</p>
</div>
</header>
<nav class="black-background text-center text-uppercase">
<a href="#home" aria-label="Go to the top of the page">Home</a>
<a href="#drinks" aria-label="Go to drinks menu section">Drinks Menu</a>
<a href="#contact" aria-label="Go to contact information section">Contact</a>
<a href="form.html" aria-label="Fill in our survey for your chance to win free coffee">Win Free Coffee</a>
</nav>
<section class="text-center flex">
<div class="one-third-width-column text-center text-white vertical-center">
<div class="text-white reasons-box">
<h2>Reasons to love us</h2>
<ol class="text-uppercase">
<li>Free unlimited wifi</li>
<li>Charging outlets with every table</li>
<li>High quality coffee to fuel your code</li>
</ol>
</div>
</div>
<div class="two-thirds-width-column">
<img src="assets/images/coders-coffeehouse-project-1.jpg"
alt="Cafe table with laptop and coffee" width="400">
</div>
</section>
<section id="drinks" class="text-center text-white">
<h2>Drinks Menu</h2>
<div id="coffee-box" class="drinks-box">
<h3>Coffee</h3>
<ul>
<li>Latte</li>
<li>Americano</li>
<li>Cappuccino</li>
<li>Espresso</li>
<li>Irish Coffee</li>
<li>Macchiato</li>
<li>Flat White</li>
</ul>
</div>
<div id="tea-box" class="drinks-box">
<h3>Tea</h3>
<ul>
<li>Earl Grey</li>
<li>Green tea</li>
<li>Lemon tea</li>
<li>Peppermint tea</li>
<li>Ginger tea</li>
<li>Mint tea</li>
</ul>
</div>
<div id="cold-drinks-box" class="drinks-box">
<h3>Cold drinks</h3>
<ul>
<li>Iced coffee</li>
<li>Ice Tea</li>
<li>Spring water</li>
<li>Soft drinks
<ul>
<li>Coca Cola</li>
<li>Fanta</li>
<li>7up</li>
</ul>
</li>
</ul>
</div>
</section>
<section id="contact">
<h2 class="text-center">Contact</h2>
<div class="contact-boxes-container flex horizontal-center gap-20">
<div class="contact-box">
<h3 class="text-center">Open times</h3>
<table class="text-center">
<tr>
<th></th>
<th>Open</th>
<th>Close</th>
</tr>
<tr>
<td>Mon - Fri</td>
<td>09:00</td>
<td>21:00</td>
</tr>
<tr>
<td>Weekend</td>
<td>10:00</td>
<td>22:00</td>
</tr>
</table>
</div>
<div class="text-right contact-box last">
<h3>Get in touch</h3>
<div>
<span class="bold">Phone: </span>
<span>012 345 678 910</span>
</div>
<div>
<span class="bold">Email: </span>
<span>email@coderscoffeehouse.com</span>
</div>
</div>
<div class="text-center contact-box vertical-bottom">
<h3>Address</h3>
<p>Coders Coffeehouse,<br>42 Coffeebean street,<br>Dublin</p>
</div>
</div>
</section>
<section id="map-wrapper">
<iframe id="map" src="https://bit.ly/2QVfkiy" width="100%" height="300"></iframe>
</section>
<footer class="text-uppercase">
<span>Find us on:</span>
<a href="https://www.facebook.com" target="_blank" rel="noopener" aria-label="Find us on Facebook (link opens in a new tab)">Facebook</a>
<a href="https://www.instagram.com" target="_blank" rel="noopener" aria-label="Find us on Instagram (link opens in a new tab)">Instagram</a>
<a href="https://www.twitter.com" target="_blank" rel="noopener" aria-label="Find us on Twitter (link opens in a new tab)">Twitter</a>
<p>Copyright © Coders Coffeehouse 2020</p>
</footer>
</body>
</html>