Update templates/menu.html

templates/menu.html

@@ -182,17 +182,39 @@
     <div class="container mt-4">
         <h1 class="text-center">Menu</h1>
 
-        <!-- Filter Section -->
+        <!-- Category Filter -->
         <form method="get" action="/menu" class="text-center mb-4">
             <label for="category" class="form-label fw-bold">Filter by Category:</label>
             <select id="category" name="category" class="form-select" onchange="this.form.submit()">
                 {% for category in categories %}
-                <option value="{{ category }}" {% if selected_category == category %}selected{% endif %}>
-                    {{ category }}
-                </option>
+                    <option value="{{ category }}" {% if selected_category == category %}selected{% endif %}>
+                        {{ category }}
+                    </option>
                 {% endfor %}
+                <option value="Customized Dish" {% if selected_category == "Customized Dish" %}selected{% endif %}>
+                    Customized Dish
+                </option>
             </select>
         </form>
+
+        <!-- Display text boxes for Customized Dish -->
+        {% if selected_category == "Customized Dish" %}
+            <div id="custom-dish-form" class="mt-4">
+                <h3>Create Your Custom Dish</h3>
+                <form method="POST" action="/generate_custom_dish">
+                    <div class="mb-3">
+                        <label for="custom-dish-name" class="form-label">Dish Name</label>
+                        <input type="text" class="form-control" id="custom-dish-name" name="name" required>
+                    </div>
+                    <div class="mb-3">
+                        <label for="custom-dish-description" class="form-label">Dish Description</label>
+                        <textarea class="form-control" id="custom-dish-description" name="description" required></textarea>
+                    </div>
+                    <button type="submit" class="btn btn-primary">Submit</button>
+                </form>
+            </div>
+        {% endif %}
+
         <div class="fixed-search-container">
             <input type="text" id="searchBar" class="form-control" placeholder="Search items or sections..." onkeyup="filterMenu()">
         </div>