Four new preferences, all in settings.js / applied via applyTheme() so
boot and live changes go through one path:
- fontScale (small/default/large): scales root font-size (92/100/115%);
the whole stylesheet is already rem-based so this alone rescales
everything.
- reduceMotion: an explicit in-app override alongside the existing
`prefers-reduced-motion` OS check, via a new
:root[data-reduce-motion="true"] rule in tokens.css mirroring the
existing media-query kill-switch. New prefersReducedMotion() helper
(checks both) replaces the three hand-rolled matchMedia checks in
router.js/Card.js/PokemonDetail.js.
- defaultRoute (dex/team/search): redirects on a genuinely hash-less
launch only (bookmark, home-screen icon, bare URL) — explicit nav
(e.g. tapping "Dex") is never touched, since it's applied once in
main.js before initRouter runs.
- haptics: a short navigator.vibrate() pulse on the same catch/seen/
favorite toggles that already play the pop animation, via a new
lib/haptics.js buzz() (no-ops without Vibration API support, e.g. iOS
Safari).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017Ve7HLspzeG2xDPtJQ8vmu
- Router uses the View Transitions API to cross-fade placeholder -> content
on navigation (falls back to a plain swap where unsupported or when the
user prefers reduced motion)
- Shaped shimmer skeletons for the Pokémon / move / item detail pages
(src/components/skeletons.js) so there's no layout shift on load
- Views fade+rise in; progress ring draws its arc from empty on mount;
caught / seen / favourite toggles pop when switched on
- Offline indicator pill (online/offline events) + 'Back online' toast
- All new motion gated behind prefers-reduced-motion
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
- Card sprite sits centred in the upper area (flex:1 + place-items:center)
instead of a forced margin; sprite-style / boxed sizing moved onto the
img so it stays centred
- .card__ghost number nudged to top: 2px
- Feed Back-navigation restores the raw scroll offset again (dropped the
card-anchor approach); keeps manual scrollRestoration + retry-on-reflow
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
- Feed remembers the opened card (ui.feedAnchor) and, on Back, scrolls that
exact card just below the sticky header via scrollIntoView + a computed
scroll-margin-top; re-corrects on webfont load and as off-screen cards
render their real height, but yields once the user scrolls
- history.scrollRestoration = 'manual' so the browser doesn't fight it;
per-session scroll memory cleared on cold launch
- Cards: ghost number nudged off the top edge; sprite dropped 10px (flex
column grows the card, so nothing overlaps); intrinsic size bumped to match
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
- FlavorText: shows a version pill toggle (Sword/Shield, Scarlet/Violet…)
when the two entries differ, sliding between them; collapses identical
entries; falls back to the newest English entry, captioned
- Switching games while viewing a Pokémon now rebuilds the detail page
(router.rerender wired from a settings subscription in main.js) so
flavour text, learnset, matchups, evolution, abilities, locations and
era sprites all follow the newly selected game
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
