Update templates/menu.html
Browse files- templates/menu.html +48 -26
templates/menu.html
CHANGED
|
@@ -145,14 +145,31 @@ form.text-center.mb-4 {
|
|
| 145 |
top: 0;
|
| 146 |
left: 0;
|
| 147 |
width: 100%;
|
|
|
|
| 148 |
z-index: 1000; /* Ensures it stays on top of other elements */
|
| 149 |
-
background-color: #
|
| 150 |
color: white;
|
| 151 |
padding: 15px;
|
| 152 |
display: flex;
|
| 153 |
justify-content: space-between;
|
| 154 |
align-items: center;
|
| 155 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 156 |
/* Style for customization sections */
|
| 157 |
.addon-section {
|
| 158 |
background-color: #f8f9fa; /* Light gray background */
|
|
@@ -239,34 +256,39 @@ form.text-center.mb-4 {
|
|
| 239 |
<body>
|
| 240 |
|
| 241 |
<div class="fixed-top-bar">
|
| 242 |
-
|
| 243 |
-
|
| 244 |
-
|
| 245 |
-
|
| 246 |
-
|
| 247 |
-
|
| 248 |
-
|
| 249 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 250 |
</div>
|
| 251 |
-
|
| 252 |
-
|
| 253 |
-
<
|
|
|
|
|
|
|
| 254 |
</div>
|
|
|
|
| 255 |
|
| 256 |
-
|
| 257 |
-
|
| 258 |
-
|
| 259 |
-
<!-- Use the first letter of the user's name for the avatar -->
|
| 260 |
-
<span>{{ first_letter }}</span> <!-- Display the first letter of the customer's name -->
|
| 261 |
-
</div>
|
| 262 |
-
<div class="dropdown-menu">
|
| 263 |
-
<!-- Direct links without grouping into columns -->
|
| 264 |
-
<a href="{{ url_for('customer_details') }}" class="dropdown-item">View Profile</a>
|
| 265 |
-
<a href="{{ url_for('order_history') }}" class="dropdown-item">Order History</a>
|
| 266 |
-
<a href="{{ url_for('logout') }}" class="dropdown-item">Logout</a>
|
| 267 |
-
</div>
|
| 268 |
-
</div>
|
| 269 |
</div>
|
|
|
|
| 270 |
|
| 271 |
<div class="container mt-4">
|
| 272 |
<h1 class="text-center">Menu</h1>
|
|
@@ -274,7 +296,7 @@ form.text-center.mb-4 {
|
|
| 274 |
|
| 275 |
<!-- Category Filter with Custom Radio Buttons -->
|
| 276 |
<form method="get" action="/menu" class="text-center mb-4">
|
| 277 |
-
<label class="form-label fw-bold">
|
| 278 |
<div class="form-check form-check-inline">
|
| 279 |
{% for category in categories %}
|
| 280 |
<input type="radio" id="category-{{ category }}" name="category" value="{{ category }}" class="custom-radio"
|
|
|
|
| 145 |
top: 0;
|
| 146 |
left: 0;
|
| 147 |
width: 100%;
|
| 148 |
+
height: 44px;
|
| 149 |
z-index: 1000; /* Ensures it stays on top of other elements */
|
| 150 |
+
background-color: #FF6B35; /* Updated header background */
|
| 151 |
color: white;
|
| 152 |
padding: 15px;
|
| 153 |
display: flex;
|
| 154 |
justify-content: space-between;
|
| 155 |
align-items: center;
|
| 156 |
}
|
| 157 |
+
|
| 158 |
+
.search-bar-container {
|
| 159 |
+
margin-left: 20px;
|
| 160 |
+
margin-right: 20px;
|
| 161 |
+
flex: 1;
|
| 162 |
+
max-width: 400px;
|
| 163 |
+
}
|
| 164 |
+
|
| 165 |
+
.search-bar-container input {
|
| 166 |
+
width: 100%;
|
| 167 |
+
padding: 5px;
|
| 168 |
+
font-size: 16px;
|
| 169 |
+
border-radius: 20px;
|
| 170 |
+
border: none;
|
| 171 |
+
}
|
| 172 |
+
|
| 173 |
/* Style for customization sections */
|
| 174 |
.addon-section {
|
| 175 |
background-color: #f8f9fa; /* Light gray background */
|
|
|
|
| 256 |
<body>
|
| 257 |
|
| 258 |
<div class="fixed-top-bar">
|
| 259 |
+
<!-- Removed Reward Points and Referral Code -->
|
| 260 |
+
<div class="d-flex align-items-center">
|
| 261 |
+
<a href="{{ url_for('order_history') }}" class="text-white mx-2" title="Order History">
|
| 262 |
+
<i class="bi bi-clock-history fs-4"></i>
|
| 263 |
+
</a>
|
| 264 |
+
<a href="{{ url_for('logout') }}" class="text-white mx-2" title="Logout">
|
| 265 |
+
<i class="bi bi-box-arrow-right fs-4"></i>
|
| 266 |
+
</a>
|
| 267 |
+
</div>
|
| 268 |
+
<!-- Add Welcome Message with Customer Name -->
|
| 269 |
+
<div class="d-flex align-items-center">
|
| 270 |
+
<span class="text-white mr-3">Welcome, {{ user_name }}</span> <!-- Display the customer's name -->
|
| 271 |
+
</div>
|
| 272 |
+
|
| 273 |
+
<!-- Avatar and Dropdown -->
|
| 274 |
+
<div class="avatar-dropdown-container">
|
| 275 |
+
<div class="avatar-icon">
|
| 276 |
+
<!-- Use the first letter of the user's name for the avatar -->
|
| 277 |
+
<span>{{ first_letter }}</span> <!-- Display the first letter of the customer's name -->
|
| 278 |
</div>
|
| 279 |
+
<div class="dropdown-menu">
|
| 280 |
+
<!-- Direct links without grouping into columns -->
|
| 281 |
+
<a href="{{ url_for('customer_details') }}" class="dropdown-item">View Profile</a>
|
| 282 |
+
<a href="{{ url_for('order_history') }}" class="dropdown-item">Order History</a>
|
| 283 |
+
<a href="{{ url_for('logout') }}" class="dropdown-item">Logout</a>
|
| 284 |
</div>
|
| 285 |
+
</div>
|
| 286 |
|
| 287 |
+
<!-- Search Bar Moved to Header Section -->
|
| 288 |
+
<div class="search-bar-container">
|
| 289 |
+
<input type="text" id="searchBar" class="form-control" placeholder="Search items or sections..." onkeyup="filterMenu()">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 290 |
</div>
|
| 291 |
+
</div>
|
| 292 |
|
| 293 |
<div class="container mt-4">
|
| 294 |
<h1 class="text-center">Menu</h1>
|
|
|
|
| 296 |
|
| 297 |
<!-- Category Filter with Custom Radio Buttons -->
|
| 298 |
<form method="get" action="/menu" class="text-center mb-4">
|
| 299 |
+
<label class="form-label fw-bold">Select a Category:</label>
|
| 300 |
<div class="form-check form-check-inline">
|
| 301 |
{% for category in categories %}
|
| 302 |
<input type="radio" id="category-{{ category }}" name="category" value="{{ category }}" class="custom-radio"
|