improve ux

This commit is contained in:
2026-08-07 21:42:38 -04:00
parent c2f6b07742
commit 240d993d57
2 changed files with 9 additions and 7 deletions
+7 -7
View File
@@ -499,13 +499,6 @@ pub fn meal_page(
html! {
div class="page-heading" {
a class="back-link" href="/meals" { "← All meals" }
div class="list-topbar-actions" {
button type="button" class="button button-small button-quiet" onclick="document.getElementById('meal-edit-modal').showModal()" { "Edit" }
form method="post" action=(format!("/meals/{}/delete", meal.id)) {
input type="hidden" name="csrf" value=(csrf_token);
button class="danger-link" type="submit" { "Delete" }
}
}
}
dialog id="meal-edit-modal" class="item-modal" {
div class="item-modal-card" {
@@ -545,6 +538,13 @@ pub fn meal_page(
p class="eyebrow" { "MEAL" }
h1 { (meal.name) @if let Some(category_name) = meal_category_name(meal, meal_categories) { span class="meal-category-label" { "(" (category_name) ")" } } }
}
div class="list-topbar-actions" {
button type="button" class="button button-small button-quiet" onclick="document.getElementById('meal-edit-modal').showModal()" { "Edit" }
form method="post" action=(format!("/meals/{}/delete", meal.id)) onsubmit="return confirm('Delete this meal and its ingredients? This cannot be undone.')" {
input type="hidden" name="csrf" value=(csrf_token);
button class="danger-link bordered-delete" type="submit" { "Delete" }
}
}
}
@if meal.description.is_empty() {
p class="muted" { "No description." }
+2
View File
@@ -220,6 +220,8 @@ textarea:focus { border-color: var(--deep-sage); box-shadow: 0 0 0 4px rgba(85,
.edit-form { margin-bottom: 12px; }
.edit-form input { min-height: 38px; padding: 7px 10px; font-size: .85rem; }
.danger-link { padding: 0; border: 0; color: var(--coral); background: none; cursor: pointer; font-size: .8rem; font-weight: 800; }
.bordered-delete { padding: 7px 14px; border: 1px solid var(--coral); border-radius: 10px; background: none; }
.bordered-delete:hover { background: #fbeae4; }
.button-danger { width: 100%; color: var(--coral); background: #fbeae4; }
.button-danger:hover { background: #f7ddd4; }
.empty-items { padding: 34px 10px 18px; color: var(--muted); text-align: center; }