-
Notifications
You must be signed in to change notification settings - Fork 0
/
materialize.html
247 lines (236 loc) · 10.3 KB
/
materialize.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
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<link rel="stylesheet" href="styles.css"> <!-- Link to the external stylesheet -->
<title>Elise's Pumpkin Loaf Bakery</title>
</head>
<body>
<!-- Navbar -->
<nav class="header-bg">
<div class="nav-wrapper">
<ul>
<li><a href="index.html">Bakery Home</a></li>
<li><a href="about.html">Contact Information</a></li>
<li><a href="sisterlocation.html">Expanding Location</a></li>
<li><a href=materialize.html>Expanding Location</a></li>
<li><a href=materialize2.html>Expanding Location</a></li>
<a href="jquery.html">JQuery</a>
</ul>
</div>
</nav>
<!-- Header Section -->
<div class="section header-bg center-align">
<h1 class="white-text">Welcome to Elise's Pumpkin Loaf Bakery</h1>
<p class="white-text">Where autumnal flavprs jpin together in a beautiful harmony with cozy vibes</p>
</div>
<!-- About Us Section -->
<div id="about" class="section section-bg">
<div class="container">
<div class="row">
<div class="col s12 m6">
<h2>About Us</h2>
<p><strong>Elise's Pumpkin Loaf Bakery</strong> is committed to being an active part of the Oxford community as a family-owned small business. We have curated a unique vibe of relaxation and coziness, inviting customers to spend time in our comfy seating areas.</p>
<p>While our specialty is pumpkin loaves, our menu diversifies with lattes, espressos, coffee cakes, cupcakes, sourdough loaves, and tarts. Experience the <u>Elise's Pumpkin Loaves</u> difference.</p>
</div>
<div class="col s12 m6">
</div>
</div>
</div>
</div>
<!-- Menu Section -->
<div id="menu" class="section">
<div class="container">
<h2>Pumpkin Loaf Menu</h2>
<table class="highlight">
<thead>
<tr>
<th>Item</th>
<th>Description</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Classc Pumpkin Loaf</td>
<td>ur original loaf, made with an in-house pumpkin puree that perfectly encapsulates the sweet taste of pumpkin.</td>
<td>$4.95</td>
</tr>
<tr>
<td>Nutmeg Pumpkin Loaf</td>
<td>Our classic loaf with a nutty twist, good for all you nuts out there! (contains: nuts, do not consume if you are allergic to nuts)</td>
<td>$5.95</td>
</tr>
<tr>
<td>Vanilla Glazed Loa</td>
<td>If the classic loaf isn't sweet enough for you, try our classic loaf drizzled with vanilla bean sweet glaze.</td>
<td>$4.95</td>
</tr>
<tr>
<td>Cinnamon Snap Loaf</td>
<td>Classic loaf with a warm cinnamon blend and slight notes of peppermint.</td>
<td>$6.95</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- Pumpkin Loaves Section -->
<div class="container">
<h2>Pumpkin Loaves (Our Specialty Menu)</h2>
<table class="highlight">
<thead>
<tr>
<th>Name</th>
<th>Description</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Nutmeg Pumpkin Loaf</td>
<td>Our classic loaf with a nutty twist. (Contains nuts)</td>
<td>$5.95</td>
</tr>
<tr>
<td>Vanilla Glazed Loaf</td>
<td>Classic loaf drizzled with vanilla bean sweet glaze.</td>
<td>$4.95</td>
</tr>
<tr>
<td>Cinnamon Snap Loaf</td>
<td>Classic loaf with a warm cinnamon blend.</td>
<td>$6.95</td>
</tr>
<tr>
<td>The Classic</td>
<td>Original loaf made with in-house pumpkin puree.</td>
<td>$4.95</td>
</tr>
</tbody>
</table>
</div>
<div class="image-gallery">
<img src="images/cinnamonpumpkinloaf.jpeg" alt="Cinnamon Loaf" class="responsive-img" />
<img src="images/nutpumpkinloaf.jpeg" alt="Nut Pumpkin Loaf" class="responsive-img" />
<img src="images/pumpkinloafclassic.jpeg" alt="Classic Pumpkin Loaf" class="responsive-img" />
<img src="images/vaniallglazedpumpkinloaf.jpeg" alt="Vanilla Glazed Pumpkin Loaf" class="responsive-img" />
</div>
<h2>Cold Foam Lattes</h2>
<table>
<tr>
<th>Name</th>
<th>Description</th>
<th>Price</th>
</tr>
<tr>
<td>Sweet Cream Cold Brew</td>
<td>Our specially formulated in-house cold brew topped with a sweet cream cold foam, can be ordered in small, medium, or large.</td>
<td>$4.95</td>
</tr>
<tr>
<td>Sweet Cream Pumpkin Cold Brew</td>
<td>Our specially formulated in-house cold brew topped with a sweet cream pumpkin cold foam (made with real pumpkins), can be ordered in small, medium, or large.</td>
<td>$5.95</td>
</tr>
<tr>
<td>Matcha Latte</td>
<td>A caffeinated, creamy, and frothy tea-based drink, can be ordered in small, medium, or large.</td>
<td>$7.95</td>
</tr>
<tr>
<td>Peppermint Cream Latte</td>
<td>Our in-house cold brew topped with a whipped peppermint cream cold foam, can be ordered in small, medium, or large.</td>
<td>$8.95</td>
</tr>
</table>
<h2>Sourdough Loaves</h2>
<table>
<tr>
<td>Crusty, tangy bread with a chewy interior and airy texture.</td>
<td>$7.00</td>
</tr>
</table>
<h2>Fruit Tarts</h2>
<table>
<tr>
<th>Name</th>
<th>Description</th>
<th>Price</th>
</tr>
<tr>
<td>Classic Tarty-Tart</td>
<td>A classic tart topped with fresh whipped cream, glazed kiwis, strawberries, blueberries, and mandarin oranges.</td>
<td>$3.95</td>
</tr>
</table>
<!-- Contact Section -->
<div id="contact" class="section section-bg">
<div class="container">
<h2>Contact Us</h2>
<div class="row">
<div class="col s12 m6">
<form>
<div class="input-field">
<input id="name" type="text" class="validate" required>
<label for="name">Name</label>
</div>
<div class="input-field">
<input id="email" type="email" class="validate" required>
<label for="email">Email</label>
</div>
<div class="input-field">
<textarea id="message" class="materialize-textarea" required></textarea>
<label for="message">Message</label>
</div>
<button type="submit" class="btn waves-effect waves-light">Send</button>
</form>
</div>
<div class="col s12 m6">
<h5>Visit Us</h5>
<p>533 S Poplar Street<br>Oxford Ohio,</p>
<p><i class="material-icons">phone</i>(555) 847-7834</p>
<p><i class="material-icons">email</i> contact@elisespumpkinloafbakery.com</p>
</div>
</div>
</div>
</div>
<!-- Feedback Section -->
<div class="container">
<h3>Help us select our next best seller!</h3>
<form>
<label for="flavorSelect">Select your favorite pumpkin loaf flavor:</label>
<select id="flavorSelect">
<option>Nut Pumpkin</option>
<option>Classic Pumpkin</option>
<option>Cinnamon Snap</option>
<option>Vanilla Glazed</option>
</select>
<br><br>
<input type="button" onclick="submitFlavor()" value="Submit Flavor">
</form>
<p id="flavorMessage"></p>
<script>
function submitFlavor() {
let flavorSelect = document.getElementById("flavorSelect");
let selectedFlavor = flavorSelect.options[flavorSelect.selectedIndex].text;
let flavorMessage = document.querySelector("#flavorMessage");
flavorMessage.innerHTML = "Great choice! You selected the " + selectedFlavor + " flavor. We hope you enjoy it!";
}
</script>
</div>
<!-- Footer -->
<footer class="page-footer header-bg">
<div class="container">
<div class="row">
<div class="col s12 center-align">
<p class="white-text">© 2024 Elise's Pumpkin Loaf Bakery. All rights reserved.</p>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
</footer>
</body>
</html>