| Commit message (Collapse) | Author | Age | Files | Lines |
|---|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
The setting previously only gated the fly slide in Root.svelte.
Renaming the label to "Reduce motion" sets the expectation that it
acts as a force-on for the browser's prefers-reduced-motion: reduce
across the board, so the setting's scope is broadened to match.
Storage key (displayDisableAnimations) stays the same so existing
user preferences carry over. Only the i18n label and behavior scope
change.
Adds a reducesMotion() helper that combines the media query with
the setting. View Transitions, Lenis init, and the details JS
animation now all bypass via this helper. A reactive $: toggles
html.reduce-motion on the root element based on the setting; the
normalise.css bandaid that already collapsed animations under
prefers-reduced-motion is duplicated under that class so every CSS
animation and transition (Svelte fly, dropdown panels, hamburger
morph, header scroll-hide, the global :where transitions) snaps to
0.01ms when the setting is on.
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
Wires SvelteKit's onNavigate hook into document.startViewTransition,
with a callback that bypasses cleanly when the API is unavailable or
the user prefers reduced motion.
Direction is computed from navigation.from/to.pathname using the same
navigationOrder logic as the existing fly slide (forward through the
ordered routes, backward otherwise; entering /user is +1, leaving
-1). Sign is written to --vt-direction on :root before the transition
fires.
::view-transition-old(root) and -new(root) get explicit slide
keyframes that read --vt-direction as a sign multiplier on
translateX(200px), replacing the browser default crossfade with a
direction-aware page-flip that matches the prior feel.
.header carries view-transition-name: app-header so it is pulled out
of the root snapshot and treated as a shared element. Since the
header lives outside the {#key data.url} block and is the same DOM
element on both sides, its morph is a visual no-op: only the body
slides past it instead of the whole viewport.
Svelte's existing fly transition in Root.svelte still runs hidden
beneath the snapshot for browsers without View Transitions support,
acting as a graceful fallback.
|
| |
|
|
|
|
|
|
|
|
|
|
|
| |
A surface audit of commit 963d6356 (which narrowed the universal *
transition rule) identified two genuine regressions: .button-badge
and .badge-info, both <span> chip styles in src/styles/badge.css.
Their :hover changes background-color, which the global * rule used
to animate but the narrowed :where() list did not catch.
Adds them to the :where() list. All other state-change surfaces
audited either still match the existing selectors (anchors, buttons,
form controls, cards, ARIA roles) or have their own explicit
transition rule (covers, tool cards, badge wall, previews).
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
Adds src/styles/_breakpoints.scss with five canonical tokens
(\$bp-sm 600, \$bp-md 800, \$bp-lg 1024, \$bp-xl 1280, \$bp-2xl 1600)
and migrates all 15 @media (max-width: ...) occurrences across 9 files.
Configures vite.config.ts with scss loadPaths so any file can
@use "breakpoints" without relative paths.
Conservative rounding-up where existing values were near-duplicates:
500 and 512 collapse to 600, 768 collapses to 800, 1000 collapses to
1024. Slightly more viewports get the smaller-layout treatment in
those bands, which is usually beneficial on cramped widths.
Converts 7 Svelte files from <style> to <style lang="scss"> to access
the SCSS tokens. SCSS is a CSS superset, so existing rules stay valid.
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
The existing --base0011 glass tint is #ffffff80 / #0c0c0c80 (50%
alpha), which is unusually transparent for floating UI. The desktop
header and the mobile hamburger sit over scrolling content, so the
content bleeds through and reads as distracting.
Introduces --base0011-strong at #ffffffcc / #0c0c0ccc (80% alpha) for
floating chrome. The backdrop blur still has enough content to soften,
but the surface now reads as grounded rather than barely-present.
Applied to: desktop .header background, mobile toggle background and
hover, mobile open panel background. Other glass cards (CommandPalette
dropdown, Dropdown component content, tooltips, hover covers) keep the
softer --base0011 since they sit over relatively static surfaces and
the see-through effect there is not distracting.
|
| |
|
|
|
|
|
|
|
|
|
|
|
| |
Adds 0.24s between --duration-fast (0.15s) and --duration-slow (0.4s)
for animations that live in the touch-UI floor: panels, sheets,
drawers, modals. 150ms reads as crisp on desktop but undershoots the
200-300ms range touch UI conventions prescribe (finger occludes the
target during the tap, deliberation pace is slower, and high-DPI
displays compress small translateY into less perceptible motion).
Applies the new token to the mobile hamburger panel open/close
transition and to the bar-morph that fires on the same tap, so the
bars and the panel finish arriving together.
|
| |
|
|
| |
This reverts commit b429cf8d3b566a6ec665cd4f2ec34f55c3138179.
|
| |
|
|
|
|
|
|
| |
Inputs, buttons, and selects baseline at 32px (2em), well below WCAG
2.5.5's 44x44 minimum. Adds a coarse-pointer media block that lifts
the standard height to 2.75rem, neutralises aggressive 0.75 scale on
.smaller-button / .button-square (transforms shrink hit-test rects),
and grows the checkbox from 1.15em to 1.5rem.
|
| | |
|
| |
|
|
|
|
|
|
|
|
|
| |
Introduce --shadow-card, --shadow-card-emphasized, --shadow-cta,
--scrim, --scrim-soft, and --scrim-banner. Migrate 14 inline
literals (card.css, input.css, Notification, MediaRoulette, the
two Landing CTA buttons, the popup overlay, the palette and
roulette scrims, three identity banners, the user profile cover
art shadow) onto the tokens, with light/dark adaptation handled
by the existing prefers-color-scheme blocks instead of duplicated
inline. Two single-use Landing demo-focus values stay inline.
|
| |
|
|
|
|
|
|
|
|
|
| |
Strip backdrop-filter: blur(4px) from the base .card so the ~50
in-flow surfaces (landing panels, schedule rows, tool cards, user
profile cards, badge wall, etc.) stop paying for a blur they don't
need. Introduce .card-glass for the surfaces that actually float over
other content: the sticky page header, header nav dropdowns, command
palette, title-attribute tooltips, LinkedTooltip, and HoverCover.
Popup, MediaRoulette, and Notification keep their existing
parent-overlay or solid-background treatments.
|
| |
|
|
|
|
|
|
|
| |
Replace the * { transition: color/bg/border/shadow } rule with a
:where() list of the surfaces that actually receive state changes
(anchors, buttons, form controls, cards, details/summary, role=button,
role=menuitem, role=option). Every element no longer pays the
transition (especially box-shadow, the costly one) on theme switch or
parent re-paint.
|
| |
|
|
|
|
| |
Add border-radius: 4px to the global :focus-visible rule so the ring
looks consistent on bare anchors and header items, not just on
elements that already carry their own radius.
|
| |
|
|
|
|
|
| |
Add a global reduced-motion media query that collapses animation and
transition durations and disables smooth scroll. Skip Lenis init when
the same preference is set so the JS-driven smooth scroll falls back to
the browser default, which the spec already honours.
|
| |
|
|
|
|
|
| |
Replace `a:focus { outline: none }` with `:focus { outline: none }` +
`:focus-visible { outline: 2px solid var(--base0D); outline-offset: 2px }`
so keyboard users see focus on every interactive element while mouse
clicks stay clean.
|
| |
|
|
| |
Add --ease-out-quart, --ease-in-out-quart, --duration-fast, --duration-slow in motion.css and migrate the global anchor, header, and theme-switch transitions to use them. Establishes a shared motion vocabulary for future polish.
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| |
|