Spaces:
Runtime error
Runtime error
Update templates/menu.html
Browse files- templates/menu.html +58 -0
templates/menu.html
CHANGED
|
@@ -330,6 +330,64 @@ form.text-center.mb-4 {
|
|
| 330 |
height: 35px;
|
| 331 |
}
|
| 332 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 333 |
</style>
|
| 334 |
</head>
|
| 335 |
<body>
|
|
|
|
| 330 |
height: 35px;
|
| 331 |
}
|
| 332 |
}
|
| 333 |
+
/* Style for checkboxes */
|
| 334 |
+
.addon-section input[type="checkbox"] {
|
| 335 |
+
appearance: none;
|
| 336 |
+
-webkit-appearance: none;
|
| 337 |
+
-moz-appearance: none;
|
| 338 |
+
width: 18px; /* Adjust checkbox size */
|
| 339 |
+
height: 18px; /* Adjust checkbox size */
|
| 340 |
+
border: 2px solid #555; /* Darker border color */
|
| 341 |
+
border-radius: 4px; /* Optional: Rounded corners */
|
| 342 |
+
background-color: #333; /* Dark background color */
|
| 343 |
+
cursor: pointer;
|
| 344 |
+
position: relative;
|
| 345 |
+
transition: background-color 0.3s ease, border-color 0.3s ease;
|
| 346 |
+
}
|
| 347 |
+
|
| 348 |
+
/* Darken checkbox when checked */
|
| 349 |
+
.addon-section input[type="checkbox"]:checked {
|
| 350 |
+
background-color: #4CAF50; /* Green background when checked */
|
| 351 |
+
border-color: #4CAF50; /* Green border when checked */
|
| 352 |
+
}
|
| 353 |
+
|
| 354 |
+
/* Adding a checkmark when checked */
|
| 355 |
+
.addon-section input[type="checkbox"]:checked::after {
|
| 356 |
+
content: '✔'; /* Checkmark symbol */
|
| 357 |
+
position: absolute;
|
| 358 |
+
top: 2px;
|
| 359 |
+
left: 2px;
|
| 360 |
+
color: white;
|
| 361 |
+
font-size: 12px;
|
| 362 |
+
}
|
| 363 |
+
|
| 364 |
+
/* Hover effect for better UI */
|
| 365 |
+
.addon-section input[type="checkbox"]:hover {
|
| 366 |
+
background-color: #444; /* Slightly lighter on hover */
|
| 367 |
+
}
|
| 368 |
+
|
| 369 |
+
/* Customize checkbox container in addon sections */
|
| 370 |
+
.addon-section {
|
| 371 |
+
background-color: #f8f9fa; /* Light gray background */
|
| 372 |
+
border: 2px solid #ff6b35; /* Border color */
|
| 373 |
+
border-radius: 8px;
|
| 374 |
+
padding: 12px;
|
| 375 |
+
margin-bottom: 10px; /* Spacing between sections */
|
| 376 |
+
}
|
| 377 |
+
|
| 378 |
+
/* Title style */
|
| 379 |
+
.addon-section h6 {
|
| 380 |
+
margin-bottom: 10px;
|
| 381 |
+
font-size: 1.1rem;
|
| 382 |
+
font-weight: bold;
|
| 383 |
+
color: #444;
|
| 384 |
+
}
|
| 385 |
+
|
| 386 |
+
/* Add some margin to the checkbox container */
|
| 387 |
+
.addon-section .form-check {
|
| 388 |
+
margin-left: 10px;
|
| 389 |
+
}
|
| 390 |
+
|
| 391 |
</style>
|
| 392 |
</head>
|
| 393 |
<body>
|