Spaces:
Sleeping
Sleeping
File size: 1,269 Bytes
f0ee940 | 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 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dynamic Food Menu</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="menu-items">
<div class="food-item">
<img src="images/veg-samosa.jpg" alt="Veg Samosa" class="food-image" data-item="Veg Samosa">
<p>Veg Samosa - $9</p>
<button class="add-button" data-item="Veg Samosa">Add</button>
</div>
<div class="food-item">
<img src="images/onion-pakoda.jpg" alt="Onion Pakoda" class="food-image" data-item="Onion Pakoda">
<p>Onion Pakoda - $10</p>
<button class="add-button" data-item="Onion Pakoda">Add</button>
</div>
<!-- Add more items here -->
</div>
<!-- Modal -->
<div id="suggestion-modal" class="modal">
<div class="modal-content">
<span class="close-button">×</span>
<h3 id="selected-item"></h3>
<p>Suggested Combinations:</p>
<ul id="suggestion-list"></ul>
<label for="quantity">Quantity:</label>
<input type="number" id="quantity" value="1" min="1">
<button id="add-to-cart-button">Add to Cart</button>
</div>
</div>
<script src="script.js"></script>
</body>
</html>
|