LoveFusion:
- Swapped sides per request: love (was heart) now enters from the
left, envelope from the right, converging at center.
- Retimed the crossfade so opacity/scale start dropping the instant
they reach center instead of dwelling there fully-opaque and
overlapping - the previous timing had a visible window where the
heart span rendered on top of the envelope span (DOM order stacking)
before either had faded, which read as a glitch rather than a merge.
- The white flash now ramps up in sync with that fade (bigger too:
w-8 base, larger blur/spread, peak scale 2.4 vs 1.8) so it's already
bright enough to mask the crossing before the two glyphs are fully
gone, then blooms back out into the merged emoji.
- Wordmark text ("love"/"envelope"/"lovelope.app") now renders in
Hachi Maru Pop (next/font/google), scoped to this component only -
the app's Bricolage Grotesque display font elsewhere is untouched.
Favicon:
- Replaced the envelope-outline SVG mark with 💌 on the same pink
rounded-square backdrop, moved from public/icon.svg to
src/app/icon.svg (Next's file-based icon convention, so it's
auto-linked as <link rel="icon">). Tried next/og's ImageResponse
first but it hit a Windows-specific "Invalid URL" bug in the
Next 14.2.35-bundled @vercel/og font loader; a static SVG sidesteps
it entirely and is simpler besides. manifest.webmanifest already
pointed at /icon.svg so no change needed there - same URL, new
source file.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Pulled from the ui-styling skill's canvas-fonts pack (both OFL-licensed,
license files kept alongside in src/fonts/) instead of next/font/google,
per explicit choice to use the skill's bundled assets rather than a
Google Fonts pairing.
- Display (headings): Bricolage Grotesque (Regular + Bold) - warmer,
more distinctive than Poppins while keeping the same bold/rounded
energy for the "adorable" branding.
- Body: Instrument Sans (Regular/Italic/Bold/BoldItalic) - clean at
form-field sizes.
- CSS variables renamed --font-inter/--font-poppins -> --font-sans/
--font-display (decoupled from the specific font choice); updated
in tailwind.config.ts and layout.tsx. Removed the redundant static
fallback declarations in globals.css - next/font's `variable`
option already injects these via the <html> className.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Swaps min-h-screen -> min-h-[100dvh] across all five screen states
(expired, key-missing, loading, answered, reveal) so mobile browser
chrome (address bar) doesn't clip full-bleed gradient screens.
Bottom padding on the main content column now respects
env(safe-area-inset-bottom) for iOS home-indicator devices.
This page intentionally keeps its own theme.* driven styling
(cardBg/cardBorder/textPrimary/buttonGradient from lib/themes.ts)
rather than shadcn Card/Button — those tokens ARE the per-proposal
color set this refactor was told to preserve exactly, so wrapping
them in the shadcn primitives would fight the dynamic theming
instead of composing with it.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
ProposalForm:
- Step tabs -> Radix Tabs (roving tabindex, arrow-key nav, proper
ARIA) driven by the same `step` state as before.
- Evasive-no toggle -> Switch, wrapped in a <label> so the whole row
(not just the small control) is tappable.
- All raw <input>/<textarea> -> Input/Textarea; buttonVariants
'primary' -> 'default' to match the new variant names.
- New StepActions wrapper makes Back/Next/Publish sticky to the
viewport bottom on mobile (safe-area aware) so the wizard never
requires scrolling to find the next action; reverts to normal
inline flow at sm+.
CreateClient / ManageClient:
- Card/Button/Input swapped to shadcn equivalents.
- Copy-link feedback moved from a per-button `copied` boolean +
setTimeout to a single sonner toast call, removing the duplicated
state pattern.
- ManageClient's delete confirmation moved from window.confirm() to
an AlertDialog, matching the skill's accessible-primitives guidance
and giving it proper focus trapping on mobile.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
- Field.tsx re-added composing shadcn Label (no built-in equivalent
in this CLI generation).
- Bumped Input/Textarea to h-12/rounded-xl/px-4 (44px+ touch targets,
matches the app's existing rounded, roomy input style).
- Card padding restored to the old flat p-5 sm:p-6 default so most
call sites (`<Card>children</Card>`) don't need CardContent
wrapping; CardHeader/Content/Footer still exported for the few
structured cards.
- Swapped literal pink-500/gray-100 focus/border colors for
text-primary / border-border / ring-ring tokens in Footer and
CalendarButtons so brand color flows from the CSS vars.
- min-h-screen -> min-h-[100dvh] on full-bleed screens (home,
create, not-found) so mobile browser chrome doesn't clip content.
- Responsive type scale (text-4xl sm:text-5xl md:text-6xl, etc.)
instead of a single jump at md:, so headings don't overflow on
narrow phones.
- Root layout now mounts <Toaster> and uses bg-background/
text-foreground (background token matches the previous gray-50).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Pinned the CLI to shadcn@2.3.0 rather than the latest (4.16.0): the
latest generation targets Tailwind v4-only syntax (bare-value parens
like `gap-(--card-spacing)`, the `in-*` variant, `--spacing()`) that
silently fails to compile under this project's Tailwind v3.4.6.
2.3.0 is the last CLI generation producing classic hsl(var(--x))
v3-compatible component output.
Swapped @radix-ui/react-icons for the already-installed lucide-react
in dialog.tsx, and dropped sonner's next-themes dependency (the app
has no dark-mode toggle, so Toaster is hardcoded to theme="light").
Old custom src/components/ui/Button.tsx, Card.tsx, and Field.tsx are
removed here; call sites are updated in the following commits.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Adds components.json, cn() util, Radix + cva/clsx/tailwind-merge/
lucide-react/sonner deps, and CSS-variable color tokens mapped onto
the brand's existing pink-500 primary (#ec4899) and neutral grays.
`shadcn init` defaulted to Tailwind v4-style output (oklch colors,
`@theme`-driven CSS, `tw-animate-css`) without updating
tailwind.config.ts, which would not have compiled against the
project's pinned Tailwind v3. Hand-wrote the classic v3 integration
instead (HSL vars + tailwind.config.ts color/radius mapping +
tailwindcss-animate) rather than pull in an unplanned Tailwind
major-version migration.
Also drops the sunset/neon/pastel raw color scales from
tailwind.config.ts: grep confirmed no class ever referenced them,
they were leftover from before lib/themes.ts.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Captures the existing lovelope.app codebase (Next.js App Router,
custom Tailwind components, Prisma) as a rollback point prior to
adopting shadcn/ui and a mobile-first redesign.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
jeanGaston