whisper-money/resources/js/components
Víctor Falcón 98f03db50c
fix(landing): keep the header from overflowing at mid widths (#791)
## What

The Roadmap item pushed the landing header past the viewport on narrow
laptops: the logo wrapped onto two lines and, in Spanish, the register
button was clipped off screen (at 640px the nav needed 670px).

Between `sm` and `lg` the nav is now icon-only and tighter:

- Roadmap / Github / Discord keep their labels only from `lg` up. The
label stays `sr-only` instead of `display:none`, so the icons keep their
accessible name — before this they announced as "link", "link 1096",
"link". The GitHub star count stays visible at every width.
- Button padding, nav gap and the wordmark size all step down below
`lg`, which is what buys back the room Spanish needs. At 640px the nav
now ends on the 24px page padding instead of 10px past it, with 22px of
air between logo and nav.
- The logo gets `shrink-0` + `whitespace-nowrap`, so it can no longer
wrap.

## Also

- The logo links back to the landing page on every page but the landing
itself (the page is detected by URL, so `?ref=` links behave). Before
this, a phone visitor on `/roadmap` had no way back other than the
browser's back button.
- The mobile pill header drops its Github/Discord buttons and separator:
they were `hidden … sm:flex` inside a `sm:hidden` header, so they could
never render.
- The three nav buttons collapse into a local `NavButton`, so the
breakpoint lives in one place instead of three.

## QA

Browser QA against the dev server on `/` and `/roadmap`, in Spanish (the
longest of our strings) and English, at 390 / 640 / 672 / 1024 / 1280:

- 640px es: no horizontal overflow, right padding intact, nothing
clipped.
- 1024px+: labels are back, layout unchanged from today.
- 390px: the mobile pill is untouched.
- Logo click on `/roadmap` navigates to `/`; on `/` it renders as a
plain `div` in both headers.

Unit tests cover the logo routing branch. The responsive band itself is
visual-QA only — jsdom cannot evaluate Tailwind breakpoints, and a
className assertion would be brittle.

## Demo

<!-- PLACEHOLDER: drag the screenshots here (390 / 640 / 672 / 1280,
Spanish) -->
2026-08-12 15:47:03 +02:00
..
accounts feat(budgets): count shared accounts at the owner's percentage (#786) 2026-08-12 12:47:43 +02:00
automation-rules fix(security): scope job-status endpoints to owner + feature-area fixes (#627) 2026-07-03 14:49:32 +02:00
budgets feat: add catch-all budgets (#527) 2026-06-15 16:07:19 +00:00
cashflow feat(analysis): per-category 12-month spending drawer (#519) 2026-06-11 09:52:53 +02:00
categories refactor(frontend): call backend routes through Wayfinder instead of literal URLs (#772) 2026-08-11 13:26:10 +00:00
charts feat(cashflow): expand income categories and fix Sankey label overlap (#672) 2026-07-13 07:28:14 +00:00
dashboard refactor(frontend): call backend routes through Wayfinder instead of literal URLs (#772) 2026-08-11 13:26:10 +00:00
icons Subscriptions (#15) 2025-12-06 19:09:56 +01:00
integration-requests feat(integration-requests): add done status and fix review command crash on orphaned author (#601) 2026-06-27 14:42:09 +00:00
labels refactor(js): use InputError for inline form errors (#483) 2026-06-03 19:01:21 +02:00
landing feat(landing): stop auto-redirecting signed-in visitors to the dashboard (#777)a 2026-08-11 14:02:18 +00:00
onboarding fix(observability): stop our own page navigations from reporting fake network errors (#780) 2026-08-11 16:12:00 +00:00
open-banking feat: reuse the upgrade modal at more upsell points and attribute revenue (#699) 2026-07-18 12:53:20 +00:00
partials fix(landing): keep the header from overflowing at mid widths (#791) 2026-08-12 15:47:03 +02:00
shared refactor(settings): move the last two settings tables onto the shared table and hook (#775) 2026-08-11 13:54:18 +00:00
subscription feat(subscriptions): end the trial experiment and make the trial length per plan (#762) 2026-08-12 10:59:55 +02:00
transactions fix(observability): stop our own page navigations from reporting fake network errors (#780) 2026-08-11 16:12:00 +00:00
ui fix(dashboard): render negative net worth as a downward bar (#722) 2026-07-22 09:32:18 +00:00
alert-error.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
app-content.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
app-error-boundary.test.tsx fix(ui): show a recoverable screen instead of a blank page when render throws (#758) 2026-08-10 15:02:39 +00:00
app-error-boundary.tsx fix(observability): stop our own page navigations from reporting fake network errors (#780) 2026-08-11 16:12:00 +00:00
app-logo-icon.tsx refactor(encryption): strip client-side transaction encryption (#514) 2026-06-20 16:13:26 +00:00
app-logo.tsx Add animated logo icon that transitions based on encryption key state 2025-12-12 11:24:42 +01:00
app-shell.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
app-sidebar-header.tsx fix: keep iOS content below the notch (#280) 2026-04-13 13:59:05 +01:00
app-sidebar.tsx fix: move community link to user menu (#442) 2026-05-27 17:39:26 +02:00
appearance-tabs.tsx feat: Spanish localization (#74) 2026-02-08 11:58:08 +01:00
bank-logo.tsx feat: Integrate EnableBanking as open banking provider (#106) 2026-02-12 09:09:28 +01:00
breadcrumbs.tsx feat: Spanish localization (#74) 2026-02-08 11:58:08 +01:00
delete-user.tsx fix(account): block deletion while subscription or trial is active (#531) 2026-06-14 20:46:44 +02:00
encryption-key-button.tsx feat: Spanish localization (#74) 2026-02-08 11:58:08 +01:00
heading-small.tsx Add Budgeting Feature to Track and Manage Spending (#36) 2026-01-21 15:25:50 +01:00
heading.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
icon.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
input-error.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
mobile-back-button.tsx fix(haptics): use a local WebHaptics wrapper (#225) 2026-03-16 11:26:04 +00:00
nav-footer.tsx feat: Spanish localization (#74) 2026-02-08 11:58:08 +01:00
nav-main.tsx fix(haptics): use a local WebHaptics wrapper (#225) 2026-03-16 11:26:04 +00:00
nav-user.tsx feat(integration-requests): community board to request & vote bank integrations (#550) 2026-06-17 12:50:51 +00:00
pro-badge.tsx feat(mcp): read-only MCP server for Pro accounts (#689) 2026-07-17 16:54:15 +02:00
sortable-grid.test.tsx fix(accounts): stop second long-press haptic on drag handle (#578) 2026-06-22 11:20:57 +02:00
sortable-grid.tsx fix(accounts): stop second long-press haptic on drag handle (#578) 2026-06-22 11:20:57 +02:00
support-dialog.tsx feat(support): add support link with community-first help modal (#542) 2026-06-16 13:16:04 +02:00
text-link.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
two-factor-recovery-codes.tsx feat: Spanish localization (#74) 2026-02-08 11:58:08 +01:00
two-factor-setup-modal.tsx feat: Spanish localization (#74) 2026-02-08 11:58:08 +01:00
unlock-message-dialog.tsx feat(auth): show/hide toggle on password fields (#499) 2026-06-06 11:42:20 +02:00
user-info.tsx feat: Update facehash and enable blink 2026-02-24 15:54:49 +01:00
user-menu-content.test.tsx feat(feedback): move feedback and roadmap links from Canny to UserJot (#748) 2026-08-10 06:54:21 +00:00
user-menu-content.tsx feat(feedback): move feedback and roadmap links from Canny to UserJot (#748) 2026-08-10 06:54:21 +00:00