Update templates/menu.html

templates/menu.html

@@ -462,40 +462,26 @@ form-check-input addon-option{
     </div>
 </div>
 
-<!-- Category Filter with Custom Radio Buttons -->
 <form method="get" action="/menu" class="text-center mb-4">
     <label class="form-label fw-bold">Select a Category:</label>
-
-    <!-- Wrapper for the toggle buttons -->
-    <div class="toggle-container">
-        <!-- Veg Toggle Button (Checkbox styled as toggle) -->
-        <div class="form-check form-check-inline">
-            <input type="checkbox" id="category-Veg" name="category" value="Veg"
+    <div class="form-check form-check-inline">
+        {% for category in categories %}
+            <input type="radio" id="category-{{ category }}" name="category" value="{{ category }}"
                 class="custom-toggle"
-                {% if selected_category == "Veg" %}checked{% endif %} onchange="this.form.submit()">
-            <label class="form-check-label" for="category-Veg">Veg</label>
-        </div>
+                {% if selected_category == category %}checked{% endif %} onchange="this.form.submit()">
+            <label class="form-check-label" for="category-{{ category }}">{{ category }}</label>
+        {% endfor %}
+    </div>
 
-        <!-- Customized Dish Toggle Button (Checkbox styled as toggle) -->
-        <div class="form-check form-check-inline">
-            <input type="checkbox" id="category-CustomizedDish" name="category" value="Customized Dish"
-                class="custom-toggle"
-                {% if selected_category == "Customized Dish" %}checked{% endif %} onchange="this.form.submit()">
-            <label class="form-check-label" for="category-CustomizedDish">Customized Dish</label>
-        </div>
+    <!-- Customized Dish toggle (styled like a switch) -->
+    <div class="form-check form-check-inline">
+        <input type="radio" id="category-CustomizedDish" name="category" value="Customized Dish"
+            class="custom-toggle"
+            {% if selected_category == "Customized Dish" %}checked{% endif %} onchange="this.form.submit()">
+        <label class="form-check-label" for="category-CustomizedDish">Customized Dish</label>
     </div>
-    
-    <!-- Non-Veg logic handled in backend but not displayed in UI -->
-    <input type="hidden" name="category" value="{% if selected_category == 'Non-Veg' %}Non-Veg{% endif %}">
 </form>
 
-
-
-
-
-
-
-  
   <!-- Show menu items only when Customized Dish is not selected -->
     <div class="container mt-4">
         <h1 class="text-center">Menu</h1>