Layout and some content
dugo3number2
parent
751bc712fd
commit
796d77ac62
|
|
@ -7,17 +7,17 @@
|
|||
# Home page
|
||||
# I. Site-wide header
|
||||
# II. Large banner
|
||||
## A. Slowly spinning coffee mug background
|
||||
## A. Video background
|
||||
## B. Text saying "The best coffee made by the best students spinning in the center
|
||||
## C. Order and menu buttons (to go to respective pages)
|
||||
# III.Info
|
||||
## A. Hours
|
||||
## B. Dates
|
||||
## C. Location
|
||||
# IV. Highlighted coffees
|
||||
## A. Hot Chocolate Latte
|
||||
## B. Iced Coffee
|
||||
## C. Sugar-free Hot Chocolate
|
||||
# IV. Special options
|
||||
## A. Mocha
|
||||
## B. Sugar-free
|
||||
## C. Almond milk
|
||||
# V. Images
|
||||
# VI. Site-wide footer
|
||||
|
||||
|
|
@ -32,15 +32,16 @@
|
|||
# I. Site-wide header
|
||||
# II. Order button
|
||||
# III.Drink options
|
||||
# IV. Add-ons
|
||||
# IV. Milk options
|
||||
# V. Add-ons
|
||||
## A. Syrups
|
||||
## B. Drizzles
|
||||
## C. Whipped Cream
|
||||
# V. Desserts
|
||||
# VI. Order button
|
||||
# VII. Site-wide footer
|
||||
# V. Order button
|
||||
# VI. Site-wide footer
|
||||
|
||||
# Order page
|
||||
NOTE: Use code to switch between each section to create better flow
|
||||
# I. Site-wide header
|
||||
# II. Information
|
||||
## A. Name
|
||||
|
|
|
|||
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>About - Beacon Blend</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>Beacon Blend</h1>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="..">Home</a></li>
|
||||
<li><a href="#" id="current">About</a></li>
|
||||
<li><a href="menu">Menu</a></li>
|
||||
<li><a href="order">Order</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<main>
|
||||
<h2>About</h2>
|
||||
<section>
|
||||
<h2>About LCS Beacon Blend</h2>
|
||||
<p>About paragraph here</p>
|
||||
</section>
|
||||
<section>
|
||||
<h2>About Lighthouse Christian School</h2>
|
||||
<p>About LCS paragraph here</p>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Images here</h2>
|
||||
</section>
|
||||
</main>
|
||||
<footer>
|
||||
<span>Beacon Blend</span>
|
||||
<ul>
|
||||
<li><a href="..">Home</a></li>
|
||||
<li><a href="#">About</a></li>
|
||||
<li><a href="menu">Menu</a></li>
|
||||
<li><a href="order">Order</a></li>
|
||||
</ul><br />
|
||||
<span>©2024 Lighthouse Christian School</span><br />
|
||||
<span>Created for LCS and Student Conventions by David Jentes</span>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -18,21 +18,34 @@
|
|||
</nav>
|
||||
</header>
|
||||
<div class="cover">
|
||||
|
||||
<span>The best coffee made by the best students</span>
|
||||
</div>
|
||||
<main>
|
||||
<section>
|
||||
<!-- Information -->
|
||||
<h2>Information here</h2>
|
||||
</section>
|
||||
<section>
|
||||
<!-- Highlighted coffees -->
|
||||
<h2>Mocha</h2>
|
||||
<h2>Sugar-free</h2>
|
||||
<h2>Almond Milk</h2>
|
||||
</section>
|
||||
<section>
|
||||
<!-- Images -->
|
||||
<h2>Images here</h2>
|
||||
</section>
|
||||
</main>
|
||||
<footer>
|
||||
|
||||
<span>Beacon Blend</span>
|
||||
<ul>
|
||||
<li><a href="#">Home</a></li>
|
||||
<li><a href="about">About</a></li>
|
||||
<li><a href="menu">Menu</a></li>
|
||||
<li><a href="order">Order</a></li>
|
||||
</ul><br />
|
||||
<span>©2024 Lighthouse Christian School</span><br />
|
||||
<span>Created for LCS and Student Conventions by David Jentes</span>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,84 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Menu - Beacon Blend</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>Beacon Blend</h1>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="..">Home</a></li>
|
||||
<li><a href="about">About</a></li>
|
||||
<li><a href="#" id="current">Menu</a></li>
|
||||
<li><a href="order">Order</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<main>
|
||||
<h2>Menu</h2>
|
||||
<section>
|
||||
<a href="order">Order online</a>
|
||||
</section>
|
||||
<section>
|
||||
<h2>16oz Hot Drinks - $2.50 each</h2>
|
||||
<ul>
|
||||
<li>Espresso (single or double)</li>
|
||||
<li>Latte</li>
|
||||
<li>Mocha</li>
|
||||
<li>Americano</li>
|
||||
<li>Cappucino</li>
|
||||
<li>Hot Chocolate (available sugar-free)</li>
|
||||
</ul>
|
||||
<h2>16oz Cold Drinks - $2.50 each</h2>
|
||||
<ul>
|
||||
<li>Iced Coffee (Espresso and Milk)</li>
|
||||
<li>Espresso (single or double)</li>
|
||||
<li>Latte</li>
|
||||
<li>Mocha</li>
|
||||
</ul>
|
||||
<h2>All drinks are available with whole or almond milk.</h2>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Syrups (with sugar)<h2>
|
||||
<ul>
|
||||
<li>Salted Caramel</li>
|
||||
<li>French Vanilla</li>
|
||||
<li>Classic Hazelnut</li>
|
||||
<li>Butter Pecan</li>
|
||||
<li>Pumpkin</li>
|
||||
<li>Peppermint</li>
|
||||
</ul>
|
||||
<h2>Syrups (sugar-free)</h2>
|
||||
<ul>
|
||||
<li>Vanilla</li>
|
||||
<li>Toasted Marshmallow</li>
|
||||
</ul>
|
||||
<h2>Swirls</h2>
|
||||
<ul>
|
||||
<li>Mocha</li>
|
||||
<li>White Mocha</li>
|
||||
<li>Caramel</li>
|
||||
</ul>
|
||||
<h2>Whipped cream is available as an option for each drink.</h2>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Sound good?</h2>
|
||||
<a href="order">Order online now!</a>
|
||||
</section>
|
||||
</main>
|
||||
<footer>
|
||||
<span>Beacon Blend</span>
|
||||
<ul>
|
||||
<li><a href="..">Home</a></li>
|
||||
<li><a href="about">About</a></li>
|
||||
<li><a href="#">Menu</a></li>
|
||||
<li><a href="order">Order</a></li>
|
||||
</ul><br />
|
||||
<span>©2024 Lighthouse Christian School</span><br />
|
||||
<span>Created for LCS and Student Conventions by David Jentes</span>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,118 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Order - Beacon Blend</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>Beacon Blend</h1>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="..">Home</a></li>
|
||||
<li><a href="about">About</a></li>
|
||||
<li><a href="menu">Menu</a></li>
|
||||
<li><a href="#" id="current">Order</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<main>
|
||||
<h2>Order Online</h2>
|
||||
<section>
|
||||
<h2>Just want to browse the menu?</h2>
|
||||
<a href="menu">Menu</a>
|
||||
</section>
|
||||
<form>
|
||||
<section>
|
||||
<h2>Your contact information</h2>
|
||||
<label for="name">Your name</label>
|
||||
<input type="text" name="name" id="name" />
|
||||
<select id="phoneext" name="phoneext">
|
||||
<option value="ext">Contact A.C.E. phone extension</option>
|
||||
<option value="phone">Contact phone number</option>
|
||||
<option value="school">I am a student</option>
|
||||
</select>
|
||||
<div id="extDiv">
|
||||
<input type="number" size="4" name="ext" id="ext" />
|
||||
</div>
|
||||
<div id="phoneDiv">
|
||||
<input type="tel" name="phone" id="phone" />
|
||||
</div>
|
||||
<a href="#">Next</a>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Your drink</h2>
|
||||
<h2>$2.50</h2>
|
||||
<select id="hoticed" name="hoticed">
|
||||
<option value="hot">Hot drinks</option>
|
||||
<option value="iced">Iced drinks</option>
|
||||
</select>
|
||||
<div id="hotDiv">
|
||||
<select id="hot" name="hot">
|
||||
<option value="espresso">Espresso</option>
|
||||
<option value="dblespresso">Double Espresso</option>
|
||||
<option value="latte">Latte</option>
|
||||
<option value="mocha">Mocha</option>
|
||||
<option value="americano">Americano</option>
|
||||
<option value="cappuccino">Cappuccino</option>
|
||||
<option value="hotchoc">Hot Chocolate</option>
|
||||
<option value="sfhotchoc">Sugar-free Hot Chocolate</option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="icedDiv">
|
||||
<select id="hot" name="hot">
|
||||
<option value="icedcoffee">Iced Coffee (espresso and milk)</option>
|
||||
<option value="icedespresso">Iced Espresso</option>
|
||||
<option value="iceddblespresso">Iced Double Espresso</option>
|
||||
<option value="icedlatte">Iced Latte</option>
|
||||
<option value="icedmocha">Iced Mocha</option>
|
||||
</select>
|
||||
</div>
|
||||
<a href="#">Next</a>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Your milk choice</h2>
|
||||
<select id="milk" name="milk">
|
||||
<option value="whole">Whole milk</option>
|
||||
<option value="almond">Almond milk</option>
|
||||
</select>
|
||||
<h2>Your add-ons</h2>
|
||||
<label><input type="checkbox" name="caramel" id="caramel" value="true" /> Salted Caramel</label><span id="caramelpumps" class="hidden"> - <input type="number" min="0.5" max="5" step="0.5" value="2" inputmode="decimal" required name="caramelpumps" /> pumps</span><br />
|
||||
<label><input type="checkbox" name="pecan" id="pecan" value="true" /> Butter Pecan</label><span id="pecanpumps" class="hidden"> - <input type="number" min="0.5" max="5" step="0.5" value="2" inputmode="decimal" required name="pecanpumps" /> pumps</span><br />
|
||||
<label><input type="checkbox" name="pumpkin" id="pumpkin" value="true" /> Pumpkin</label><span id="pumpkinpumps" class="hidden"> - <input type="number" min="0.5" max="5" step="0.5" value="2" inputmode="decimal" required name="pumpkinpumps" /> pumps</span><br />
|
||||
<label><input type="checkbox" name="sfvanilla" id="sfvanilla" value="true" /> Sugar-free Vanilla</label><span id="sfvanillapumps" class="hidden"> - <input type="number" min="0.5" max="5" step="0.5" value="2" inputmode="decimal" required name="sfvanillapumps" /> pumps</span><br />
|
||||
<label><input type="checkbox" name="hazelnut" id="hazelnut" value="true" /> Hazelnut</label><span id="hazelnutpumps" class="hidden"> - <input type="number" min="0.5" max="5" step="0.5" value="2" inputmode="decimal" required name="hazelnutpumps" /> pumps</span><br />
|
||||
<label><input type="checkbox" name="peppermint" id="peppermint" value="true" /> Peppermint</label><span id="peppermintpumps" class="hidden"> - <input type="number" min="0.5" max="5" step="0.5" value="2" inputmode="decimal" required name="peppermintpumps" /> pumps</span><br />
|
||||
<label><input type="checkbox" name="vanilla" id="vanilla" value="true" /> French Vanilla</label><span id="vanillapumps" class="hidden"> - <input type="number" min="0.5" max="5" step="0.5" value="2" inputmode="decimal" required name="vanillapumps" /> pumps</span><br />
|
||||
<label><input type="checkbox" name="sfmarshmallow" id="sfmarshmallow" value="true" /> Sugar-free Toasted Marshmallow</label><span id="sfmarshmallowpumps" class="hidden"> - <input type="number" min="0.5" max="5" step="0.5" value="2" inputmode="decimal" required name="sfmarshmallowpumps" /> pumps</span><br />
|
||||
<label><input type="checkbox" name="mocha" value="true"> Mocha Swirl</label><br />
|
||||
<label><input type="checkbox" name="whitemocha" value="true"> White Mocha Swirl</label><br />
|
||||
<label><input type="checkbox" name="caramels" value="true"> Caramel Swirl</label><br />
|
||||
<label><input type="checkbox" name="whippedcream" value="true"> Whipped Cream</label><br />
|
||||
<a href="#">Next</a>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Your payment</h2>
|
||||
<select name="payment" id="payment">
|
||||
<option value="cash">Cash - $2.50 for one</option>
|
||||
<option value="punchcard">Punchcard - $10 for five</option>
|
||||
</select>
|
||||
<h2>Special notes</h2>
|
||||
<input type="text" id="notes" name="notes" />
|
||||
<input type="submit" value="Place order" />
|
||||
</section>
|
||||
</form>
|
||||
</main>
|
||||
<span>Beacon Blend</span>
|
||||
<ul>
|
||||
<li><a href="..">Home</a></li>
|
||||
<li><a href="about">About</a></li>
|
||||
<li><a href="menu">Menu</a></li>
|
||||
<li><a href="#">Order</a></li>
|
||||
</ul><br />
|
||||
<span>©2024 Lighthouse Christian School</span><br />
|
||||
<span>Created for LCS and Student Conventions by David Jentes</span>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue