@jsenv/navi 0.27.26 → 0.27.28

package/dist/jsenv_navi.js

@@ -26468,14 +26468,18 @@ installImportMetaCssBuild(import.meta);const css$I = /* css */`
       --button-outline-offset: calc(-1 * var(--button-outline-width) / 2);
       --button-outline-color: var(--navi-focus-outline-color);
       /* Focus outline end */
+      --button-padding-x-default: var(--navi-button-padding-x-default);
+      --button-padding-y-default: var(--navi-button-padding-y-default);
       --button-loader-color: var(--navi-loader-color);
-      --button-border-color: light-dark(#767676, #8e8e93);
+      --button-border-color: var(--navi-control-border-color);
       --button-background-color: var(
         --button-background,
         light-dark(#f3f4f6, #2d3748)
       );
       --button-color: currentColor;
       --button-cursor: pointer;
+      --button-font-size: var(--navi-control-font-size);
+      --button-font-family: var(--navi-control-font-family);
 
       /* Hover */
       --button-border-color-hover: color-mix(
@@ -26541,6 +26545,8 @@ installImportMetaCssBuild(import.meta);const css$I = /* css */`
     cursor: var(--x-button-cursor);
     -webkit-tap-highlight-color: transparent;
     position: relative;
+    font-size: var(--button-font-size);
+    font-family: var(--button-font-family);
     touch-action: manipulation;
     user-select: none;
 
@@ -28473,10 +28479,12 @@ installImportMetaCssBuild(import.meta);const css$A = /* css */`
       --outline-color: var(--navi-focus-outline-color);
       /* Focus outline end */
       --margin: 3px 3px 3px 4px;
-      --width: round(0.815em, 1px);
-      --height: round(0.815em, 1px);
+      --font-size: var(--navi-control-font-size);
+      --font-family: var(--navi-control-font-family);
+      --width: round(1em, 1px);
+      --height: round(1em, 1px);
       --loader-color: var(--navi-loader-color);
-      --border-color: light-dark(#767676, #8e8e93);
+      --border-color: var(--navi-control-border-color);
       --background-color: white;
       --accent-color: light-dark(#4476ff, #3b82f6);
       --background-color-checked: var(--accent-color);
@@ -28550,6 +28558,8 @@ installImportMetaCssBuild(import.meta);const css$A = /* css */`
     height: var(--height);
     min-height: var(--height); /* Do not allow to shrink */
     margin: var(--margin);
+    font-size: var(--font-size);
+    font-family: var(--font-family);
     background-color: var(--x-background-color);
     border-width: var(--border-width);
     border-style: solid;
@@ -28903,8 +28913,8 @@ installImportMetaCssBuild(import.meta);const css$z = /* css */`
       --outline-offset: 1px;
       --outline-width: 2px;
       /* Rounding ensures outline is visually a nice circle */
-      --width: round(0.815em, 1px);
-      --height: round(0.815em, 1px);
+      --width: round(1em, 1px);
+      --height: round(1em, 1px);
 
       --color-mix-light: black;
       --color-mix-dark: white;
@@ -28912,13 +28922,15 @@ installImportMetaCssBuild(import.meta);const css$z = /* css */`
 
       --outline-color: var(--navi-focus-outline-color);
       --loader-color: var(--navi-loader-color);
-      --border-color: light-dark(#767676, #8e8e93);
+      --border-color: var(--navi-control-border-color);
       --background-color: white;
       --background-color-checked: var(--background-color);
       --accent-color: light-dark(#4476ff, #3b82f6);
       --radiomark-color: var(--accent-color);
       --border-color-checked: var(--accent-color);
       --cursor: pointer;
+      --font-size: var(--navi-control-font-size);
+      --font-family: var(--navi-control-font-family);
 
       /* Hover */
       --border-color-hover: color-mix(in srgb, var(--border-color) 60%, black);
@@ -29002,6 +29014,8 @@ installImportMetaCssBuild(import.meta);const css$z = /* css */`
     height: var(--x-height);
     min-height: var(--x-height); /* Do not allow to shrink */
     margin: var(--margin);
+    font-size: var(--font-size);
+    font-family: var(--font-family);
     outline-width: var(--x-outline-width);
     outline-style: none;
     outline-color: var(--x-outline-color);
@@ -29753,6 +29767,9 @@ installImportMetaCssBuild(import.meta);const css$y = /* css */`
       --thumb-height: var(--thumb-size);
       --thumb-border-radius: 100%;
       --thumb-cursor: pointer;
+      /* Range can contains text (legend etc) */
+      --font-size: var(--navi-control-font-size);
+      --font-family: var(--navi-control-font-family);
 
       --loader-color: var(--navi-loader-color);
       --accent-color: rgb(24, 117, 255);
@@ -29846,6 +29863,8 @@ installImportMetaCssBuild(import.meta);const css$y = /* css */`
     flex-direction: inherit;
     align-items: center;
     /* Just for the outline, the real border radius of the range is fixed */
+    font-size: var(--font-size);
+    font-family: var(--font-family);
     border-radius: var(--outline-border-radius);
     outline-width: var(--outline-width);
     outline-style: none;
@@ -31026,8 +31045,9 @@ const css$w = /* css */`
       --outline-color: var(--navi-focus-outline-color);
       /* Focus outline end */
       --font-size: var(--navi-control-font-size);
+      --font-family: var(--navi-control-font-family);
       --loader-color: var(--navi-loader-color);
-      --border-color: light-dark(#767676, #8e8e93);
+      --border-color: var(--navi-control-border-color);
       --background-color: white;
       --color: currentColor;
       --color-dimmed: color-mix(in srgb, currentColor 60%, transparent);
@@ -31102,6 +31122,7 @@ const css$w = /* css */`
     flex-direction: row;
     color: var(--x-color);
     font-size: var(--font-size);
+    font-family: var(--font-family);
     background-color: var(--x-background-color);
     border-width: var(--border-width);
     border-style: solid;
@@ -36376,10 +36397,12 @@ installImportMetaCssBuild(import.meta);const css$k = /* css */`
       --picker-outline-offset: calc(-1 * var(--picker-outline-width) / 2);
       --picker-outline-color: var(--navi-focus-outline-color);
       /* Focus outline end */
-      --picker-padding-x-default: var(--navi-control-padding-x-default);
-      --picker-padding-y-default: var(--navi-control-padding-y-default);
+      --picker-padding-x-default: var(--navi-picker-padding-x-default);
+      --picker-padding-y-default: var(--navi-picker-padding-y-default);
+      --picker-font-size: var(--navi-control-font-size);
+      --picker-font-family: var(--navi-control-font-family);
       --picker-loader-color: var(--navi-loader-color);
-      --picker-border-color: light-dark(#767676, #8e8e93);
+      --picker-border-color: var(--navi-control-border-color);
       --picker-background-color: white;
       --picker-color: currentColor;
       --picker-placeholder-color: color-mix(
@@ -36475,6 +36498,8 @@ installImportMetaCssBuild(import.meta);const css$k = /* css */`
     align-items: center;
     gap: var(--navi-xs);
     color: var(--x-picker-color);
+    font-size: var(--picker-font-size);
+    font-family: var(--picker-font-family);
     text-align: inherit;
     text-overflow: ellipsis;
     background-color: var(--x-picker-background-color);