68 lines
No EOL
1.9 KiB
HTML
68 lines
No EOL
1.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<! This style sheet is taken from https://www.w3schools.com/howto/howto_js_tabs.asp>
|
|
<link href="styles/style.css" rel="stylesheet" type="text/css">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div>
|
|
<h1> Sam's Mart </h1>
|
|
<a href="https://samsmartinc.com/">
|
|
<img src="images/logo.png" alt="Facebook" class = "logo">
|
|
</a>
|
|
|
|
</div>
|
|
|
|
<!-- Tab links, each one with an onclick event associated with it -->
|
|
<div class="tab">
|
|
<button class="tablinks" onclick="openInfo(event, 'Client')">Client</button>
|
|
<button class="tablinks" onclick="openInfo(event, 'Products')">Products</button>
|
|
<button class="tablinks" onclick="openInfo(event, 'Cart')">Cart</button>
|
|
</div>
|
|
|
|
<!-- Tab content -->
|
|
<div id="Client" class="tabcontent">
|
|
<h3>Client Information</h3>
|
|
<p>Tell us a bit about you.</p>
|
|
Choose a Category:
|
|
<select id="dietSelect" name="dietSelect" onchange="populateListProductChoices(this.id, 'displayProduct')">
|
|
<option value=""></option>
|
|
|
|
<option value="Vegetarian">Vegetarian</option>
|
|
<option value="GlutenFree">Gluten Free</option>
|
|
<option value="VegetarianANDGluten-Free">Vegetarian and Gluten-Free</option>
|
|
<option value="Organic">Organic</option>
|
|
<option value="Non-organic">Non-Organic</option>
|
|
<option value="None">None</option>
|
|
|
|
</select>
|
|
</div>
|
|
|
|
<div id="Products" class="tabcontent">
|
|
<h3>Your targeted products</h3>
|
|
<p>We preselected products based on your restrictions.</p>
|
|
Choose items to buy:
|
|
<div id="displayProduct"></div>
|
|
<button id="addCart" type="button" class="block" onclick="selectedItems()">
|
|
Add selected items to cart.
|
|
</button>
|
|
</div>
|
|
|
|
<div id="Cart" class="tabcontent">
|
|
<h3>Cart</h3>
|
|
<p>Here is your cart.</p>
|
|
<div id="displayCart"></div>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
<p class="copyright">Website created by Ruchira, Sam, Batuhan, and Kene</p>
|
|
</div>
|
|
|
|
<script src="scripts/groceries.js"></script>
|
|
|
|
<script src="scripts/main.js"></script>
|
|
|
|
</body>
|
|
</html> |