@mlola-ui/tokens 1.0.8 → 1.0.10

package/generated/mlola.css

@@ -1,4 +1,9 @@
 /* Generated by @mlola-ui/engine. React and Tailwind are not required. */
+/* Where Mlola sits among a utility framework's layers, by Tailwind's names:
+   above its reset, so preflight never unstyles a component, whichever
+   stylesheet the app imports first. Without such a framework these layers
+   stay empty. */
+@layer theme, base, mlola, components, utilities;
 @layer mlola.tokens, mlola.foundations, mlola.materials, mlola.recipes, mlola.motion, mlola.accessibility;
 @import "./tokens.css" layer(mlola.tokens);
 /* The project theme is a token source too, imported last within the same

package/generated/recipes.css

@@ -7,9 +7,26 @@
   display: none !important;
 }
 
-/* Icons keep their size inside flex rows; a squeezed row shrinks text, not glyphs. */
+/* Icons sit on the text's optical center and keep their size inside flex
+   rows; a squeezed row shrinks text, not glyphs. The same rules ship in
+   @mlola-ui/icons/glyphs.css for apps that use the icons without the engine. */
 :where(.mlola-glyph) {
+  display: inline-block;
   flex-shrink: 0;
+  overflow: visible;
+  vertical-align: -0.125em;
+  transform-box: fill-box;
+  transform-origin: center;
+}
+
+:where(.mlola-glyph[data-optical-size="small"]) {
+  --mlola-glyph-stroke: 2;
+  --mlola-glyph-optical-scale: 0.94;
+}
+
+:where(.mlola-glyph[data-optical-size="large"]) {
+  --mlola-glyph-stroke: 1.5;
+  --mlola-glyph-optical-scale: 1.03;
 }
 
 .ml-visually-hidden {

package/generated/tokens.css

@@ -267,9 +267,9 @@
   --ml-text-faint: oklch(0.492 0.018 260);
   --ml-border: oklch(0.878 0.023 80);
   --ml-border-subtle: oklch(0.916 0.018 80);
-  --ml-primary: oklch(0.638 0.153 58);
-  --ml-primary-foreground: oklch(0.18 0.02 58);
-  --ml-primary-hover: oklch(0.678 0.141 58);
+  --ml-primary: oklch(0.532 0.127 58);
+  --ml-primary-foreground: oklch(0.99 0 0);
+  --ml-primary-hover: oklch(0.482 0.115 58);
   --ml-primary-text: oklch(0.497 0.119 58);
   --ml-primary-subtle: oklch(0.95 0.031 58);
   --ml-success: oklch(0.507 0.14 150);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mlola-ui/tokens",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "description": "Stable CSS entry for the framework-free Mlola UI design system",
   "main": "tokens.css",
   "sideEffects": [

package/tokens.json

@@ -1361,8 +1361,8 @@
           "$value": {
             "colorSpace": "oklch",
             "components": [
-              0.638,
-              0.153,
+              0.532,
+              0.127,
               58
             ],
             "alpha": 1
@@ -1373,9 +1373,9 @@
           "$value": {
             "colorSpace": "oklch",
             "components": [
-              0.18,
-              0.02,
-              58
+              0.99,
+              0,
+              0
             ],
             "alpha": 1
           }
@@ -1385,8 +1385,8 @@
           "$value": {
             "colorSpace": "oklch",
             "components": [
-              0.678,
-              0.141,
+              0.482,
+              0.115,
               58
             ],
             "alpha": 1