Found by driving Firefox 158 with real pointer, wheel and key input.
- Time picker wheels used padding to reach the last rows. Firefox leaves
bottom padding out of the scrollable area, so the last rows were
unreachable and the 24H/AM/PM wheel could not scroll at all. Spacer
pseudo-elements replace the padding.
- Wheels can now be dragged with a mouse or pen, with inertia, a rubber-band
at the ends and a spring back. Touch is left to the platform.
- Theme changes no longer use a page-wide view transition. The snapshot
could not blur what sits behind frosted glass, so every frosted surface
went clear for the length of the cross-fade.
- Dark shadows were invisible: black on a near-black canvas, with a deep
negative spread tucking the blur under the element. The dark canvas is
lifted, the shadows are stronger and the spreads milder.
- Same-page links now travel (scroll-behavior: smooth, motion permitting).
- data-nv-tristate: a checkbox that cycles unchecked, checked, partial; the
browser can display a partial state but a click can never choose it.
- Button groups show their pressed segment.
GUIDELINES.md gains the cross-engine rules these defects taught, and makes
Firefox the first browser to verify in.
check.py, build.py and build.py --check pass.
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
A button with aria-pressed="true" inside .nv-button-group is now drawn
pressed into the surface in the brand colour, so the appearance toggle and
any segmented choice show which option is in use. Previously no state was
visible.
Checked the four example apps in the reworked light theme.
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Theme: light is a dimmer brand-tinted stone with deeper shade, so it reads
as the same material as dark; every neutral now carries --nv-brand in both
appearances. Native controls (accent-color, caret-color) take the brand.
Time picker: 24-hour by default; data-nv-format-toggle adds a third wheel
of 24H / AM / PM. Swiping it rebuilds the hour wheel for the new format.
The selection lens is a raised glass bar, not a flat band.
Motion: drum effect on the wheels as a scroll-driven animation, with a
script fallback for engines without it (Firefox); rubber-band at both ends
of a wheel that springs back; calendar months slide locally instead of via
a page-wide transition; a chosen day springs into place.
Firefox: wheel notches arrive in lines, not pixels, which made the
rubber-band invisible; deltaMode is now normalised. The selected-day pop
no longer plays on page load.
Also: hover only inside @media (hover: hover) on the slider, the Glaze
inner glow is a token, and the focus note in GUIDELINES.md is corrected
(popovers do not trap focus). SPDX identifier added to niveus.js.
check.py, build.py and build.py --check pass.
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Glaze is glass with a dial: --nv-glass-frost (0 clear .. 1 heavy) moves
backdrop blur, tint and saturation together, read where the surface is
drawn so any subtree or slider can change it. A masked rim and a specular
bloom follow the pointer via niveus.js; without it the light sits at its
default and the material still reads. Falls back to the elevated solid
under reduced transparency or without backdrop-filter.
New components: .nv-slider (binds to a token with data-nv-var),
.nv-calendar, .nv-timepicker (24-hour by default, optional 24H / AM/PM
switch, value always HH:MM), and .nv-picker with .nv-menu--listbox (search,
type-ahead, keys). All render without niveus.js except where noted.
GUIDELINES.md is the normative rulebook for people and AI agents.
check.py, build.py and build.py --check pass.
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Tokens
- --nv-color-glow role (light and dark) and a glow scale: --nv-glow-sm/md/lg,
--nv-glow-blur-*, --nv-glow-spread-*, --nv-glow-strength
- --nv-stagger (0ms under reduced motion) and --nv-duration-shimmer
Components
- Card: --lit (lit top edge in --nv-card-tint), --glow, --spotlight
(light follows the pointer); light layers combine with every elevation
- Tile: small raised key for a glyph or product mark; --solid, --glow, sizes
- Avatar: raised disc with --ring / --glow, sizes, __status, avatar group
- Stat: readings set into one recessed well (.nv-stat-group)
- Steps: markers set into a rail; done steps light their stretch; vertical
- Deck: one surface in front of stacked layers of its kind
- Skeleton: recessed placeholder with a slow sweep, still under reduced motion
- Text: .nv-text-lit and .nv-text-lit--accent
Continuity
- .nv-reveal / .nv-reveal-group: content arrives once as it scrolls into view
(nv-arrive keyframe); niveus.js marks pending state, so nothing is hidden
without the script or under reduced motion
- niveus.js tracks the pointer for .nv-card--spotlight
README and REFERENCE document every new class, token and attribute;
tools/check.py passes and dist/ is rebuilt.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Niveus read flat: thin sheens, short shadows, opaque grey chrome and a
painted canvas. This retunes values and component internals only; every
class and token name is unchanged, so existing pages pick it up as is.
- Canvas: a faint accent light falls across the page, so translucent
layers have something to show through.
- Surfaces: the surface sheen runs the full height (lit top, shaded
foot); raised and filled sheens, highlights and bevels are stronger;
the elevation scale is deeper and softer.
- Translucency: cards, dialogs, the sidebar and tab tracks let some of
the canvas through, with blur so busy grounds never read as texture;
frosted and glass materials are clearer with more blur.
- Filled buttons give off a soft glow of their own color.
- Light fields are paper instead of grey wells that looked disabled.
- Fixes: navigation bars wrap and lists scroll inside them instead of
overflowing the page on phones; choice labels sit at control size;
disabled ghost buttons no longer grow a filled well; the color-swatch
rule is split so neither engine drops it.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_019iMUTHrD8K9CSuHqsanje9
fonts/static/ holds Instrument Sans (with italics) and JetBrains Mono at
400, 500, 600 and 700 as plain TrueType files. The stylesheet keeps using
the variable woff2 files; native toolkits and font configurations often
register a variable font as a single Regular style, and pick weights by
name rather than by axis.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
It had been warmed together with the canvas by mistake; pressed surfaces
are meant to sit between hover and inset, as before.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Bevelled controls with light falling across them, fields as wells, solid
windows, and glass kept for the chrome that floats over everything else.
Warm graphite in dark, soft paper in light, one brand color driving both.
Ships its own fonts (Instrument Sans, JetBrains Mono; OFL).
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>