Update templates/menu.html

templates/menu.html

@@ -488,7 +488,8 @@ input:checked + .slider:before {
 
 <!-- Menu Section -->
 <div class="container mt-4" id="menuContainer">
-    <h1 class="text-center">Menu</h1>
+    <h1 class="text-center" id="menuTitle">Menu</h1>
+    
     <!-- Veg items will be shown here when toggled -->
     <div id="vegItemsContainer" class="veg-items">
         <!-- Veg items will be dynamically populated -->
@@ -847,7 +848,7 @@ document.addEventListener('DOMContentLoaded', function () {
         quantityInput.value = currentQuantity;
     });
 });
-
+  
 // Fetch menu items from Salesforce
 function fetchMenuItems() {
     fetch('/services/apexrest/menuItems/') // Assuming your Salesforce API endpoint
@@ -874,15 +875,18 @@ function toggleVegItems() {
     // Get the containers for all items and veg items
     const allItemsContainer = document.getElementById('allItemsContainer');
     const vegItemsContainer = document.getElementById('vegItemsContainer');
+    const menuTitle = document.getElementById('menuTitle');
     
     if (isVegOnly) {
         // Show only Veg items
         vegItemsContainer.style.display = 'block';
         allItemsContainer.style.display = 'none';
+        menuTitle.style.display = 'none';  // Hide the "Menu" title
     } else {
         // Show all items
         vegItemsContainer.style.display = 'none';
         allItemsContainer.style.display = 'block';
+        menuTitle.style.display = 'block';  // Show the "Menu" title
     }
 }
 
@@ -938,6 +942,7 @@ document.addEventListener('DOMContentLoaded', function () {
     fetchMenuItems(); // Fetch and display menu items when the page loads
     toggleVegItems(); // Display based on initial state
 });
+;
 
     </script>