@mkbabb/glass-ui 3.7.0 → 3.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/CardAction-q2qHCJFG.js +157 -0
- package/dist/{CommandShortcut-CY0aQTz5.js → CommandShortcut-SzWRhROC.js} +2 -2
- package/dist/{ContextMenuSubContent-BeDz7G6f.js → ContextMenuSubContent-Do977Cbf.js} +1 -1
- package/dist/{DataTable-gtPOLZvl.js → DataTable-CvlWXz65.js} +3 -3
- package/dist/DeckProgress-AVgbIULY.js +23 -0
- package/dist/{DialogContent-DG1YMR-P.js → DialogContent-DjZWT3lK.js} +2 -2
- package/dist/{DialogFooter-BCIaDP15.js → DialogFooter-Gprw8H_A.js} +1 -1
- package/dist/{DiscoGlyph-ZoBYpoxI.js → DiscoGlyph-CG0F410s.js} +1 -1
- package/dist/{GlyphFace-Ce_oe3tM.js → GlyphFace-DRjDkB0s.js} +1 -1
- package/dist/{HoverPopover-DXpOEw1P.js → HoverPopover-D56O6Ylp.js} +1 -1
- package/dist/{IconTooltip-Cu86JR4e.js → IconTooltip-D2T5nYOM.js} +1 -1
- package/dist/{MetricBadge-D-bRaQUD.js → MetricBadge-lTc002u2.js} +1 -1
- package/dist/{Notification-B5WHP3_1.js → Notification-BxK8LZMw.js} +1 -1
- package/dist/{PopoverContent-F1bWnYoh.js → PopoverContent-BId6ggf_.js} +1 -1
- package/dist/{Progress-c4vo4ALi.js → Progress-iEuD9pxG.js} +4 -4
- package/dist/{ScrollingText-BEp377U5.js → ScrollingText-CVyqxvfv.js} +2 -2
- package/dist/{SelectScrollDownButton-DAo5NmY_.js → SelectScrollDownButton-C7TRe-ep.js} +2 -2
- package/dist/{ToggleGroupItem-C-AIkBUw.js → ToggleGroupItem-CkXUcBlt.js} +1 -1
- package/dist/{UnderlineTabs-D_c1iYo-.js → UnderlineTabs-Uxn-R3MT.js} +2 -2
- package/dist/animated-digit.js +2 -2
- package/dist/api/index.d.ts +4 -2
- package/dist/api.js +1 -1
- package/dist/aurora.js +336 -405
- package/dist/canvas.d.ts +1 -0
- package/dist/canvas.js +3 -0
- package/dist/card.js +1 -1
- package/dist/carousel.js +105 -104
- package/dist/collapsible.js +1 -1
- package/dist/{color-DjJCAQ6f.js → color-DMLTunJK.js} +22 -14
- package/dist/color.js +2 -2
- package/dist/command.js +1 -1
- package/dist/compile-BBTRjvQS.js +158 -0
- package/dist/components/custom/aurora/composables/atoms.d.ts +90 -25
- package/dist/components/custom/aurora/composables/color.d.ts +0 -12
- package/dist/components/custom/aurora/composables/uniformBridge.d.ts +34 -23
- package/dist/components/custom/aurora/constants/presets.d.ts +10 -7
- package/dist/components/custom/aurora/constants/renderMode.d.ts +22 -0
- package/dist/components/custom/aurora/constants/shaders/aurora.wgsl.d.ts +1 -1
- package/dist/components/custom/aurora/constants/shaders/brush.glsl.d.ts +1 -1
- package/dist/components/custom/aurora/constants/shaders/composition.glsl.d.ts +1 -1
- package/dist/components/custom/aurora/constants/shaders/mediums.glsl.d.ts +1 -1
- package/dist/components/custom/aurora/index.d.ts +3 -3
- package/dist/components/custom/constellation/Constellation.vue.d.ts +40 -5
- package/dist/components/custom/constellation/constellationField.d.ts +110 -5
- package/dist/components/custom/constellation/index.d.ts +2 -2
- package/dist/components/custom/dock/GlassDock.vue.d.ts +12 -4
- package/dist/components/custom/dock/composables/dockMorphContext.d.ts +57 -0
- package/dist/components/custom/dock/composables/index.d.ts +3 -0
- package/dist/components/custom/dock/composables/useDockHold.d.ts +61 -0
- package/dist/components/custom/dock/composables/useLayerTransition.d.ts +13 -59
- package/dist/components/custom/dock/index.d.ts +2 -0
- package/dist/components/custom/goo-blob/GooBlob.vue.d.ts +13 -0
- package/dist/components/custom/goo-blob/composables/useBlobMood.d.ts +4 -0
- package/dist/components/custom/goo-blob/composables/useBlobPointer.d.ts +2 -0
- package/dist/components/custom/goo-blob/composables/useBlobSatellites.d.ts +2 -0
- package/dist/components/custom/goo-blob/composables/useMetaballRenderer.d.ts +20 -5
- package/dist/components/custom/goo-blob/index.d.ts +1 -1
- package/dist/components/custom/goo-blob/shaders/sdf-body.glsl.d.ts +1 -1
- package/dist/components/custom/goo-blob/shaders/watercolor-edges.glsl.d.ts +2 -2
- package/dist/components/custom/goo-blob/types.d.ts +8 -0
- package/dist/components/ui/card/Card.vue.d.ts +23 -7
- package/dist/components/ui/card/index.d.ts +1 -1
- package/dist/components/ui/progress/ProgressDefault.vue.d.ts +14 -4
- package/dist/components/ui/slider/Slider.vue.d.ts +3 -1
- package/dist/composables/color/index.d.ts +19 -0
- package/dist/composables/dom/index.d.ts +1 -1
- package/dist/composables/dom/useResolveTokenColor.d.ts +27 -0
- package/dist/composables/glass/canvas2d/index.d.ts +2 -1
- package/dist/composables/glass/canvas2d/resolveCanvasColor.d.ts +20 -0
- package/dist/composables/glass/canvas2d/useCanvas2D.d.ts +15 -1
- package/dist/composables/glass/index.d.ts +3 -1
- package/dist/composables/glass/useSpecularTracking.d.ts +33 -0
- package/dist/composables/glass/webgl/createCanvasLifecycle.d.ts +1 -1
- package/dist/composables/glass/webgl/shaders/procedural-color.glsl.d.ts +4 -0
- package/dist/composables/glass/webgl/useWebGLCanvas.d.ts +1 -1
- package/dist/composables/motion/core/index.d.ts +1 -0
- package/dist/configurator.js +1 -1
- package/dist/confirm-dialog.js +1 -1
- package/dist/constellation.js +144 -75
- package/dist/context-menu.js +2 -2
- package/dist/controls.js +2 -2
- package/dist/dark.js +1 -1
- package/dist/data-table.js +1 -1
- package/dist/deck-progress.d.ts +1 -0
- package/dist/deck-progress.js +2 -0
- package/dist/dialog.js +2 -2
- package/dist/disco-glyph.js +1 -1
- package/dist/dock.js +386 -285
- package/dist/{dockContext-DLgrVWsU.js → dockContext-BKeIMmNk.js} +1 -1
- package/dist/dom.js +6 -6
- package/dist/{dropdown-menu-BWpwutt0.js → dropdown-menu-B_4bWyyG.js} +2 -2
- package/dist/dropdown-menu.js +1 -1
- package/dist/expandable-container.js +1 -1
- package/dist/fonts/README.md +26 -18
- package/dist/forms.js +3 -3
- package/dist/fourier-field.js +37 -37
- package/dist/glass-carousel.js +12 -7
- package/dist/glass-panel.js +7 -7
- package/dist/glass-ui.css +1 -1
- package/dist/glass-ui.js +150 -162
- package/dist/glyph-face.js +2 -2
- package/dist/goo-blob.js +353 -270
- package/dist/header-ribbon.js +1 -1
- package/dist/hover-card.js +1 -1
- package/dist/hover-popover.js +1 -1
- package/dist/icon-tooltip.js +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/instrument-chassis.js +1 -1
- package/dist/instrument-rail.js +1 -1
- package/dist/keyboard.js +1 -1
- package/dist/{keys-Dyf_uTs5.js → keys-BsYjEFOW.js} +1 -1
- package/dist/label.js +1 -1
- package/dist/labeled-field.js +6 -6
- package/dist/metric-badge.js +1 -1
- package/dist/metric-stack.js +1 -1
- package/dist/motion-core.js +65 -65
- package/dist/motion.js +3 -3
- package/dist/notification.js +1 -1
- package/dist/paper-backdrop.js +1 -1
- package/dist/popover.js +1 -1
- package/dist/progress.js +1 -1
- package/dist/pulse.js +1 -1
- package/dist/reactive.js +2 -2
- package/dist/resolveCanvasColor-BBiYfp8g.js +11 -0
- package/dist/responsive-tabs.js +2 -2
- package/dist/scrolling-text.js +1 -1
- package/dist/search.js +7 -7
- package/dist/select.js +3 -3
- package/dist/separator.js +1 -1
- package/dist/{sheet-Cv1uO-Gq.js → sheet-VZEtNFvO.js} +2 -2
- package/dist/sheet.js +1 -1
- package/dist/slider-D9puf-Ko.js +142 -0
- package/dist/slider.js +1 -1
- package/dist/sortable-list.js +3 -3
- package/dist/styles/components.css +1 -1
- package/dist/styles/dock-controls.css +21 -18
- package/dist/styles/dock.css +415 -224
- package/dist/styles/fonts.css +0 -25
- package/dist/styles/glass.css +100 -41
- package/dist/styles/theme.css +9 -2
- package/dist/styles/tokens.css +139 -32
- package/dist/styles/typography.css +52 -69
- package/dist/styles/utilities.css +2 -1
- package/dist/styles/view-transition.css +12 -40
- package/dist/switch.js +1 -1
- package/dist/tabs.js +5 -5
- package/dist/timeline.js +3 -3
- package/dist/toast.js +1 -1
- package/dist/toggle-group.js +1 -1
- package/dist/tooltip.js +1 -1
- package/dist/typewriter.js +1 -1
- package/dist/{useAnimatedNumber-C5I3wWd8.js → useAnimatedNumber-C_3wZLx4.js} +1 -1
- package/dist/{useCanvas2D-C31yfUGY.js → useCanvas2D-ClrQuZtp.js} +2 -1
- package/dist/{useConfiguratorState-B24TcgIn.js → useConfiguratorState-CMff4GzH.js} +3 -3
- package/dist/useResolveTokenColor-r9pnNjqK.js +24 -0
- package/dist/useSpecularTracking-BVRZsRHA.js +26 -0
- package/dist/{useTextHighlight-aMPdEpkq.js → useTextHighlight-9nMW23Qb.js} +1 -1
- package/dist/{useTouchGate-YQRwyUGU.js → useTouchGate-WFyJYsth.js} +1 -1
- package/dist/vReveal-CqaCz_mC.js +44 -0
- package/dist/watercolor-dot.js +2 -2
- package/package.json +36 -4
- package/src/fonts/README.md +26 -18
- package/src/styles/dock-controls.css +21 -18
- package/src/styles/dock.css +415 -224
- package/src/styles/fonts.css +0 -25
- package/src/styles/glass.css +100 -41
- package/src/styles/theme.css +9 -2
- package/src/styles/tokens.css +139 -32
- package/src/styles/typography.css +52 -69
- package/src/styles/utilities.css +2 -1
- package/src/styles/view-transition.css +12 -40
- package/dist/CardAction-D8nSE62a.js +0 -163
- package/dist/compile-iM4IUB66.js +0 -158
- package/dist/fonts/fraunces/fraunces-latin.woff2 +0 -0
- package/dist/slider-BA9wIs5e.js +0 -130
- package/dist/useViewTransition-DaN5Zrox.js +0 -21
- package/dist/vReveal-BE2TsPoR.js +0 -24
- package/src/fonts/fraunces/fraunces-latin.woff2 +0 -0
- /package/dist/{CollapsibleContent-D7UNsXQr.js → CollapsibleContent-CP9qF1v4.js} +0 -0
- /package/dist/{ContextMenuContent-DGKZX1Du.js → ContextMenuContent-DDa0v27s.js} +0 -0
- /package/dist/{HoverCardContent-Bn0UBMY9.js → HoverCardContent-B6CcQ8He.js} +0 -0
- /package/dist/{Input-DWQQIOC4.js → Input-DVG_J0ne.js} +0 -0
- /package/dist/{InstrumentChassis-BLJBl1BW.js → InstrumentChassis-C2f6cBaQ.js} +0 -0
- /package/dist/{InstrumentRail-BElFwKyt.js → InstrumentRail-CUJ05YVG.js} +0 -0
- /package/dist/{Label-DBc7bKzZ.js → Label-zRfbQdCn.js} +0 -0
- /package/dist/{ModalOverlay-D1VrWyoi.js → ModalOverlay-B1GkAjNb.js} +0 -0
- /package/dist/{PaperBackdrop-DCGoGatv.js → PaperBackdrop-CqwjnfLv.js} +0 -0
- /package/dist/{SelectGroup-BcaFjvP4.js → SelectGroup-BFiod7X2.js} +0 -0
- /package/dist/{SelectSeparator-COFMJGng.js → SelectSeparator-L8pPEn4L.js} +0 -0
- /package/dist/{Separator-DZyqsCum.js → Separator-D7sD7RKj.js} +0 -0
- /package/dist/{Switch-2rsAtDfA.js → Switch-LDKLmmgx.js} +0 -0
- /package/dist/{TabsList-COqIdW7i.js → TabsList-qyHZ2lKY.js} +0 -0
- /package/dist/{Toaster-BMaeziJJ.js → Toaster-CabYEEF_.js} +0 -0
- /package/dist/{TooltipProvider-CD2IXfRv.js → TooltipProvider-CmZzCuaG.js} +0 -0
- /package/dist/{_plugin-vue_export-helper-gLzyemvl.js → _plugin-vue_export-helper-ok8pgSl5.js} +0 -0
- /package/dist/composables/{dom → motion}/useTextHighlight.d.ts +0 -0
- /package/dist/{constants-CS75AWHG.js → constants-BPOqYJAm.js} +0 -0
- /package/dist/{createContext-CvNyBk4o.js → createContext-B44Sah_H.js} +0 -0
- /package/dist/{menuItemVariants-B4eFR5Ix.js → menuItemVariants-DKM85SNE.js} +0 -0
- /package/dist/{presets-BKVyQfbt.js → presets-D1XPuTj-.js} +0 -0
- /package/dist/{prng-wHuHlNHE.js → prng-COGhh02-.js} +0 -0
- /package/dist/{useGlassRenderer-HebgSEgN.js → useGlassRenderer-5I0YkI4t.js} +0 -0
- /package/dist/{useGlobalDark-yhL4Wp-s.js → useGlobalDark-D3EBWzXK.js} +0 -0
- /package/dist/{useIntersectionPause-Cc-H9ees.js → useIntersectionPause-Bj4sPkMh.js} +0 -0
- /package/dist/{useInterval-D3USn0yc.js → useInterval-CcLfq2WU.js} +0 -0
- /package/dist/{useKeyboardShortcuts-Be3w_Rwk.js → useKeyboardShortcuts-BXWXOZ-9.js} +0 -0
- /package/dist/{useResizeObserver-CSyxGxIX.js → useResizeObserver-CWCbk5Px.js} +0 -0
- /package/dist/{useScrollProgress-CAH8Ofwt.js → useScrollProgress-C9ysDic5.js} +0 -0
- /package/dist/{useSortable-C8ReQ50P.js → useSortable-MGAbCGVJ.js} +0 -0
- /package/dist/{useSpringMount-LRZqJTaF.js → useSpringMount-BJSHcLl3.js} +0 -0
- /package/dist/{useTimer-DEJonOZa.js → useTimer-3xqf_54b.js} +0 -0
- /package/dist/{useUserInvalidAria-CQKjEfwP.js → useUserInvalidAria-DoJKMZ3s.js} +0 -0
- /package/dist/{useViewportReady-K96m-Mdv.js → useViewportReady-RIr5Wgkh.js} +0 -0
package/src/styles/fonts.css
CHANGED
|
@@ -141,28 +141,3 @@
|
|
|
141
141
|
U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
|
|
142
142
|
U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
|
143
143
|
}
|
|
144
|
-
|
|
145
|
-
/* ═══════════════════════════════════════════════
|
|
146
|
-
OFL FACE FILES — Fraunces (ornamental display)
|
|
147
|
-
═══════════════════════════════════════════════ */
|
|
148
|
-
|
|
149
|
-
/* Fraunces — Latin subset (basic Latin + ASCII punctuation + common
|
|
150
|
-
diacritics). The FULL variable font: a single woff2 carries wght 100..900
|
|
151
|
-
AND the opsz / SOFT / WONK axes typography.css drives
|
|
152
|
-
(`--font-display-variation-settings: "WONK" 1, "SOFT" 0`). Before AU.W4 the
|
|
153
|
-
`--font-stack-display: "Fraunces"` token (tokens.css:43) had NO shipped face,
|
|
154
|
-
so those axes were SILENTLY INERT (the slipped ship of the grand-audit/AS.W0b
|
|
155
|
-
lineage); this face resolves the dangling display token. `font-display: swap`
|
|
156
|
-
— the display register is a deliberate ornament, post-LCP, with the body
|
|
157
|
-
carried by the calibrated sans/mono fallbacks. */
|
|
158
|
-
@font-face {
|
|
159
|
-
font-family: "Fraunces";
|
|
160
|
-
font-style: normal;
|
|
161
|
-
font-weight: 100 900;
|
|
162
|
-
font-display: swap;
|
|
163
|
-
src: url("@mkbabb/glass-ui/fonts/fraunces/fraunces-latin.woff2") format("woff2");
|
|
164
|
-
unicode-range:
|
|
165
|
-
U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
|
|
166
|
-
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
|
|
167
|
-
U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
168
|
-
}
|
package/src/styles/glass.css
CHANGED
|
@@ -100,21 +100,28 @@
|
|
|
100
100
|
`var(--mouse-x, 50%)` floor is the centred fallback. */
|
|
101
101
|
--specular-x: var(--mouse-x, 50%);
|
|
102
102
|
--specular-y: var(--mouse-y, 50%);
|
|
103
|
-
/* The catch-light intensity
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
103
|
+
/* The catch-light intensity at REST — reads the token cohort
|
|
104
|
+
(tokens.css §specular-intensity), default 0 so a static, unwired
|
|
105
|
+
surface is CLEAN and the @property `initial-value: 0` dormancy is no
|
|
106
|
+
longer defeated by a floor. Hover/active lift it through the same
|
|
107
|
+
cohort (the interaction-light state machine below). */
|
|
108
|
+
--specular-intensity: var(--glass-specular-intensity-rest, 0);
|
|
109
|
+
/* The travelling catch-light — a genuinely WARM-CREAM, low-alpha circular
|
|
110
|
+
glow centred on the tracked pointer position (L < 100% so the warm hue
|
|
111
|
+
survives — the prior `hsl(40 30% 100%)` was PURE WHITE at L=100%, which
|
|
112
|
+
saturated the 30% away and blew out under the screen blend; the
|
|
113
|
+
warm-cream the comment claimed never painted). The `--specular-intensity`
|
|
114
|
+
multiplier drives the layer `opacity`, not a per-stop alpha (a
|
|
115
|
+
registered-`@property` var() nested in an hsl() alpha computes to 0 in
|
|
116
|
+
Chromium); the per-stop alphas here keep the core soft so even the lifted
|
|
117
|
+
hover/active states read as a lens, not a flash. */
|
|
111
118
|
background: radial-gradient(
|
|
112
119
|
circle at var(--specular-x, 50%) var(--specular-y, 50%),
|
|
113
|
-
hsl(40 30%
|
|
114
|
-
hsl(40 30%
|
|
120
|
+
hsl(40 30% 96% / 0.22) 0%,
|
|
121
|
+
hsl(40 30% 96% / 0.08) 22%,
|
|
115
122
|
transparent 55%
|
|
116
123
|
);
|
|
117
|
-
opacity: var(--specular-intensity, 0
|
|
124
|
+
opacity: var(--specular-intensity, 0);
|
|
118
125
|
/* Clip the glow to the plate so it rides the surface. `mask-image`
|
|
119
126
|
Baseline 2023-12-07; a non-supporting engine ignores it and the
|
|
120
127
|
`inset: 0` + radius-inherit already bound the glow. */
|
|
@@ -142,8 +149,12 @@
|
|
|
142
149
|
.dark .glass-card::before,
|
|
143
150
|
.dark .glass-specular-track::before,
|
|
144
151
|
.dark .dock-icon-button::before {
|
|
145
|
-
/* Softer over the deep canvas — the screen blend lifts harder on dark.
|
|
146
|
-
|
|
152
|
+
/* Softer over the deep canvas — the screen blend lifts harder on dark.
|
|
153
|
+
The `.dark` magnitude lives in the token cohort (tokens.css §specular-
|
|
154
|
+
intensity `.dark` arm); the rest rung is already 0 so the dark arm only
|
|
155
|
+
softens hover/active via the cohort. The rest rung re-reads the (dark)
|
|
156
|
+
token here so a dark `:root` override resolves. */
|
|
157
|
+
--specular-intensity: var(--glass-specular-intensity-rest, 0);
|
|
147
158
|
}
|
|
148
159
|
|
|
149
160
|
/* (c) Interaction-light lockstep — hover/active lift the intensity in the
|
|
@@ -159,7 +170,7 @@
|
|
|
159
170
|
.glass-card:hover::before,
|
|
160
171
|
.glass-specular-track:hover::before,
|
|
161
172
|
.dock-icon-button:hover::before {
|
|
162
|
-
--specular-intensity: 0.
|
|
173
|
+
--specular-intensity: var(--glass-specular-intensity-hover, 0.22);
|
|
163
174
|
}
|
|
164
175
|
.glass-material:active::before,
|
|
165
176
|
.glass-wash:active::before,
|
|
@@ -170,7 +181,7 @@
|
|
|
170
181
|
.glass-card:active::before,
|
|
171
182
|
.glass-specular-track:active::before,
|
|
172
183
|
.dock-icon-button:active::before {
|
|
173
|
-
--specular-intensity: 0.
|
|
184
|
+
--specular-intensity: var(--glass-specular-intensity-active, 0.32);
|
|
174
185
|
}
|
|
175
186
|
|
|
176
187
|
/* ── Five-tier surface ladder (v0.8.0; visual only, no geometry) ──
|
|
@@ -565,32 +576,6 @@
|
|
|
565
576
|
border-color: var(--surface-tint-15);
|
|
566
577
|
}
|
|
567
578
|
|
|
568
|
-
/* ── Deck-position rail (AW.W16) ──────────────────────────────────────
|
|
569
|
-
A CSS recipe that RESTYLES the shipped `<Progress variant="default">`
|
|
570
|
-
(the reka-ui ProgressRoot track + its indicator child) into the thin
|
|
571
|
-
bottom-of-deck position rail. It composes the EXISTING fill — it does NOT
|
|
572
|
-
re-author a second track/range mechanic. Every visual axis is a
|
|
573
|
-
`--progress-rail-*` token, so a consumer/dark-flip re-tints with zero
|
|
574
|
-
library edit (`:root { --progress-rail-fill: … }`). The viewport-pinned
|
|
575
|
-
chrome (`position: fixed`, `env(safe-area-inset-bottom)`, the z-index) is
|
|
576
|
-
CONSUMER-supplied — this recipe owns only the LOOK. */
|
|
577
|
-
.glass-progress-rail {
|
|
578
|
-
/* The track hairline — the rail reads as a thin sliver, not a 16px bar. */
|
|
579
|
-
height: var(--progress-rail-h, 3px);
|
|
580
|
-
border-radius: 0;
|
|
581
|
-
background: var(--progress-rail-track, color-mix(in srgb, var(--foreground) 8%, transparent));
|
|
582
|
-
}
|
|
583
|
-
|
|
584
|
-
/* The fill — the shipped ProgressIndicator child. A leading-edge glow on the
|
|
585
|
-
fill's trailing edge reads as a moving position head. */
|
|
586
|
-
.glass-progress-rail > * {
|
|
587
|
-
border-radius: 0;
|
|
588
|
-
background: var(--progress-rail-fill, var(--primary));
|
|
589
|
-
box-shadow:
|
|
590
|
-
var(--progress-rail-glow-x, 4px) 0 var(--progress-rail-glow-blur, 8px)
|
|
591
|
-
color-mix(in srgb, var(--progress-rail-fill, var(--primary)) var(--progress-rail-glow-strength, 55%), transparent);
|
|
592
|
-
}
|
|
593
|
-
|
|
594
579
|
/* ── AW.W23 — chromatic edge dispersion (the polished-glass rim fringe) ──
|
|
595
580
|
An opt-in `.glass-chromatic` composes the warm/cool oklab fringe OVER the
|
|
596
581
|
W22 uniform rim (it does NOT replace it — the rim still rides each rung's
|
|
@@ -605,6 +590,80 @@
|
|
|
605
590
|
}
|
|
606
591
|
}
|
|
607
592
|
|
|
593
|
+
/* ── Deck-position rail (AW.W16 · AX.W24) ───────────────────────────────────
|
|
594
|
+
A Tailwind `@utility` that RESTYLES the shipped `<Progress variant="default">`
|
|
595
|
+
(the reka-ui ProgressRoot track + its indicator child) into the thin
|
|
596
|
+
bottom-of-deck position rail. It composes the EXISTING fill — it does NOT
|
|
597
|
+
re-author a second track/range mechanic. Every visual axis is a
|
|
598
|
+
`--progress-rail-*` token, so a consumer/dark-flip re-tints with zero library
|
|
599
|
+
edit (`:root { --progress-rail-fill: … }`). The viewport-pinned chrome
|
|
600
|
+
(`position: fixed`, `env(safe-area-inset-bottom)`, the z-index) is CONSUMER-
|
|
601
|
+
supplied — this recipe owns only the LOOK.
|
|
602
|
+
|
|
603
|
+
AX.W24 — WHY `@utility`, not `@layer components`. The rail RESTYLES the default
|
|
604
|
+
Progress: it must override the `h-4` height + `rounded-pill` radius utilities the
|
|
605
|
+
variant bakes. Those utilities live in `@layer utilities`, which ALWAYS outranks
|
|
606
|
+
`@layer components` regardless of source order, so the prior `@layer components`
|
|
607
|
+
recipe's `height: 3px` was a silent no-op (the rail painted as a 16px bar). An
|
|
608
|
+
`@utility` lands the recipe IN `@layer utilities` alongside `h-4`, where a single-
|
|
609
|
+
class selector wins the geometry by source order — the idiomatic Tailwind-v4 way
|
|
610
|
+
to author a restyle-class that out-ranks base utilities (the `btn-audacious` /
|
|
611
|
+
`cartoon-surface` pattern).
|
|
612
|
+
|
|
613
|
+
The COLOUR fix is the SEPARATE token-read-at-source path (NOT a layer-juggle):
|
|
614
|
+
`ProgressDefault` reads `--progress-fill`/`--progress-track` and dropped its
|
|
615
|
+
`bg-secondary`/`bg-primary` utilities, so this recipe FEEDS those tokens rather
|
|
616
|
+
than fighting a utility colour. The `--progress-fill` set on the rail root cascades
|
|
617
|
+
to the indicator child (a CSS custom property inherits), so the indicator reads the
|
|
618
|
+
override hue. */
|
|
619
|
+
@utility glass-progress-rail {
|
|
620
|
+
/* The track hairline + zero radius — the rail reads as a thin square sliver, not
|
|
621
|
+
the variant's 16px `rounded-pill` bar. A single-class @utility ties `h-4`/
|
|
622
|
+
`rounded-pill` on SPECIFICITY (both 0,1,0) and Tailwind's utility sort can emit
|
|
623
|
+
`h-4` later, so the bare tie loses. The doubled-class self-reference (`&&` →
|
|
624
|
+
`.glass-progress-rail.glass-progress-rail`, specificity 0,2,0) wins the geometry
|
|
625
|
+
DETERMINISTICALLY over the base utilities regardless of emit order — the precise,
|
|
626
|
+
contained way to out-rank a base utility without `!important`. */
|
|
627
|
+
&& {
|
|
628
|
+
height: var(--progress-rail-h, 3px);
|
|
629
|
+
border-radius: 0;
|
|
630
|
+
}
|
|
631
|
+
/* Feed the token-read default variant — these route the consumer's
|
|
632
|
+
`--progress-rail-*` axes into the `--progress-fill`/`--progress-track` tokens
|
|
633
|
+
the variant reads at source (the cascade-correct colour path). */
|
|
634
|
+
--progress-track: var(
|
|
635
|
+
--progress-rail-track,
|
|
636
|
+
color-mix(in srgb, var(--foreground) 8%, transparent)
|
|
637
|
+
);
|
|
638
|
+
--progress-fill: var(--progress-rail-fill, var(--primary));
|
|
639
|
+
|
|
640
|
+
/* The fill — the shipped ProgressIndicator child. The indicator paints the
|
|
641
|
+
inherited `--progress-fill`; the leading-edge glow is re-authored (AX.W24 F2)
|
|
642
|
+
as a TRAILING right-edge INSET box-shadow that lives INSIDE the indicator's
|
|
643
|
+
own box. The prior `4px 0 8px` OUTSET rightward shadow extended PAST the fill
|
|
644
|
+
boundary into the ProgressRoot's load-bearing `overflow-hidden` clip and was
|
|
645
|
+
eaten — invisible at every value. An `inset` shadow offset leftward
|
|
646
|
+
(`inset -Npx 0 …`) brightens just inside the indicator's right (leading) edge
|
|
647
|
+
— the moving position head — and never crosses the fill boundary, so the clip
|
|
648
|
+
cannot eat it (the clip is never lifted; that would re-break the default
|
|
649
|
+
Progress look for every other consumer). `box-shadow` is a separate property
|
|
650
|
+
from `background`, so it composes cleanly over the token-read fill. */
|
|
651
|
+
&& > * {
|
|
652
|
+
border-radius: 0;
|
|
653
|
+
box-shadow:
|
|
654
|
+
inset
|
|
655
|
+
calc(-1 * var(--progress-rail-glow-x, 4px))
|
|
656
|
+
0
|
|
657
|
+
var(--progress-rail-glow-blur, 8px)
|
|
658
|
+
calc(-1 * var(--progress-rail-glow-spread, 2px))
|
|
659
|
+
color-mix(
|
|
660
|
+
in srgb,
|
|
661
|
+
hsl(0 0% 100%) var(--progress-rail-glow-strength, 55%),
|
|
662
|
+
transparent
|
|
663
|
+
);
|
|
664
|
+
}
|
|
665
|
+
}
|
|
666
|
+
|
|
608
667
|
/* ── AW.W23 — corner-shape: squircle PE (Chrome 139+) ───────────────────────
|
|
609
668
|
The literal iOS-26 superellipse corner geometry that `backdrop-filter`,
|
|
610
669
|
borders, and shadows follow. `@supports (corner-shape: squircle)`-gated over
|
package/src/styles/theme.css
CHANGED
|
@@ -103,9 +103,17 @@
|
|
|
103
103
|
|
|
104
104
|
/* ═══════════════════════════════════════════════
|
|
105
105
|
Font families → font-* utilities
|
|
106
|
+
|
|
107
|
+
ONE brand register, bridged from tokens.css §0's --font-stack-* source.
|
|
108
|
+
--font-text is the body/heading/prose/display register (Plus Jakarta
|
|
109
|
+
Sans). --font-serif is a bridge alias for the demo configurator's "serif"
|
|
110
|
+
control slot — it resolves to the SAME text register (the library carries
|
|
111
|
+
no display-serif voice). A consumer rebrands the whole text register by
|
|
112
|
+
overriding --font-text once.
|
|
106
113
|
═══════════════════════════════════════════════ */
|
|
114
|
+
--font-text: var(--font-stack-text);
|
|
107
115
|
--font-display: var(--font-stack-display);
|
|
108
|
-
--font-serif: var(--font-stack-
|
|
116
|
+
--font-serif: var(--font-stack-text);
|
|
109
117
|
--font-sans: var(--font-stack-sans);
|
|
110
118
|
--font-mono: var(--font-stack-mono);
|
|
111
119
|
|
|
@@ -358,7 +366,6 @@
|
|
|
358
366
|
--ease-in: var(--motion-ease-in);
|
|
359
367
|
--ease-out-expo: var(--motion-ease-out-expo);
|
|
360
368
|
--ease-apple: var(--motion-ease-apple);
|
|
361
|
-
--ease-apple-spring: var(--motion-ease-apple-spring);
|
|
362
369
|
--ease-spring: var(--spring-snappy);
|
|
363
370
|
--ease-decelerate: var(--motion-ease-out);
|
|
364
371
|
--ease-accelerate: var(--motion-ease-in);
|
package/src/styles/tokens.css
CHANGED
|
@@ -33,21 +33,24 @@
|
|
|
33
33
|
accent-color: var(--accent-color);
|
|
34
34
|
|
|
35
35
|
/* ═══════════════════════════════════════════════
|
|
36
|
-
§0
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
36
|
+
§0 FONT TOKEN SOURCE-OF-TRUTH
|
|
37
|
+
|
|
38
|
+
The single authoritative declaration of the library's font register.
|
|
39
|
+
theme.css bridges each --font-stack-* to its Tailwind --font-* namespace
|
|
40
|
+
var; typography.css consumes the bridged --font-* names. The public
|
|
41
|
+
runtime knobs remain --font-*, --leading-*, --tracking-*.
|
|
42
|
+
|
|
43
|
+
ONE brand register: Plus Jakarta Sans (text + display) + Fira Code (mono).
|
|
44
|
+
--font-stack-text drives the body/heading/prose/display register — the
|
|
45
|
+
library DEFAULT is the register every live surface paints (the demo +
|
|
46
|
+
speedtest render Plus Jakarta everywhere). The calibrated "Plus Jakarta
|
|
47
|
+
Sans Fallback" / "Fira Code Fallback" faces (declared in typography.css)
|
|
48
|
+
wrap the system stacks with Capsize metric overrides so the swap window
|
|
49
|
+
is geometry-neutral (zero CLS). --font-stack-display aliases the text
|
|
50
|
+
register: there is no separate display-serif voice. */
|
|
51
|
+
--font-stack-text: "Plus Jakarta Sans", "Plus Jakarta Sans Fallback", system-ui, sans-serif;
|
|
52
|
+
--font-stack-display: var(--font-stack-text);
|
|
53
|
+
--font-stack-sans: var(--font-stack-text);
|
|
51
54
|
--font-stack-mono: "Fira Code", "Fira Code Fallback", "Fira Mono", monospace;
|
|
52
55
|
|
|
53
56
|
--type-leading-micro: 1.2;
|
|
@@ -175,10 +178,8 @@
|
|
|
175
178
|
|
|
176
179
|
/* Apple-inspired — micro-interactions, switches, dock hover */
|
|
177
180
|
--motion-ease-apple: cubic-bezier(0.25, 0.1, 0.25, 1);
|
|
178
|
-
--motion-ease-apple-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
|
179
181
|
|
|
180
182
|
--ease-apple: var(--motion-ease-apple);
|
|
181
|
-
--ease-apple-spring: var(--motion-ease-apple-spring);
|
|
182
183
|
--ease-spring: var(--spring-snappy);
|
|
183
184
|
--ease-decelerate: var(--ease-out);
|
|
184
185
|
--ease-accelerate: var(--ease-in);
|
|
@@ -418,6 +419,46 @@
|
|
|
418
419
|
--muted-soft: color-mix(in srgb, var(--muted) 30%, transparent);
|
|
419
420
|
--muted-medium: color-mix(in srgb, var(--muted) 50%, transparent);
|
|
420
421
|
|
|
422
|
+
/* ═══════════════════════════════════════════════
|
|
423
|
+
§5c CONSTELLATION — Canvas2D proximity-graph lattice (AX.W17)
|
|
424
|
+
|
|
425
|
+
The H.W4 legibility intelligence promoted from the slides deck to
|
|
426
|
+
LIBRARY identity: the node tones, the edge hairline color, the per-mode
|
|
427
|
+
edge-alpha multipliers, and the field-yields-to-type translucency knob.
|
|
428
|
+
Only `--constellation-accent` (the anomaly tint) stays a CONSUMER preset
|
|
429
|
+
(slides aliases it to `--ncsu-red`); the library ships a neutral default.
|
|
430
|
+
|
|
431
|
+
PLAIN-hsl LITERALS, per arm — NEVER `light-dark()` and NEVER a
|
|
432
|
+
`var(--neutral-*)`/`var(--foreground)`/`var(--border)`/`var(--card)`
|
|
433
|
+
alias. Canvas2D silently REJECTS a `light-dark()` value into
|
|
434
|
+
`strokeStyle`/`fillStyle` (the W30 86.3%-red-splatter cardinal defect),
|
|
435
|
+
and the rejection is identical whether the value is a literal
|
|
436
|
+
`light-dark(…)` OR a `var()` that RESOLVES to one — so the constellation
|
|
437
|
+
tokens are plain-hsl LEAVES, the `:root` vs `.dark` cascade carrying two
|
|
438
|
+
literals. `proof:constellation-tokens` clause (c) machine-locks this
|
|
439
|
+
(the no-`light-dark(`-substring NOR transitive-`var()` static assertion).
|
|
440
|
+
═══════════════════════════════════════════════ */
|
|
441
|
+
/* Node tones — readable on the warm-cream ground. The two-tone split (the
|
|
442
|
+
`dim` half rides `-node-dim`). Warm-grey ink, NOT a neutral-ladder alias. */
|
|
443
|
+
--constellation-node: hsl(36 8% 46%);
|
|
444
|
+
--constellation-node-dim: hsl(36 8% 60%);
|
|
445
|
+
/* Edge hairline stroke — warm near-black on cream (the plain-hsl complement
|
|
446
|
+
the slides deck reads to fix the `--foreground` light-dark() leak). */
|
|
447
|
+
--constellation-line: hsl(24 14% 14%);
|
|
448
|
+
/* Anomaly tint — NEUTRAL library default (a desaturated warm accent). The
|
|
449
|
+
consumer overrides this (slides → `--ncsu-red`); the library does NOT
|
|
450
|
+
bake a brand hue. This is the single consumer-preset boundary. */
|
|
451
|
+
--constellation-accent: hsl(18 58% 46%);
|
|
452
|
+
/* Edge-alpha multipliers — replace the magic `0.17` hairline / pointer-web
|
|
453
|
+
literals. The cream ground lifts the node tones, so the field can recede;
|
|
454
|
+
the focus-proximity edge reads a touch stronger. */
|
|
455
|
+
--constellation-edge-alpha: 0.22;
|
|
456
|
+
--constellation-edge-focus-alpha: 0.34;
|
|
457
|
+
/* §7 field-yields-to-type translucency knob — the legible-but-RECESSIVE
|
|
458
|
+
MIDPOINT, NOT max-legibility. On cream the node tones already read, so the
|
|
459
|
+
field recedes further: BELOW the slides 0.92 max-legibility reference. */
|
|
460
|
+
--constellation-alpha: 0.80;
|
|
461
|
+
|
|
421
462
|
/* ═══════════════════════════════════════════════
|
|
422
463
|
§6 SECTION PALETTE — 13-stop jewel tones (light)
|
|
423
464
|
═══════════════════════════════════════════════ */
|
|
@@ -535,6 +576,22 @@
|
|
|
535
576
|
--dock-shadow: var(--shadow-dock);
|
|
536
577
|
--dock-shadow-collapsed: var(--shadow-dock-collapsed);
|
|
537
578
|
|
|
579
|
+
/* AX.W04 F1 — the wrap/card-tier dock shadow. A wrapped multi-row dock (and
|
|
580
|
+
any finite-radius card silhouette) is a THICKER material than a flat thin
|
|
581
|
+
pill — WWDC25 §219 "material thickens as glass flexes larger". So when the
|
|
582
|
+
wrap dock expands it lifts its elevation onto the FLOATING-tier shadow
|
|
583
|
+
stack (the `--glass-shadow-floating` family — `--shadow-xl` + the
|
|
584
|
+
`--glass-material-rim` hairline + the `--glass-under-shadow-vivid` under-cast)
|
|
585
|
+
rather than carrying the flat `--shadow-dock` glow of a 40px pill. Composed
|
|
586
|
+
on `:root` as ONE consumer-overridable token (per the cartoon-shadow
|
|
587
|
+
override contract — override on the cascade, never a dead local). The dock
|
|
588
|
+
reads it via `calc()`-on-`--dock-expand-t` so the lift glides in lockstep
|
|
589
|
+
with the pill→card radius morph (ONE clock, ONE register). */
|
|
590
|
+
--glass-material-rim: 0 0 0 0.5px color-mix(in srgb, var(--shadow-color) 5%, transparent);
|
|
591
|
+
--shadow-dock-wrap: var(--shadow-xl),
|
|
592
|
+
var(--glass-material-rim),
|
|
593
|
+
var(--glass-under-shadow-vivid);
|
|
594
|
+
|
|
538
595
|
/* Cartoon shadow color primitives (kept for tiered cartoon utilities) */
|
|
539
596
|
--shadow-cartoon-color: rgb(0 0 0 / 0.12);
|
|
540
597
|
--shadow-cartoon-color-soft: rgb(0 0 0 / 0.06);
|
|
@@ -866,18 +923,16 @@
|
|
|
866
923
|
than cliffs. Defaults clamp to 80vw / 80vh capped at sensible
|
|
867
924
|
desktop widths; consumers override per-dock by setting either
|
|
868
925
|
token directly on a `.glass-dock` instance. User findings 1 + 5a. */
|
|
926
|
+
/* AX.W04 — `--dock-max-inline-size` is the canonical inline cap EVERY overflow
|
|
927
|
+
strategy reads: `overflow="scroll"` scrolls past it, and `overflow="wrap"`
|
|
928
|
+
wraps to N rows on the over-cap crossing (the dock shrink-wraps to content,
|
|
929
|
+
`max-inline-size` caps that intrinsic width at this token). The prior
|
|
930
|
+
`--dock-overflow-bp: 640px` viewport-breakpoint token (the magic-640
|
|
931
|
+
snap-back) is DELETED — the wrap is content-driven, not viewport-coupled, so
|
|
932
|
+
there is no breakpoint threshold to name. */
|
|
869
933
|
--dock-max-inline-size: min(80vw, 64rem);
|
|
870
934
|
--dock-max-block-size: min(80vh, 48rem);
|
|
871
935
|
|
|
872
|
-
/* AT.W7-dock-a — the `overflow="wrap"` desktop snap-back breakpoint, named
|
|
873
|
-
once. Below this viewport width a wrap-mode dock reads as a multi-row pill
|
|
874
|
-
that narrows to the viewport gutter; at/above it the pill snaps back to a
|
|
875
|
-
single nowrap row. The single source-of-record for the threshold the
|
|
876
|
-
`@media` in dock.css realizes (a `var()` cannot drive a media-query
|
|
877
|
-
feature in Baseline CSS, so the MQ carries the literal value of THIS
|
|
878
|
-
token; consumers reading the breakpoint do so through this name). */
|
|
879
|
-
--dock-overflow-bp: 640px;
|
|
880
|
-
|
|
881
936
|
/* AB.W1.T1 — chassis max-block-size guardrail.
|
|
882
937
|
Maximum block size a centred consumer-app card may consume while
|
|
883
938
|
preserving the inline dock footprint. The recipe subtracts the
|
|
@@ -1300,12 +1355,14 @@
|
|
|
1300
1355
|
--top-layer-backdrop-dim: 0.5;
|
|
1301
1356
|
|
|
1302
1357
|
--vt-duration: var(--duration-normal);
|
|
1303
|
-
/*
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
(
|
|
1308
|
-
|
|
1358
|
+
/* AX.W05 — ONE iOS-spring vocabulary: every spring-flavored transition reads
|
|
1359
|
+
a governed `--spring-*` register. The legacy apple-spring cubic-bezier
|
|
1360
|
+
(+27.5% overshoot) was a SECOND authority beside the regen `--spring-*`
|
|
1361
|
+
cohort; it is EXCISED. Its emphatic-overshoot register maps to the playful
|
|
1362
|
+
`--spring-bouncy` (the closest `linear()` overshoot stop-set), so the VT
|
|
1363
|
+
default + the cards/top-layer transitions share one spring primitive
|
|
1364
|
+
(CPU + GPU sample the same curve). No cubic-bezier fallback seed survives —
|
|
1365
|
+
the `linear()` spring degrades to `ease` where `linear()` is unsupported. */
|
|
1309
1366
|
--vt-ease: var(--spring-bouncy);
|
|
1310
1367
|
--vt-rise: 8px;
|
|
1311
1368
|
|
|
@@ -1589,6 +1646,25 @@
|
|
|
1589
1646
|
--shadow-cartoon-color: rgb(255 255 255 / 0.07);
|
|
1590
1647
|
--shadow-cartoon-color-soft: rgb(255 255 255 / 0.03);
|
|
1591
1648
|
|
|
1649
|
+
/* §5c CONSTELLATION — dark arm (AX.W17). The H.W4 dark-mode lift: the node
|
|
1650
|
+
tones step UP off the ink ground (the light arm's mid-grey would vanish on
|
|
1651
|
+
L6 black), the hairline goes warm off-white, the field carries a touch more
|
|
1652
|
+
presence to read at all. PLAIN-hsl literals, NEVER light-dark()/var(). */
|
|
1653
|
+
--constellation-node: hsl(42 9% 72%);
|
|
1654
|
+
--constellation-node-dim: hsl(42 8% 56%);
|
|
1655
|
+
--constellation-line: hsl(45 12% 86%);
|
|
1656
|
+
/* Anomaly — brightened for the deep canvas (same neutral-default register;
|
|
1657
|
+
the consumer still overrides to its brand). */
|
|
1658
|
+
--constellation-accent: hsl(20 70% 60%);
|
|
1659
|
+
/* The dark hairlines lift harder over the ink ground, so the edge multipliers
|
|
1660
|
+
run a touch lower than light to keep the field recessive. */
|
|
1661
|
+
--constellation-edge-alpha: 0.20;
|
|
1662
|
+
--constellation-edge-focus-alpha: 0.32;
|
|
1663
|
+
/* §7 — the ink ground needs MORE field presence than cream to read at all, so
|
|
1664
|
+
the dark alpha is modestly HIGHER than the light arm — but still BELOW the
|
|
1665
|
+
slides 1.0 max-legibility reference (the recessive midpoint, not 1.0). */
|
|
1666
|
+
--constellation-alpha: 0.88;
|
|
1667
|
+
|
|
1592
1668
|
/* Glass opacity + grain for dark — five-tier ladder, alpha-monotonic.
|
|
1593
1669
|
Each rung lifts ~0.08 from its light counterpart so the dark surfaces
|
|
1594
1670
|
carry comparable read-weight against the deeper canvas. */
|
|
@@ -1726,3 +1802,34 @@
|
|
|
1726
1802
|
inherits: false;
|
|
1727
1803
|
initial-value: 0;
|
|
1728
1804
|
}
|
|
1805
|
+
|
|
1806
|
+
/* ── The specular-intensity magnitude cohort (AX.W09) ──────────────────────
|
|
1807
|
+
The catch-light alpha multiplier at each interaction state, as a SINGLE
|
|
1808
|
+
overridable token cohort (was three buried literals across glass.css —
|
|
1809
|
+
`0.35` rest floor / `0.6` hover / `0.85` active — and the `.dark` arm's
|
|
1810
|
+
`0.22`). `glass.css`'s `.glass-material::before` rest/hover/active rules READ
|
|
1811
|
+
these, so the subtle-vs-extreme magnitude is a knob a consumer (or the dark
|
|
1812
|
+
arm) retunes ON THE CASCADE — never a re-buried literal. Override on `:root`
|
|
1813
|
+
to retune library-wide; the cartoon-shadow override contract is the precedent.
|
|
1814
|
+
|
|
1815
|
+
Re-baselined to a SUBTLE ladder (≈ half the retired `0.35/0.6/0.85`):
|
|
1816
|
+
• rest 0 — static, unwired surfaces are CLEAN; the catch-light wakes
|
|
1817
|
+
only on hover/active or on a pointer-wired surface. This
|
|
1818
|
+
aligns the painted rest behaviour with the @property
|
|
1819
|
+
`--specular-intensity { initial-value: 0 }` dormancy the
|
|
1820
|
+
prior unconditional `0.35` floor defeated.
|
|
1821
|
+
• hover 0.22 — a subtle warm-cream lens, not a flash.
|
|
1822
|
+
• active 0.32 — the press whisper; ≈ 0.22α × the warm-cream core, a lens
|
|
1823
|
+
not the prior ≈ 0.47 pure-white-screen hotspot. */
|
|
1824
|
+
:root {
|
|
1825
|
+
--glass-specular-intensity-rest: 0;
|
|
1826
|
+
--glass-specular-intensity-hover: 0.22;
|
|
1827
|
+
--glass-specular-intensity-active: 0.32;
|
|
1828
|
+
}
|
|
1829
|
+
|
|
1830
|
+
/* Over the deep canvas the `screen` blend lifts harder, so the dark arm runs a
|
|
1831
|
+
touch softer on the interaction rungs (rest already 0). */
|
|
1832
|
+
.dark {
|
|
1833
|
+
--glass-specular-intensity-hover: 0.18;
|
|
1834
|
+
--glass-specular-intensity-active: 0.26;
|
|
1835
|
+
}
|