Commit graph

24 commits

Author SHA1 Message Date
Jon Seager
920931ba17
refactor: fix template review findings (security, macros, tokens)
Address findings from the templates code review:

- Fix XSS in admin.html onclick handlers via data attributes
- Fix XSS in 5 edit page signal initializations via JSON serialization
- Fix register.html token exposure by moving to data attribute
- Add entity_icon, quick_notes_toggles, add_form_submit macros
- Replace hardcoded colors with design tokens (warning, error, success)
- Add warning design tokens to CSS theme
- Scope MutationObserver to main element
- Add defer to webauthn.js script tags
- Refactor login/register JS to arrow functions
- Guard lightbox script behind image_url check
- Fix else-if to elif in 5 templates
2026-02-13 16:20:30 +00:00
Jon Seager
1f21dc27af
fix: prevent iOS auto-zoom on input focus
Bump .input-field font-size to 1rem (16px) on mobile so iOS Safari
does not auto-zoom the viewport when focusing text inputs, number
inputs, or searchable selects.
2026-02-11 10:11:02 +00:00
Jon Seager
55addb200c
fix: prevent double-tap zoom on mobile stepper buttons
Add touch-action: manipulation to .btn-adjust so rapid taps on +/-
buttons no longer trigger the browser's double-tap-to-zoom gesture.
2026-02-11 10:07:58 +00:00
Jon Seager
049e9d68a8
fix: mobile fixed nav bar and detail page polish
- Make nav bar fixed on mobile with safe-area-inset-top support for
  notched devices (10% reduction) and 1rem minimum for non-notched
- Adjust timeline sticky month headings to sit flush below the fixed
  nav with matching top/bottom padding
- Update IntersectionObserver rootMargin to account for fixed nav height
  so stuck-state accent border triggers correctly
- Increase main content top padding on mobile for balanced spacing on
  detail pages
- Add remaining field to bag edit form with +/- stepper buttons
- Make admin page passkey/token forms responsive with icon-only mobile
  delete/revoke buttons
- Make detail page action buttons stack vertically on mobile with equal
  width
2026-02-11 09:53:43 +00:00
Jon Seager
92b20396af
fix(ui): improve mobile card layout for list views
Right-align values in mobile card cells while keeping labels left-aligned.
Move tasting notes to a label-free strip at the bottom of roast cards.
2026-02-09 20:24:57 +00:00
Jon Seager
004f92e340
feat(css): add error/success design tokens, touch targets, and active state
Add error and success color tokens with dark mode support, increase
btn-adjust touch target to 44px on mobile, and add .ss-active highlight
class for keyboard navigation in searchable components.
2026-02-09 19:54:22 +00:00
Jon Seager
1a71fb4158
chore: autoformat templates with prettier 2026-02-09 13:40:05 +00:00
Jon Seager
ccbd229d75
style(stats): add bg-surface to cards/pills/tabs, reorder tabs
- Add bg-surface background to roast stats, consumption, and country pill cards
- Update tab CSS: bg-surface background, hover:border-accent/40 instead of bg-surface-alt
- Add hover:border-accent/40 to clickable country pill buttons
- Make Roasts the first and default tab on the stats page
2026-02-08 16:47:30 +00:00
Jon Seager
f144526288
feat(stats): add world-map theme awareness and highlight color
- Add --highlight-rgb CSS custom property for light and dark themes
- Add MutationObserver to world-map for theme change detection
- Read choropleth colors from CSS custom properties instead of hardcoded values
- Simplify stats_map partial to use text-highlight class
2026-02-08 15:20:44 +00:00
Jon Seager
af9344202d
refactor(css): add text-2xs and small-caps utilities, replace inline styles
- Add @utility text-2xs (0.65rem) and small-caps (font-variant) to input.css
- Replace inline style="font-variant: small-caps" with .small-caps class
  across all list partials and base.html footer
- Add gap support to .tab and .tab-mobile for icon+label layout
- Reduce mobile top padding (py-4 md:py-10) on main container
- Rename CSS section header from "Scrollbar hide" to "Utilities"
2026-02-07 22:36:28 +00:00
Jon Seager
81308fdef2
style(ui): restyle cards, buttons, and icons for consistency
- Redesign brew cards: replace pill badges with text notes, add
  full-width Brew Again button with cup icon, adjust card height
- Redesign bag cards: move Brew/Close buttons below progress bar,
  add Close button label, reduce card height
- Restyle account page buttons (Sign Out, Restore, Reset, Cancel)
  to use consistent bordered-accent pattern
- Replace thin logout icon with Font Awesome person-running SVG
- Update homepage stats labels and quick action buttons to text-sm
- Add empty state placeholders for brews, bags, and activity sections
- Enlarge logo click target, swap theme toggle icons, add font-medium
  to mobile tab selector
- Remove small-caps from scan input "or" labels
2026-02-07 21:42:38 +00:00
Jon Seager
dd3714f0a1
style(ui): restyle buttons, tabs, and form inputs
- Change btn-adjust to grey border with orange text and subtle hover
- Add font-family/font-size to .input-field for consistency
- Redesign desktop tabs: bordered, orange text, equal width, accent
  border on active instead of filled background
- Redesign mobile tab selector: bordered dropdown with orange text,
  rounded container, subtle active background
2026-02-07 20:58:41 +00:00
Jon Seager
51f8122201
feat(ui): improve form UX with collapsible equipment and clickable controls
- Split equipment into separate Grinder and Brewer collapsible sections
  with summary bars showing current selection
- Make all summary bars, matched-entity cards, and searchable-select
  selected values clickable anywhere to change (not just the X/Change button)
- Fix stepper buttons broken after manual input by switching from
  data-attr:value to data-bind with Number() coercion
- Merge Water + Brew Time into single Recipe section
- Make all add/confirm buttons full-width
- Add sticky submit button on mobile
- Fix missing closing > on cafe indicator div
- Fix broken Askama syntax on checkin page from formatter
2026-02-07 12:10:56 +00:00
Jon Seager
cc4f9068d9
style(ui): polish brew form and stepper buttons
- Hide native number input spin buttons across browsers
- Fix brew time field width to match sibling fields
- Restyle .btn-adjust with accent-subtle fill instead of border
- Remove (M:SS) hint from brew time label
2026-02-07 11:29:51 +00:00
Jon Seager
b774f356e6
feat(timeline): add collapsible cards with condensed view
Cards start collapsed showing category, relative date, title, and
subtitle. Clicking expands to reveal full timestamp, detail rows,
tasting notes, and external links. Uses a single Datastar signal
for expand state.

- Replace pill badge with small-caps category label
- Remove brew-again button from timeline cards
- Replace @ separators with · in brew detail values
2026-02-07 10:55:21 +00:00
Jon Seager
8410b46a11
feat(ui): add horizontal scrolling open bags on homepage
- Load all open bags instead of limiting to 3
- Replace grid layout with horizontal scroll container using snap
- Redesign bag cards as portrait layout with icon actions
- Add scrollbar-hide CSS utility and x_mark icon
2026-02-07 10:22:48 +00:00
Jon Seager
44174b4361
feat(ui): colour-code tasting note pills by SCA wheel category
Add view-layer mapping that categorises tasting notes into 9 colour
families (floral, fruity, citrus, sweet, nutty, spice, roasted, sour,
vegetal) based on the SCA Coffee Tasting Wheel. Matching uses
case-insensitive exact lookup against ~90 known terms, then substring
fallback, with pill-muted as the default for unrecognised notes.

- Add tasting_notes module with NoteCategory enum and categorize()
- Add 9 pill CSS variants with light and dark mode support
- Update roast list and timeline templates to render coloured pills
2026-02-06 16:26:29 +00:00
Jon Seager
dcaac1ee9c
feat(ui): add usage progress bars to bag cards and data table
- Add used_percent field to BagView computed from amount/remaining
- Display accent-colored progress bar on homepage bag cards
- Replace Open pill with progress bar in bag data table (desktop and mobile)
- Merge Weight column into Status column showing remaining/total
- Add full-width progress bar to mobile card view for open bags
- Sort Status column by remaining grams (closed bags treated as 10000g)
- Hide Finished field on mobile for open bags
- Use small-caps typography for remaining text labels
2026-02-06 16:08:41 +00:00
Jon Seager
3a960b9d14
feat(ui): enhance desktop tables and mobile card views
- Add spacious flat table CSS for desktop (transparent card wrapper,
  lighter dividers, visible hover, larger cell padding)
- Split roaster/cafe columns into separate Country and City columns
  with sortable headers
- Split cup Roast/Roaster into separate desktop columns with city
  sort support (full-stack: domain, repo, view, template)
- Add sortable Status column to bags with colored pills (green Open,
  amber Closed) and remaining weight subtext
- Style bag Finished column as date-only (NaiveDate) and Weight
  column with smaller text
- Show status pill next to mobile bag card actions menu
- Add city to cups mobile card view
- Use middle dot separator for brew recipe weight/volume
- Add tasting notes pills to roast list, brew notes to brew list
- Fix build.rs to use rerun-if-changed for CSS and templates
2026-02-06 15:40:40 +00:00
Jon Seager
f31f87d4e1
feat(ui): spacious flat desktop tables with accent hover
- Remove bordered card wrapper from table sections on desktop
- Strip thead background, rely on typography for header distinction
- Increase cell vertical padding from 0.75rem to 1rem
- Add white row backgrounds with explicit horizontal borders
- Add accent-tinted hover with left bar indicator
- Float pagination below table as un-bordered footer
- Shrink pagination prev/next to compact card-style buttons
2026-02-06 13:57:27 +00:00
Jon Seager
05c33ed533
fix(timeline): register border color in Tailwind theme
The timeline line used `bg-border` but `--color-border` was missing from
the @theme block, so Tailwind never generated the utility class and the
line was invisible.
2026-02-05 21:44:03 +00:00
Jon Seager
709adcdd3e
fix(ui): tokenize neutral text colors for dark mode contrast
Replace ~268 hardcoded text-stone-* classes with theme-aware token
utilities (text-text, text-text-secondary, text-text-muted) across all
templates and JS components. Adjust dark mode token values to meet
WCAG AA contrast ratios on dark surfaces.
2026-02-05 20:57:59 +00:00
Jon Seager
3bc6fae656
refactor(ui): improve data table detail rows and mobile cards
- Split created_at into created_date + created_time across all view models
- Add inline card-detail pattern for mobile action buttons
- Add desktop detail-row with ellipsis toggle for table actions
- Add pill-warning and pill-success CSS variants with dark mode
- Center mobile card-detail buttons, fix card-date vertical spacing
- Rename action labels: "View on Map" → "View Map", "Visit website/homepage" → "Homepage"
2026-02-05 20:40:38 +00:00
Jon Seager
4e917cee75
refactor: move static assets out of templates/ into static/
Move CSS, JS, favicon files to static/ directory to separate
compiled-in assets from Askama templates. Update all include paths,
build.rs, flake.nix, and Tailwind @source directives.
2026-02-05 17:47:32 +00:00