@jsenv/navi 0.14.31 → 0.14.33

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.
@@ -17828,7 +17828,9 @@ installImportMetaCss(import.meta);import.meta.css = /* css */`
17828
17828
  &[data-toggle] {
17829
17829
  --toggle-width: 2.5em;
17830
17830
  --toggle-thumb-size: 1.2em;
17831
- --toggle-padding: 0.125em;
17831
+ /* Padding uses px and not em otherwise it can be resolved to a float which does not play well */
17832
+ /* With the translation calc in some configurations. In the end 2px is nice in all sizes and can still be configured for exceptions */
17833
+ --toggle-padding: 2px;
17832
17834
  --toggle-thumb-border-radius: 50%;
17833
17835
  --toggle-background-color: light-dark(#767676, #8e8e93);
17834
17836
  --toggle-background-color-checked: var(
@@ -17852,7 +17854,7 @@ installImportMetaCss(import.meta);import.meta.css = /* css */`
17852
17854
  );
17853
17855
  --toggle-background-color-hover-checked: color-mix(
17854
17856
  in srgb,
17855
- var(--toggle-background-color-checked) 80%,
17857
+ var(--toggle-background-color-checked) 90%,
17856
17858
  black
17857
17859
  );
17858
17860
  --toggle-background-color-readonly-checked: color-mix(
@@ -17909,7 +17911,7 @@ installImportMetaCss(import.meta);import.meta.css = /* css */`
17909
17911
  width: var(--toggle-thumb-size);
17910
17912
  height: var(--toggle-thumb-size);
17911
17913
  border-radius: var(--toggle-thumb-border-radius);
17912
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
17914
+ /* box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); */
17913
17915
  opacity: 1;
17914
17916
  fill: var(--toggle-thumb-color);
17915
17917
  transform: translateX(0);
@@ -17919,11 +17921,15 @@ installImportMetaCss(import.meta);import.meta.css = /* css */`
17919
17921
 
17920
17922
  &[data-checked] {
17921
17923
  .navi_checkbox_marker {
17924
+ /* We remove padding 3 times */
17925
+ /* - twice to get real width (box-sizing: border-box) */
17926
+ /* - one more to apply right padding to the translation */
17922
17927
  transform: translateX(
17923
17928
  calc(
17924
17929
  var(--toggle-width) - var(--toggle-thumb-size) - var(
17925
17930
  --toggle-padding
17926
- ) - var(--toggle-padding)
17931
+ ) *
17932
+ 3
17927
17933
  )
17928
17934
  );
17929
17935
  }