@stnd/styles 0.10.12 → 0.10.14

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @stnd/styles
 
+## 0.10.14
+
+### Patch Changes
+
+- Auto-bumped @stnd/styles due to modified code.
+
+## 0.10.13
+
+### Patch Changes
+
+- Auto-bumped @stnd/styles due to modified code.
+
 ## 0.10.12
 
 ### Patch Changes

package/_standard-01-token.scss

@@ -103,7 +103,7 @@
    */
   --gap: calc(var(--space));
   --gap-compact: var(--trim);
-  --page-padding: clamp(1rem, 3vw, 3rem);
+  --page-padding: clamp(1rem, 6vw, 4rem);
   --gap-grid-img: var(--space-half);
   --rhythm-block-scale: 2;
 

package/_standard-07-base.scss

@@ -204,10 +204,12 @@ dt {
 /* Safe default containment for direct body children:
    every element placed directly in body is centered and padded
    unless explicitly marked full-bleed, a header, or a footer. */
-body > :not(.full-bleed, .stnd-header, .stnd-footer, [data-full-bleed], script, style, template, astro-island) {
+/*
+   body > :not(.full-bleed, .stnd-header, .stnd-footer, [data-full-bleed], script, style, template, astro-island) {
   width: 100%;
   max-width: var(--page-max-width);
   margin-inline: auto;
   padding-inline: var(--page-padding);
   box-sizing: border-box;
 }
+*/

package/_standard-11-forms.scss

@@ -103,6 +103,8 @@ select {
   @extend %padding-text;
   font-size: 1em;
 
+
+
   border-radius: var(--radius-sm);
   color: var(--color-muted);
   background-color: var(--color-surface-dark-1);
@@ -113,7 +115,9 @@ select {
   cursor: pointer;
   text-align: left;
   text-shadow: none !important;
-  text-box-trim: none;
+  text-box-trim: trim;
+
+  padding: 0 var(--trim);
 
   appearance: none;
   /* Match Combobox double-chevron */
@@ -121,7 +125,6 @@ select {
   background-repeat: no-repeat;
   background-position: right var(--space-d8) center;
   background-size: 1em;
-  padding-right: var(--space); /* Make space for the icon */
 
   &:hover,
   &:focus {

package/_standard-13-components.scss

@@ -29,9 +29,9 @@ kbd {
   border: none;
   border-radius: 15%;
   box-shadow: var(--shadow);
-  padding: var(--space-d4) var(--space-d4);
+  padding: var(--trim);
   font-family: var(--font-monospace);
-  font-size: var(--scale-d4);
+  font-size: var(--scale-d2);
   color: var(--color-foreground);
   pointer-events: none;
 }
@@ -99,7 +99,7 @@ a.btn {
   text-decoration: none !important;
 
   &:hover {
-    background-color: var(--color-surface-light-2);
+    background-color: var(--color-surface-dark-1);
     /* Lift shadow slightly on hover */
     color: var(--color-foreground);
     box-shadow: var(--shadow-hover);
@@ -130,17 +130,19 @@ a.btn.destructive {
 
 :where(button).secondary,
 a.btn.secondary {
-  background-color: var(--color-accent);
-  color: var(--color-on-accent);
+    color: color-mix(in oklch, var(--color-accent) 90%, var(--color-foreground));
+    background-color: var(--color-surface-dark-1);
 
   &:hover {
-    color: var(--color-accent);
-    background-color: var(--color-surface-light-2);
+    background-color: color-mix(in srgb, var(--color-accent) 10%, var(--color-surface-dark-1));
+    color: var(--color-foreground);
     box-shadow: var(--shadow-raised), var(--shadow-glow);
+
   }
 
   &:active {
-    background-color: var(--color-surface-dark-1);
+    background-color: var(--color-accent);
+    color: var(--color-on-accent);
     /* Flatten shadow on press */
     box-shadow: var(--shadow-inset), var(--shadow-ring), var(--shadow-glow);
   }
@@ -170,7 +172,7 @@ a.btn.outline {
 
   &:hover {
     color: var(--color-foreground);
-    background-color: var(--color-surface-light-1);
+    background-color: var(--color-surface-dark-1);
   }
 
   &:active {
@@ -190,7 +192,7 @@ a.btn.ghost {
 
   &:hover {
     color: var(--color-foreground);
-    background-color: var(--color-surface-light-1);
+    background-color: var(--color-surface-dark-1);
     box-shadow: var(--shadow-hover);
   }
 
@@ -275,18 +277,16 @@ a.btn:disabled {
   color: var(--color-accent);
   border-radius: 999px;
   border: none;
-  box-shadow: var(--shadow-ring);
+  box-shadow: var(--shadow);
   text-decoration: none;
   user-select: none;
   transition: all var(--transition-fast);
 
   &.small {
-    padding: calc(var(--space-d5) / 2) var(--space-d4) !important;
     font-size: var(--scale-d3);
   }
 
   &.smaller {
-    padding: calc(var(--space-d5) / 2) var(--space-d4) !important;
     font-size: var(--scale-d4);
   }
 
@@ -330,7 +330,7 @@ a.badge.secondary:hover,
   &:hover,
   a:hover {
     color: var(--color-foreground);
-    background: var(--color-surface-light-1);
+    background: var(--color-surface-dark-1);
   }
 }
 

package/package.json

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