1
0
Fork 0

Layout and some content

main
dugo3number2 2024-01-22 16:12:46 -06:00
parent 751bc712fd
commit 796d77ac62
5 changed files with 273 additions and 11 deletions

View File

@ -7,17 +7,17 @@
# Home page # Home page
# I. Site-wide header # I. Site-wide header
# II. Large banner # 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 ## 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) ## C. Order and menu buttons (to go to respective pages)
# III.Info # III.Info
## A. Hours ## A. Hours
## B. Dates ## B. Dates
## C. Location ## C. Location
# IV. Highlighted coffees # IV. Special options
## A. Hot Chocolate Latte ## A. Mocha
## B. Iced Coffee ## B. Sugar-free
## C. Sugar-free Hot Chocolate ## C. Almond milk
# V. Images # V. Images
# VI. Site-wide footer # VI. Site-wide footer
@ -32,15 +32,16 @@
# I. Site-wide header # I. Site-wide header
# II. Order button # II. Order button
# III.Drink options # III.Drink options
# IV. Add-ons # IV. Milk options
# V. Add-ons
## A. Syrups ## A. Syrups
## B. Drizzles ## B. Drizzles
## C. Whipped Cream ## C. Whipped Cream
# V. Desserts # V. Order button
# VI. Order button # VI. Site-wide footer
# VII. Site-wide footer
# Order page # Order page
NOTE: Use code to switch between each section to create better flow
# I. Site-wide header # I. Site-wide header
# II. Information # II. Information
## A. Name ## A. Name

View File

@ -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>&copy;2024 Lighthouse Christian School</span><br />
<span>Created for LCS and Student Conventions by David Jentes</span>
</footer>
</body>
</html>

View File

@ -18,21 +18,34 @@
</nav> </nav>
</header> </header>
<div class="cover"> <div class="cover">
<span>The best coffee made by the best students</span>
</div> </div>
<main> <main>
<section> <section>
<!-- Information --> <!-- Information -->
<h2>Information here</h2>
</section> </section>
<section> <section>
<!-- Highlighted coffees --> <!-- Highlighted coffees -->
<h2>Mocha</h2>
<h2>Sugar-free</h2>
<h2>Almond Milk</h2>
</section> </section>
<section> <section>
<!-- Images --> <!-- Images -->
<h2>Images here</h2>
</section> </section>
</main> </main>
<footer> <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>&copy;2024 Lighthouse Christian School</span><br />
<span>Created for LCS and Student Conventions by David Jentes</span>
</footer> </footer>
</body> </body>
</html> </html>

84
src/menu/index.html Normal file
View File

@ -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>&copy;2024 Lighthouse Christian School</span><br />
<span>Created for LCS and Student Conventions by David Jentes</span>
</footer>
</body>
</html>

118
src/order/index.html Normal file
View File

@ -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>&copy;2024 Lighthouse Christian School</span><br />
<span>Created for LCS and Student Conventions by David Jentes</span>
</footer>
</body>
</html>