Dedupe menu admin CSS/markup, restore Mark Sold Out/Available labels

CSS redundancy cleanup on the online menu management feature:

- .menu-category was a byte-for-byte duplicate of the existing .panel
  class (background/border/border-radius/padding); folds it into
  .panel's shared selector group instead, keeping only what's not
  shared (no margin-bottom, since these sit in a grid whose own gap
  already spaces them)
- Several inline style="..." attributes were hand-copied verbatim
  between admin/menu.php's PHP template and admin/menu.js's client-
  side row/panel templates (price/sort/description cell formatting,
  category heading spacing, the empty-state row). Replaced with real
  CSS classes (.item-price-cell, .item-sort-cell, .item-desc-cell,
  .cat-name-heading, .cat-desc-text, .no-items-row td) so the styling
  lives in one place instead of two
- class="font-mono" was referenced four times but never defined
  anywhere in CSS (silently doing nothing); it's now a real one-line
  utility, which also fixes two previously-dead uses of it already
  sitting in admin/index.php
- .form-actions already existed as a class with its own margin-top,
  but every usage (two new modals here, plus a pre-existing one in
  admin/index.php) redundantly re-specified layout via inline style
  with a slightly different margin-top value each time; extended the
  shared class to own the whole pattern and dropped all three inline
  overrides
- Removed a no-op `justify-content: flex-start` (the default value)
  from the new .admin-toolbar

Caught and fixed a regression from the above before it shipped:
removing the inline margin-bottom override on the category heading
exposed that .panel h2's margin-bottom (from the existing panel
styles) has higher specificity than a bare .cat-name-heading class,
so the heading would have rendered with 5x the intended spacing.
Rescoped as .category-panel .cat-name-heading to reliably win.

Also restores the "Mark Sold Out" / "Mark Available" button wording
(both directions of the toggle, in both the PHP-rendered rows and
the two JS render paths) after it had been shortened to just "Sold
Out" / "Available".

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
David DyerandClaude Sonnet 5 committed 2026-08-30 22:03:22 -04:00
1 parent f1bbf59548
commit 50eeb41375
4 files changed
+182 -128

No files matched your search

+48 -4
View File
@@ -543,7 +543,8 @@
.stat-card,
.card,
.login-card,
.panel {
.panel,
.menu-category {
background: var(--surface);
border: 1px solid var(--rule);
}
@@ -1114,6 +1115,9 @@
}
.form-actions {
display: flex;
gap: 0.75rem;
align-items: center;
margin-top: 1.75rem;
}
@@ -1276,9 +1280,9 @@
text-align: left;
}
/* background/border come from the shared .panel rule above; no
margin-bottom here since these sit in a grid whose own gap spaces them */
.menu-category {
background: var(--surface);
border: 1px solid var(--rule);
border-radius: 0.25rem;
padding: 2rem;
}
@@ -1357,6 +1361,47 @@
font-weight: normal;
}
/* admin menu table: category panel header + item cell formatting.
Shared between admin/menu.php's server render and admin/menu.js's
client-side row/panel templates, so it lives here once instead of
being duplicated as inline styles in both places. */
.font-mono {
font-family: var(--font-mono);
}
/* two classes to reliably outrank .panel h2's margin-bottom above */
.category-panel .cat-name-heading {
margin-bottom: 0.25rem;
}
.cat-desc-text {
font-size: 0.88rem;
}
.no-items-row td {
text-align: center;
padding: 1.5rem 0;
}
.item-desc-cell {
font-size: 0.82rem;
margin-top: 0.2rem;
}
.item-price-cell {
color: var(--gold-bright);
font-weight: 500;
}
.item-sort-cell {
color: var(--ink-muted);
font-size: 0.8rem;
}
.item-badge-cell .eyebrow {
font-size: 0.68rem;
}
/* ---------- admin modal dialogs ---------- */
.admin-modal-backdrop {
position: fixed;
@@ -1428,7 +1473,6 @@
.admin-toolbar {
display: flex;
justify-content: flex-start;
gap: 0.75rem;
align-items: center;
margin-bottom: 2rem;