51 lines
1.6 KiB
HTML
51 lines
1.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Title</title>
|
|
</head>
|
|
<body>
|
|
<section>
|
|
<h2>Calculate your Caffeine Level</h2>
|
|
|
|
<div class="menu">
|
|
<h3>Coffee</h3>
|
|
<p id="newCoffee"><a href="#">Add Coffee</a></p>
|
|
<ul class="drink">
|
|
<li><a href="#" data-level="1">American</a><span class="tooltip">Level 1 Caffeine</span></li>
|
|
<li><a href="#" data-level="2">Colombian</a><span class="tooltip">Level 2 Caffeine</span></li>
|
|
<li><a href="#" data-level="3">Brazilian</a><span class="tooltip">Level 3 Caffeine</span></li>
|
|
<li><a href="#" data-level="10">Espresso</a><span class="tooltip">Level CRAZY Caffeine</span></li>
|
|
</ul>
|
|
<label for="total">Total:</label>
|
|
<input type="text" id="total" size="3" value="0"/>
|
|
<input type="button" id="clear" size="3" value="Clear"/>
|
|
<div id="warning"></div>
|
|
<div id="notice"></div>
|
|
<div id="advertisement">
|
|
<p>
|
|
How about you try our new <a href="#">EnvyLabs Coffee!</a> ?
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section>
|
|
<h3>Store Locations</h3>
|
|
<ul class="locations">
|
|
</ul>
|
|
</section>
|
|
<section>
|
|
<article>
|
|
<h3>Top Pick of the Week</h3>
|
|
<p id="topPick"></p>
|
|
</article>
|
|
<article>
|
|
<h3>Other Suggested Coffee</h3>
|
|
<ul class="suggested"></ul>
|
|
</article>
|
|
|
|
</section>
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
|
<script src="lib/6-2-ex-drink.js"></script>
|
|
</body>
|
|
</html>
|