Commit Graph

226 Commits

Author SHA1 Message Date
22d14ef9bc ProvidersStep + MapPin: verified-icon alignment, filter tidy, drawer fixes
MapPin (both tiers)
- Verified providers now get an inline verified tick on the left of
  the name, matching the tick colour to the name so it reads as part
  of the label. Inline SVG (not @mui/icons-material) because MapPin
  is mounted via createRoot outside the ThemeProvider.
- Max label width bumped 180 → 210px to accommodate the icon without
  aggressively truncating long names.

Mobile cluster drawer rows
- Verified icon aligns with the name's top line (flex-start + 1.25em
  icon slot) — matches the desktop ClusterPopup layout.
- New right-aligned "From $X" price column, copper for verified.

Controls
- Mobile List/Map toggle: text labels (List, Map) instead of icons.
- Desktop List/Map toggle: resized to 32px height matching Filters +
  Sort buttons; bigger type, more padding.
- Search input corner radius now matches the button radius (8px)
  instead of the input radius (4px) so it reads as part of the chip
  set rather than a separate control.

Filter dialog (desktop + mobile)
- Remove the Location field — the sticky search bar is primary.
- Funeral-type chips bump small → medium.
- Reset filters button always renders; disabled when no filters are
  active (was previously hidden), so the affordance is discoverable.
- Provider-feature switches (Verified only, Online arrangements)
  align to the first text line so wrapped labels don't sink the
  switch visually below the second line.

Mobile drawer close
- drawerOpen now excludes the `exiting` phase, so tapping the X slides
  the drawer down immediately instead of lingering with a stale
  opacity fade. Visibility flips to hidden only after the slide ends.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 22:31:12 +10:00
7feb6582c4 ProvidersStep mobile: unify control outlines + shadows, square drawer bottom
- Search, Filters, Sort by, and the List/Map toggle now share a
  neutral-300 1px border and a shadow-sm drop, so the strip reads as a
  coherent set of floating chips over the map (not a mix of different
  button chromes)
- Drawer card now runs edge-to-edge inside the drawer with its own
  border + shadow stripped; the drawer Paper provides the top radius
  and the bottom is explicitly squared (no stray MUI default radius
  leaking through)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 21:52:54 +10:00
d91ad13af8 ProvidersStep mobile: white search fill + Sort by text trigger
- Mobile-map search input gets an explicit white fill so it reads
  cleanly against map tiles (desktop unchanged)
- Sort trigger on mobile-map is now a compact "Sort by" outlined
  Button instead of a lone icon — clearer affordance than the swap
  glyph, still tight on horizontal space

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 21:43:39 +10:00
705e85b37c ProvidersStep mobile: transparent control strip, icon-only sort, drawer header
- Drop the Paper container around the mobile-map floating controls —
  each control (Filters, Sort, view toggle) now carries its own white
  fill and reads over any map tile without a shared box
- Sort button becomes icon-only on mobile-map (the current sort is
  still communicated via the aria-label and the menu) — saves the
  row's horizontal budget
- Align all three controls to 32px height so Filters, Sort, and the
  List/Map toggle sit on a common baseline
- Move the drawer close X out of the image overlay area into a
  dedicated 40px drawer header bar; cluster header text ("N providers
  in this area") now lives in the same strip. No more overlap with the
  Verified badge on the card image.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 12:57:48 +10:00
8c818fd5ac ProvidersStep: mobile map-first layout with bottom drawer
On xs + viewMode=map, render a map-first layout: full-bleed map,
floating card-shaped control strip at the top (search + Filters +
Sort + compact List/Map toggle), and a bottom drawer that slides up
when a pin or cluster is tapped. The desktop list-map layout is
unchanged.

On xs + viewMode=list, the List/Map toggle now appears in the sticky
control bar (icon-only) so users can reach the map from the list view.
On desktop the toggle stays on the map panel as before.

Drawer content:
- Single pin → the existing ProviderCard molecule, entire card
  clickable (navigates to packages)
- Cluster → a list of image-free rows (verified icon slot + name +
  location + rating), tap a row to pan+zoom into the provider
- Close X on the drawer clears the active state

To support externalising popups, ProviderMap gains two opt-in props
(`externalisePopups`, `onActiveChange`) and an imperative handle
(`clearActive`, `drillIntoProvider`). Desktop behaviour unchanged
when these aren't used. The forwardRef now exposes the handle rather
than the DOM element; no existing callsite passed a DOM ref.

The filter-dialog children are now defined once as a shared JSX
fragment used by both desktop and mobile FilterPanel instances.

Header + subhead are suppressed on the mobile map view (per concept
reference); they remain on desktop and mobile list for orientation.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 12:39:08 +10:00
3bf5f72b4f ProvidersStep search: lock button, primary-circle, drop focus rings, grey chip
- Suppress Autocomplete's own popup/clear indicators (forcePopupIcon,
  clearIcon) so the search IconButton stays anchored in the same spot
  across empty, draft, and chip states
- Search button is a primary-filled circle at default strength in every
  state (no disabled dimming) — a clear affordance, handler already
  guards for empty drafts
- Drop the brand-gold focus ring on the search bar; keep the default
  neutral border on focus
- Drop the copper 2px focus outline on Filters and Sort (outline: none
  under :focus-visible)
- Committed location chip now uses the default neutral tonal fill
  instead of the promoted brand colour

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 10:53:04 +10:00
4d77d42876 ProvidersStep search: tighten icons, commit-to-chip, primary search button
Sticky search now uses Autocomplete (multiple+freeSolo capped to 1)
instead of a plain TextField:
- Pin icon tightened to the left edge and to the placeholder
- Committed location renders inside the input as an FA Chip with an
  X delete (clears the committed filter)
- Primary-coloured magnifying-glass IconButton on the right commits
  the draft; disabled while the draft is empty
- Typing no longer filters live — Enter or the search button promotes
  the draft to a chip, matching the chip mental model

The FilterPanel dialog's Location autocomplete already read from the
same searchQuery state, so it continues to display the committed chip.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 10:30:30 +10:00
952bdaea72 Clarify ProvidersStep sort button + bold results count
- Sort button now reads "Sort: <value>" so it's distinguishable from
  a filter; aria-label spells out the current sort. Price sort labels
  dropped their internal colons (avoids double-colon rendering).
- Results count bolds the number in primary text so it registers as
  the subject rather than incidental metadata.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 10:12:28 +10:00
e78d88b2f3 Add Google Maps ProviderMap organism with clustering + popup flow
Introduces a full Google-Maps-backed provider map for the arrangement
wizard's ProvidersStep. Clicking a pin morphs it into a MapPopup at
the same coord; pins within 70px of each other collapse into a cluster
(ceiling at zoom 13) that opens a ClusterPopup list on click. Row
clicks pan + zoom the map to the provider and open their MapPopup.
Map-background click routes through an exit transition that fades the
popup out before reappearing the pin, via a matching fade-in keyframe
on the atom markers.

Key additions:
- @vis.gl/react-google-maps + @googlemaps/markerclusterer deps
- ClusterMarker atom (count badge; verified / unverified palettes)
- ClusterPopup molecule (image-free rows; verified icon aligned to
  name; right-aligned "From $X" column; verified-first sort)
- ProviderMap organism (APIProvider + Map + imperative AdvancedMarker
  layer via createRoot for clusterer compatibility)

Component changes:
- MapPin: promoted verified palette (brand-700); name now required;
  name-only and price-only variants dropped; active prop removed in
  favour of organism-level state; SVG nub with fill+stroke replaces
  the CSS border-triangle trick so the outline is continuous
- MapPopup: `exiting` prop drives close animation; click events stop
  propagation so the map's onClick can't clear state mid-interaction
- ProviderData type gains optional `coords`; demo fixtures populated
  with real NSW/QLD lat/lng for all 7 providers
- ProvidersStep demo route wires ProviderMap into the mapPanel slot

Memory:
- docs/memory/component-registry updated (ClusterMarker, ClusterPopup,
  ProviderMap added; MapPin + MapPopup refined; MapCard retired)
- docs/memory/session-log captures arc across 2026-04-21/22 and flags
  next-session work: ProvidersStep polish, mobile layout for list-map
  WizardLayout, and demo deploy

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 09:29:37 +10:00
626666e6f0 Add demo:publish npm script for one-shot redeploy
Wraps the build + rsync into a single command for the routine
edit-and-ship loop.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-20 17:29:36 +10:00
cd7f99f59d Wire demo for production deploy + add server config
Fixes images 404'ing under /arrangement/ — Vite's publicDir copies assets
to the build root, but the base prefix is only applied to bundled assets
(JS/CSS), not to runtime URL strings. assetUrl() helper resolves paths
against import.meta.env.BASE_URL so '/images/foo.png' becomes
'/arrangement/images/foo.png' in production while staying '/images/foo.png'
in dev.

- src/demo/shared/assets.ts — assetUrl() helper
- providers.ts + DemoNav.tsx — wrap all public asset paths
- nginx/parsons-demos.conf — swag site-conf for parsons.tensordesign.com.au
  (asset cache regex above SPA fallback regex per nginx first-match rule)
- docs/reference/client-demo-deploy.md — server runbook (DNS, swag
  SUBDOMAINS, mount, htpasswd, deploy loop)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-20 17:22:40 +10:00
45d73759c1 Scaffold arrangement demo slice with CompareBar wiring
Add a self-contained demo build target for the Providers → Packages →
Comparison flow, deployable as a static SPA at /arrangement/.

- vite.demo.config.ts: per-slice build via --mode, base path flips for
  dev vs prod, output to dist-demo/<slice>/
- src/demo/: shared fixtures (7 providers across verified/tier3/tier2
  with real venue photography from brandassets) + Zustand basket store
  with ?compare= URL persistence
- Verified-provider packages now share the nine canonical Essentials
  line items per FA convention; only Optionals/Extras vary
- App-level CompareBar surfaces "Already added" / "Maximum 3" feedback
  via transient store error
- ProviderCard logo objectFit cover→contain so wide logos don't crop
- npm scripts demo:dev / demo:build, deps zustand + react-router-dom
2026-04-20 14:55:21 +10:00
e67872cb6a Unify PackagesStep across tiers + polish pass
Consolidate the three tier pages (PackagesStep, UnverifiedPackageT2,
UnverifiedPackageT3) into a single tier-aware PackagesStep with
providerTier: 'verified' | 'tier3' | 'tier2'. Copy, CTA label, price
disclaimer, and itemised-unavailable state all derive from tier via
an internal TIER_COPY map.

Extract NearbyPackageCard as a molecule (was duplicated inline in T2
and T3). Inherits Card atom's default elevated variant so shadow
matches the primary ServiceOption cards in the same column.

Add showAllFromProvider variant for the "See N more packages from
this provider" flow — flat list, no grouping, no secondary list,
preference filter dropped.

Polish pass on PackagesStep + PackageDetail:
- PackageDetail header band warm → white; added card drop-shadow.
- onCompare prop wire-through (button was built in but never exposed).
- Price disclaimer info-box: padding/gap/line-height tuned, icon
  alignment fixed (mt: '3px' matches codebase convention for 16px
  icons paired with body2 text).
- Left-column vertical rhythm: 48px gaps between provider card /
  subheading / list; 128px gap (Divider my: 8) between primary and
  secondary sections to separate groupings.
- Mobile drill-in navigation via useMediaQuery + display toggles.
  onSelectPackage widened to accept string | null; Back button
  swaps to "Back to packages" when a package is selected on mobile.
  Scrolls to top on drill-in.
- "See all" link copy: "See N more packages from this provider →"
  (overflow count, no provider name — sidesteps long-name wrapping).
- Verified provider image: placeholder URL → real local asset
  (hparsonsvenue.jpg, resized 2048×1366/591KB → 640×427/52KB).

Delete legacy PackageSelectPage story in PackageDetail.stories.tsx
(predated the real page components).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-20 12:45:57 +10:00
312a77aeb9 Polish ComparisonPage mobile cards + page layout
- ComparisonTabCard: width 210 → 235; recommended badge switched to
  filled brand + StarRoundedIcon matching the desktop
  ComparisonColumnCard treatment; removed glow + active glow shadow in
  favour of the standard shadow-sm; border colour brand-500 → brand-600;
  pt 2.4 → 3.5.
- ComparisonPackageCard: verified badge replaced with inline
  VerifiedOutlinedIcon to the left of the provider name (matches
  desktop pattern); warm tint confined to the header (Card body now
  explicitly white); 2px brand-600 border when recommended; header
  padding px 2.5 → 3, pt 2.5 → 3, pb 2 → 4; spacing pass across the
  provider identity / package info / sections groups — Divider my
  1.5 → 3, section mb 3 → 5, item py 1.5 → 2, heading→first-item 1.5
  → 2.5.
- ComparisonPage mobile: Divider between page header and tab rail;
  "Choose a package to view" h2 heading (user-centric copy), used as
  aria-labelledby for the tablist; dot indicator below the rail
  (8px grey, active 24×8 brand-600 pill) — aria-hidden and tabIndex=-1
  so the tab rail above remains the canonical accessible navigation.

Also leaves the Figma capture script in preview-head.html for future
page captures.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-17 15:52:07 +10:00
f146bb0f81 Restructure ComparisonPage with bleed variant + sticky-left columns
Adopts a single-scroll-container layout for the desktop Comparison page
(motivated by a Figma Make exploration). The page header sits in a
max-width container matching the table's natural width, with flex
spacers either side of the table — when the viewport is wider than
the table, spacers centre it; when a 4th+ package pushes the table
wider than viewport, spacers collapse and the table extends rightward
from the page header's left edge.

- New WizardLayout variant `bleed` — viewport-locked, no inner Container,
  main is the single scroll host, back link routed into children,
  `data-wizard-scroll` marker for descendants.
- ComparisonTable: fixed 300px column widths exposed as
  COMPARISON_TABLE_COL_WIDTH; sticky-left on row-label column across
  every per-section mini-table; tiered hover (surface-subtle base /
  surface-warm recommended column); recommended column carries a
  resting 50%-opacity warm tint; "Not Included" copy replaces em-dash
  for unavailable cells in Optionals/Extras sections; CellIconText
  helper applies lineHeight: 1 so icon+text rows align optically.
- ComparisonColumnCard: uniform pt: 5 (40px); medium badge (26px) with
  star/verified icon; 2px brand-600 border for recommended; provider
  name wraps to 2 lines in a reserved 36px bottom-aligned slot so
  1-line names keep subsequent content on a consistent baseline; Remove
  link always rendered as the same Link element (visibility-hidden when
  not applicable) so CTA+footer align across all cards.
- Mackay test data extended to exercise 2-line wrap.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-17 15:51:41 +10:00
356d22da4c Refine ComparisonColumnCard recommended state and CTA alignment
- Replace recommended banner with floating badge (star + primary fill)
  so CTA buttons align across recommended and non-recommended columns.
- Inline verified icon on recommended cards only (left of provider name,
  brand-600). Non-recommended verified providers keep the top badge alone.
- Override recommended card border to brand-600 for consistency with
  the rest of the primary system (token default is brand-500).
- Show dash in rating slot when provider has no rating — keeps heights
  consistent across the row.
- Invisible Remove placeholder on recommended card so primary CTAs align
  with cards that have a visible Remove link.
- Remove link dropped from body2 to caption (12px).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 21:36:22 +10:00
9ac8e31516 Refine HomePage layout and add Locations dropdown to Navigation
- Navigation: add NavItem.children support for desktop dropdown + mobile collapsible sections. Wire Locations (Melbourne, Brisbane, Sydney, South Coast NSW, Central Coast NSW) before FAQ in all HomePage stories.
- HomePage hero: add italic "Trusted by thousands of families across Australia" tagline above h1, widen text container to 990px, use hero-couple.jpg background.
- HomePage features: rename "How it works" to "4 Reasons to use Funeral Arranger", add "Why Use Funeral Arranger" overline, remove placeholder body copy.
- HomePage testimonials: add "Funeral Arranger Reviews" overline above "What families are saying".
- HomePage CTA: promote "Start planning" to primary contained button (medium).
- FuneralFinderV3: remove header + divider so the form starts directly at "How can we help".

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 16:00:28 +10:00
348f3912fd Promote hero h1 to display2 for visual hierarchy over section h2s
Hero heading was display3 (same as every section h2), giving no visual
distinction. Now display2 (52px/24px) vs display3 (40px/22px). Still
renders as semantic h1 for SEO.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-13 16:03:32 +10:00
9e627d88a6 Refine HomePage mobile spacing and typography scaling
Increase hero top padding, heading-to-subheading gap, and finder card
side padding on mobile. Scale body1 text to 14px on mobile under display3
headings for better hierarchy contrast. Centre-align "Why Use FA" section
on mobile. Remove arrow from "Start exploring" button.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-13 15:49:33 +10:00
ab25af2e67 Add external asset hosting for Chromatic image rendering
Migrate Gitea remotes to git.tensordesign.com.au. Add assetUrl() utility
that resolves image paths from Gitea ParsonsAssets repo when
STORYBOOK_ASSET_BASE is set, enabling images on Chromatic-published
Storybook while keeping local dev unchanged via staticDirs.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-13 15:28:14 +10:00
5b2a41f4e4 Add /publish skill for consistent multi-target deployment
Pushes to backup (full), fa-dev + sheffield (stripped via worktree),
and Chromatic in one command. Replaces ad-hoc push workflow.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-12 23:50:41 +10:00
5e93f3a0d0 Promote HomePage V3 to production, redesign layout and refine FuneralFinder
Homepage: add "Why Use FA" text+image section and "Three Ways" feature cards,
reorder sections (logos carousel above discover), apply warm-grey alternating
backgrounds from Figma, unify all section headings to display3 serif, increase
section padding, fix heading hierarchy for SEO, and left-align testimonials.

FuneralFinder V3: responsive CTA (medium on mobile), shorten button to "Search",
bump reassurance text to caption variant, tighten location pin-to-text gap.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-12 23:19:31 +10:00
e89ac360e8 Extract ComparisonColumnCard + ComparisonTabCard molecules, refine comparison UI
- New molecule: ComparisonColumnCard — desktop column header card extracted
  from ComparisonTable (~150 lines removed from organism)
- New molecule: ComparisonTabCard — mobile tab rail card extracted from
  ComparisonPage (shared by V1 and V2)
- CellValue "unknown" restyled: icon+text in neutral grey (was Badge),
  InfoOutlinedIcon on right at 14px matching item info icons
- Unverified provider story data: all items set to unknown across all
  story files (no dashes in essentials)
- Mobile tab rail: recommended badge (replaces star), package price,
  shadow/glow, center-on-select scroll, overflow clipping fixed
- ComparisonPackageCard: added shadow, reduced CTA button to medium
- ComparisonTable first column: inline info icon pattern (non-breaking
  space + nowrap span) prevents icon orphaning on line wrap

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-12 21:10:17 +10:00
b7a2a4e136 Extract ComparisonPackageCard molecule
The mobile package card was previously duplicated inline in both
ComparisonPage (V2) and ComparisonPageV1 — same ~250-line component
pasted twice. Extract it as a proper molecule so card-level tweaks
land in one file and both pages stay in sync.

New molecule: src/components/molecules/ComparisonPackageCard/ with
component, stories (Verified, Unverified, Recommended,
ItemizedUnavailable), and index. API reuses the existing
ComparisonPackage type from ComparisonTable.

Both pages drop their inline MobilePackageCard + MobileCellValue
helpers and a handful of now-unused imports (Tooltip, Badge, Divider,
several icons, ComparisonCellValue type).

The desktop column header inside ComparisonTable is left inline —
it's tightly coupled to the grid/sticky behaviour and has a floating
verified badge + Remove link that differ meaningfully from the mobile
card. Extracting both variants into one molecule would need an
awkward variant prop for marginal gain.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-09 15:33:29 +10:00
cd0f79f2f5 Add ComparisonPage V2 with recommended package on the left
Archive the current ComparisonPage as V1 (viewable under Archive/ in
Storybook) and build V2 as the new production version. In V2, the
recommended package is prepended instead of appended: it appears as the
first column on desktop and the first tab in the mobile rail. On mobile
the initially active tab is the first user-selected package, not the
recommendation — the recommended tab is surfaced as a visible suggestion
rather than the default view, which felt too upsell-y for the audience.

Both V1 and V2 now use a StarRoundedIcon (brand-600) in the mobile tab
label instead of a text star, so the "recommended" marker reads cleanly
against both selected and unselected tab backgrounds.

See decisions-log D040 for rationale.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-09 14:59:28 +10:00
c3c0beadb9 Remove AI tooling and working docs from repo tracking
Add .agent/, .mcp.json, CLAUDE.md, AGENTS.md, GEMINI.md, QUICKSTART.md,
bootstrap.sh, docs/memory/, and docs/reference/ (impeccable, vercel,
workflow guides) to .gitignore. Files remain on disk for local use but
are no longer tracked or pushed to remotes.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-07 01:39:52 +10:00
52fd0f199a Add package comparison feature: CompareBar, ComparisonTable, ComparisonPage
New components for side-by-side funeral package comparison:

- CompareBar molecule: floating bottom pill with fraction badge (1/3, 2/3, 3/3),
  contextual copy, Compare CTA. For ProvidersStep and PackagesStep.
- ComparisonTable organism: CSS Grid comparison with info card, floating verified
  badges, separate section tables (Essentials/Optionals/Extras) with left accent
  borders, row hover, horizontal scroll on narrow desktops, font hierarchy.
- ComparisonPage: WizardLayout wide-form with Share/Print actions. Desktop shows
  ComparisonTable, mobile shows mini-card tab rail + single package card view.
  Recommended package as separate prop (D038).

Also fixes PackageDetail: adds priceLabel pass-through (D039), updates stories
to Essentials/Optionals/Extras section naming (D035).

Decisions: D035-D039 logged. Audits: CompareBar 18/20, ComparisonTable 17/20.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-07 01:17:34 +10:00
eb26242ece Update registry and session log with final MiniCard/MapPin/MapPopup state
All three components iterated with user feedback and approved.
Registry updated with final APIs. Session log captures all decisions
from the iteration rounds.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 21:05:06 +10:00
723cdf908a Iterate MapPopup: consistent hierarchy, clickable card, icon badge
- Hierarchy now matches MiniCard: title → meta → price
- Whole card is clickable (onClick prop) — removed View details link
- Verified badge → icon-only circle in image (matches MiniCard)
- Name truncated at 1 line with tooltip on hover
- No-image fallback shows inline verified icon + text
- Added keyboard support (Enter/Space) and focus ring

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 20:59:55 +10:00
c457ee8b0d Add price-only MapPin variant (no name)
Name is now optional. When omitted, renders a compact single-line
pill with just "From $X" using the bolder name styling. Useful for
denser map views or when provider identity isn't needed at pin level.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 20:55:36 +10:00
9f16bc87c2 Increase MapPin horizontal padding from 8px to 12px
Names were too tight against the pill edges, especially on longer
provider names. Bumped token from spacing.2 to spacing.3.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 20:52:22 +10:00
ec4b18152b Bump MapPin price font weight from 500 to 600
Medium (500) was too thin at 11px — semibold (600) reads better
while still being lighter than the name (700) for hierarchy.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 20:48:08 +10:00
86df44496f Centre-align MapPin price text under provider name
Visually reviewed in Storybook — left-aligned price looked unbalanced.
Centring both lines makes the pin read as a cohesive label rather
than a misaligned mini card.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 20:46:15 +10:00
2b9aeaf8ef Iterate MiniCard and MapPin based on feedback
MiniCard:
- Verified badge → icon-only circle floating in image (top-right)
- Reorder content: title → meta → price → badges → chips
- Truncated titles show tooltip on hover with full text

MapPin: Rethink from price-only pill to two-line label:
- Line 1: Provider name (bold, truncated at 180px)
- Line 2: "From $X" (smaller, secondary colour) — optional
- Communicates who + starting price at a glance
- Verified/unverified palette distinction preserved
- Dot variant removed (name is always required now)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 20:11:13 +10:00
5364c1a3fc Update component registry, session log, and review plan
Add MiniCard, MapPin, MapPopup to registry. Log session work
including retroactive review completion and new component builds.
Mark all review phases complete in retroactive-review-plan.md.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 19:51:53 +10:00
ae1e344a8a Add MapPopup molecule — floating card for map pin click context
Compact provider/venue preview anchored to a MapPin. Image + name +
price + meta row + "View details" link. Downward nub connects to pin.
Drop-shadow filter for floating appearance. Verified badge inside image.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 19:51:02 +10:00
4fecb81853 Add MapPin atom — price-pill map markers with verified/unverified distinction
Airbnb-style markers: pill variant (price label + nub) and dot variant
(no price). Verified = brand palette, unverified = neutral grey.
Active state inverts colours + scale-up. Pure CSS for map overlay use.
Keyboard accessible with role="button" and focus ring.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 19:49:08 +10:00
f7efa7165c Add MiniCard molecule and component tokens for MiniCard + MapPin
MiniCard: compact vertical card for grids, recommendations, and map
popups. Image + title + optional price/badges/chips/meta. Lighter
than ProviderCard — no verified tiers, no logo. Audit: 20/20.

MapPin tokens added (build next): price-pill markers for map views.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 19:47:26 +10:00
2843bf289f Complete retroactive review: all phases done, only typeset deferred
Phase 1-3 audits and normalizations complete. ServiceSelector
aria-required fixed (P0). Badge/AddOnOption/ProviderCard flagged
issues analyzed and determined false positives. Preflight clean.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 19:29:32 +10:00
abdbf56c87 Add aria-required to ServiceSelector radiogroup for screen reader clarity
When a continue button is present (selection gates forward progress),
the radiogroup now communicates that a selection is mandatory.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 19:28:15 +10:00
9f5848b8a3 Add plain-English guide for Claude Code + Antigravity workflow
Human-readable reference for day-to-day use: when to use which tool,
typical flows for page tweaking and component building, workflow quick
reference, and how things change when backend work starts.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 12:17:18 +10:00
4af684ec8f Add cross-tool workflow: AGENTS.md, Antigravity workflows, documentation
- Create AGENTS.md (90 lines) as shared foundation for Claude Code + Antigravity
- Slim CLAUDE.md from 113 to 45 lines (Claude-specific only, references AGENTS.md)
- Slim GEMINI.md from 58 to 26 lines (Antigravity-specific only, references AGENTS.md)
- Add 6 Antigravity workflows in .agent/workflows/ (session-start, preflight, token-sync, visual-qa, build-component, page-review)
- Add docs/reference/cross-tool-workflow.md with task routing, quality gates, file ownership, error mitigation
- Zero content overlap between CLAUDE.md and GEMINI.md (was ~80%)
- File ownership boundaries defined for current phase and future backend work

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 11:10:32 +10:00
68889af9c2 Add UnverifiedPackageT2/T3 pages, FuneralFinder pre-planning timeframe, PackageDetail variants
- UnverifiedPackageT3: package step for unverified providers (no image,
  estimated pricing disclaimer, "Make an enquiry" CTA, nearby verified
  providers section)
- UnverifiedPackageT2: same but with "Itemised Pricing Unavailable" notice
  replacing the line-item breakdown
- PackageDetail: new props — arrangeLabel, priceDisclaimer, itemizedUnavailable
- FuneralFinderV3: pre-planning follow-up question ("How soon might you
  need this?"), responsive sizing fixes, compulsory validation
- HomePage: fix finder container width (flex stretch + 500px cap)
- .gitignore: exclude Claude/Playwright artifacts, working docs, screenshots

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-02 10:35:28 +11:00
eb6cf6a185 Add FuneralFinder V4, HomePage V3/V4, restyle Footer to light grey
- FuneralFinder V4: 3 numbered steps (48px circles), ungated location,
  no heading, inline copper errors, "Search" CTA. Archived.
- FuneralFinderV3: heading weight 600, "Find your local providers",
  "Search Local Providers" CTA, optional subheading
- HomePage V1/V2: split into separate archived stories
- HomePage V3: hero-3.png, updated copy, venue photos, map placeholder,
  scrolling partner logo bar, warm gradient CTA, increased spacing
- HomePage V4: same as V3 with FuneralFinderV4 via new finderSlot prop
- Footer: surface.subtle bg (matches header), dark-on-light text
- All versions archived in Storybook

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-01 14:02:52 +11:00
aaa4f80a05 Update session log + component registry for 2026-03-31d
Added: UnverifiedProviderStep, HomePage V2, filter panels, control bars,
sort/view toggle, Phase 4 adapt fixes.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-31 21:27:02 +11:00
90f47580ca Strip template feel from features + simplify CTA section
Features: remove Card containers and circular icon backgrounds.
Clean icon (brand colour) + heading + description in open grid.
Feels authentic, not template-generated.

CTA: remove warm bg, use default surface with subtle divider above.
Heading in display3, understated placement between testimonials and FAQ.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-31 21:18:54 +11:00
ad589b9870 Increase hero gradient for text readability
Top: 35% → 55% opacity (darker reading zone for white text)
Middle: 15% → 10% at 60% (landscape stays vibrant)
Bottom: 40% → 30% (lighter, less needed with dark landscape)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-31 20:49:07 +11:00
f255e8f26e Add top padding to discover section to clear FuneralFinder overlap
pt: 6→20 (xs), 10→24 (md) so "See what you'll discover" heading
sits below the finder card, not underneath it.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-31 20:45:24 +11:00
b2f0d8af5c Stack hero content vertically: heading → subheading → finder
Hero flex-direction: row → column so finder sits below the text,
centred, with bottom half overlapping into the white section.
Matches reference layout: text on image, finder straddles boundary.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-31 20:42:25 +11:00
ecf7a13e1d Move FuneralFinder inside hero section, overlapping into white below
- FuneralFinder now renders inside the hero Box (V2 only)
- mb: -18 pulls the next section up so finder straddles hero/content
- No more white gap between hero image and finder
- V1 standalone finder preserved with conditional render

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-31 20:31:53 +11:00