Update templates/menu.html

templates/menu.html

@@ -537,7 +537,7 @@
             display: flex;
             justify-content: space-between;
             align-items: center;
-            box-shadow: 0 -bai2px 10px rgba(0, 0, 0, 0.1);
+            box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
             z-index: 1000;
             max-width: 900px;
             margin: 0 auto;
@@ -818,7 +818,7 @@
                                         height="200" 
                                         onmouseover="this.play()" 
                                         onmouseout="this.pause(); this.currentTime = 0;" 
-                                        onerror="this.src='/static/placeholder.mp4'; this.onerror=null;">
+                                        onerror="this.poster='/static/placeholder.jpg';">
                                         <source src="{{ item.Video1__c | default('/static/placeholder.mp4') }}" type="video/mp4">
                                         Your browser does not support the video tag.
                                     </video>
@@ -887,10 +887,15 @@
                     <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                 </div>
                 <div class="modal-body">
+                    <!-- Item Image -->
                     <img id="modal-img" class="img-fluid rounded mb-3 d-block mx-auto" alt="Item Image" style="max-height: 200px; object-fit: cover;">
+                    <!-- Item Name -->
                     <h5 id="modal-name" class="fw-bold text-center"></h5>
+                    <!-- Item Price -->
                     <p id="modal-price" class="text-muted text-center"></p>
+                    <!-- Item Description -->
                     <p id="modal-description" class="text-secondary"></p>
+                    <!-- Add-ons -->
                     <div id="modal-addons" class="modal-addons mt-4">
                         <h6>Customization Options</h6>
                         <div id="addons-list" class="addons-container">Loading customization options...</div>
@@ -901,12 +906,15 @@
                     </div>
                     <span id="modal-section" data-section="" data-category="" style="display: none;"></span>
                 </div>
+                <!-- Quantity Controls and Add to Cart Button -->
                 <div class="modal-footer d-flex align-items-center justify-content-between">
+                    <!-- Quantity Controls -->
                     <div class="d-flex align-items-center gap-2">
                         <button type="button" class="btn btn-outline-secondary" id="decreaseQuantity">-</button>
                         <input type="text" class="form-control text-center" id="quantityInput" value="1" readonly style="width: 50px;"/>
                         <button type="button" class="btn btn-outline-secondary" id="increaseQuantity">+</button>
                     </div>
+                    <!-- Add to Cart Button -->
                     <button type="button" class="btn btn-primary" onclick="addToCartFromModal()">Add to Cart</button>
                 </div>
             </div>
@@ -943,9 +951,7 @@
 
         const menuItemDetails = {
             "Veg Manchurian": {
-                ingredients: "Cauliflower, Onion, Ginger, Garlic, Soy Sauce, Corn verdiğiгов
-
-            Cornflour, Green Chilies, Capsicum, Spring Onion",
+                ingredients: "Cauliflower, Onion, Ginger, Garlic, Soy Sauce, Cornflour, Green Chilies, Capsicum, Spring Onion",
                 nutritionalInfo: { calories: 250, protein: 5, carbs: 35, fats: 12, fiber: 3, sugar: 2 },
                 allergens: "Soy, Gluten"
             },
@@ -1033,16 +1039,6 @@
                 ingredients: "Chickpeas, Onion, Tomatoes, Ginger-Garlic Paste, Garam Masala, Coriander Powder, Cumin Seeds, Lemon Juice",
                 nutritionalInfo: { calories: 250, protein: 10, carbs: 45, fats: 5, fiber: 6, sugar: 2 },
                 allergens: "None"
-            },
-            "Sprite": {
-                ingredients: "Carbonated Water, Sugar, Citric Acid, Natural Flavors",
-                nutritionalInfo: { calories: 140, protein: 0, carbs: 38, fats: 0, fiber: 0, sugar: 38 },
-                allergens: "None"
-            },
-            "Thumbs Up": {
-                ingredients: "Carbonated Water, Sugar, Caffeine, Natural Flavors",
-                nutritionalInfo: { calories: 150, protein: 0, carbs: 40, fats: 0, fiber: 0, sugar: 40 },
-                allergens: "None"
             }
         };
 
@@ -1583,8 +1579,7 @@
                         sectionDiv.appendChild(title);
                         const optionsContainer = document.createElement('div');
                         addon.options.forEach((option, index) => {
-                            
-                        const optionId = `addon-${addon.name.replace(/\s+/g, '')}-${index}`;
+                            const optionId = `addon-${addon.name.replace(/\s+/g, '')}-${index}`;
                             const listItem = document.createElement('div');
                             listItem.classList.add('form-check');
                             listItem.innerHTML = `
@@ -1605,11 +1600,13 @@
                     document.getElementById('addons-list').innerHTML = '<p>Error loading customization options.</p>';
                 });
         }
+
         document.addEventListener('click', function(event) {
             if (event.target.classList.contains('addon-option')) {
                 handleAddonClick(event.target);
             }
         });
+
         function handleAddonClick(checkbox) {
             const groupName = checkbox.getAttribute('data-group');
             const isMultiSelectGroup = ["Extra Toppings", "Choose Raita/Sides", "Select Dip/Sauce", "Extra Add-ons", "Make it a Combo"].includes(groupName);
@@ -1622,6 +1619,7 @@
                 });
             }
         }
+
         function addToCartFromModal() {
             const itemName = document.getElementById('modal-name').innerText;
             let itemPrice = parseFloat(document.getElementById('modal-price').innerText.replace('$', ''));