Full Plate · static mock

Cook Book / Views.

v1.0
2026 · 05 · 20

Every view from views-and-menus.md, built as a click-through static mock. Hand to a dev as visual reference. Links between mocks work — open any view and follow real navigation. Toggle dark / light top-right.

Anonymous & auth

  1. 01 Sign inMagic-link request + check-email confirmation, stacked. signin.html
  2. 02 Magic-link callbackTransient OTP-verify landing. callback.html
  3. 03 Public share — anonMetadata-only view of /r/:slug for logged-out visitors. share-anon.html
  4. 04 Public share — authedFull recipe + Save / Fork affordances for non-owners. share-authed.html

Library

  1. 05 LibraryGrid of recipe cards; sort / filter chips; per-row "…" menu shown open. library.html
  2. 06 Library — emptyFirst-run state with the three import CTAs. library-empty.html
  3. 07 TrashSoft-deleted recipes; Restore / Hard-delete row menu. trash.html

Recipe — read

  1. 08 Recipe detailSunday Bolognese — the working reference page. cookbook.html
  2. 09 Cook modeStep-by-step "doing it now" with ingredient checklist + timer. cook-mode.html

Recipe — write

  1. 11a Create recipe (blank)Blank recipe editor interface. editor.html
  2. 11b Edit recipe (populated)Prefilled recipe editor (Sunday Bolognese) with unit and category menus open. editor-edit.html
  3. 12 Import inputPre-extraction URL field + paste-text textarea, stacked as two states. paste-import.html
  4. 13 Import draftAI-extracted preview before POSTing as a real recipe. import-draft.html

Cook logs

  1. 14 Log a cookRating, cooked_at, notes. cook-log-entry.html
  2. 15 Cook log historyPer-recipe log list with Edit / Delete row menu. cook-log-history.html
  3. 16 Cooking journalCross-recipe timeline of every cook, grouped by month. journal.html

History & lineage

  1. 17 Activity feedPer-recipe RecipeActivity stream + per-field revert menu. activity.html
  2. 18 LineageFork tree — all three LineageParent variants + children. lineage.html

Account

  1. 19 AccountProfile, storage + AI + import usage, tier, danger zone with delete modal. account.html
  2. 20 SubscriptionFree vs Pro tier comparison + FAQ. subscription.html
  3. 21 Tags managerFull tag vocabulary; rename / delete row menu. tags.html

Cross-cutting

  1. 22 SearchTwo-pane results — title hits + ingredient hits. search.html
  2. 23 Tier-limit promptsThree illustrative modal states (URL import, AI, storage). quota.html
  3. 24 Error surfaces404 / 403 / 410 / session-expired. errors.html