@stnd/styles 0.7.4 → 0.7.6

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @stnd/styles
 
+## 0.7.6
+
+### Patch Changes
+
+- Auto-bumped @stnd/styles due to modified code.
+
+## 0.7.5
+
+### Patch Changes
+
+- Auto-bumped @stnd/styles due to modified code.
+
 ## 0.7.4
 
 ### Patch Changes

package/_standard-11-forms.scss

@@ -269,11 +269,19 @@ input[type="checkbox"][role="switch"] {
   border: none;
   cursor: pointer;
   background: var(--color-surface-lowest);
-  box-shadow: var(--shadow-ring), var(--shadow-inset);
+  /* --shadow-inset (not just the thumb's own shadow, fixed two commits ago)
+     is ALSO asymmetric: inset 0 1px 3px (a dark inset shadow pooling near
+     the TOP-inner edge) plus inset 0 -1px 0 0 (a bright highlight line just
+     inside the BOTTOM edge). On a thumb sized to exactly fill this track,
+     that bottom highlight brightens a sliver of the track color right where
+     the thumb's bottom edge sits, reading as the track's own color (accent
+     orange, once checked) peeking out underneath — which is exactly what it
+     is. --shadow-ring alone is symmetric on all four sides. */
+  box-shadow: var(--shadow-ring);
   transition: background 0.2s;
 
   &:hover {
-    box-shadow: var(--shadow-ring), var(--shadow-inset);
+    box-shadow: var(--shadow-ring);
     &::before {
       background: var(--color-accent);
     }
@@ -299,7 +307,16 @@ input[type="checkbox"][role="switch"] {
     height: calc(var(--switch-height) - var(--switch-padding) * 2);
     border-radius: 50%;
     background: var(--color-surface-high);
-    box-shadow: var(--shadow-raised);
+    /* Not --shadow-raised here on purpose — its ambient component
+       (--shadow-ambient: 0 1px 1px) is a fixed 1px DOWNWARD drop shadow,
+       tuned to be a subtle depth cue on normal-sized raised elements. On a
+       thumb sized to exactly fill its track (padding 0, see above) that
+       same 1px shows up as a real, asymmetric gap: a crisp bright edge at
+       the top (the inset highlight) against a soft shadow-blurred one at
+       the bottom, which reads as "not touching" the track's bottom edge
+       even though the circle's true box does. Border ring only — no
+       directional shadow to be asymmetric in the first place. */
+    box-shadow: inset 0 1px 0 0 var(--color-highlight), 0 0 0 1px var(--color-border);
     transition: all var(--transition-fast);
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stnd/styles",
-  "version": "0.7.4",
+  "version": "0.7.6",
   "type": "module",
   "author": "Francis Fontaine",
   "license": "MIT",