Spaces:
Sleeping
Sleeping
| <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> | |