adam/meal-order-manager
1
0
Fork 0
mirror of https://github.com/Sea-Haven-Industries/meal-order-manager.git synced 2026-09-30 05:23:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(form): use single-column layout for meals without images on mobile

Browse source
This commit is contained in:
Adam Moussa 2026-07-30 11:18:21 -04:00
parent 2a985c1940
commit 043eea1443
No known key found for this signature in database
1 changed files with 2 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/server/generate_form.py
View file

@ -296,6 +296,7 @@ header p {{ font-size: 0.85rem; opacity: 0.8; }}
.closed-banner {{ background: #fee2e2; color: #991b1b; padding: 16px; border-radius: 8px; margin-bottom: 20px; text-align: center; font-weight: 600; font-size: 1rem; }} .closed-banner {{ background: #fee2e2; color: #991b1b; padding: 16px; border-radius: 8px; margin-bottom: 20px; text-align: center; font-weight: 600; font-size: 1rem; }}
@media (max-width: 480px) {{ @media (max-width: 480px) {{
.meal-card {{ display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: start; }} .meal-card {{ display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: start; }}
.meal-card.no-image {{ grid-template-columns: minmax(0, 1fr); }}
.qty-control {{ grid-column: 1 / -1; justify-content: center; }} .qty-control {{ grid-column: 1 / -1; justify-content: center; }}
}} }}
@media (pointer: coarse) {{ @media (pointer: coarse) {{
@ -551,7 +552,7 @@ function renderMeals() {{
const qty = quantities[i] || 0; const qty = quantities[i] || 0;
const card = document.createElement('div'); const card = document.createElement('div');
card.className = 'meal-card' + (qty > 0 ? ' selected' : ''); card.className = 'meal-card' + (qty > 0 ? ' selected' : '') + (meal.image_url ? '' : ' no-image');
let tagsHtml = ''; let tagsHtml = '';
if (meal.is_new) tagsHtml += '<span class="new">NEW</span>'; if (meal.is_new) tagsHtml += '<span class="new">NEW</span>';