@mantine/core 7.7.2 → 7.8.1

package/styles/ColorSwatch.css

@@ -1,6 +1,6 @@
 .m_de3d2490 {
-  --cs-size: calc(1.75rem * var(--mantine-scale));
-  --cs-radius: calc(62.5rem * var(--mantine-scale));
+  --cs-size: 28px;
+  --cs-radius: 1000px;
 
   -webkit-tap-highlight-color: transparent;
   border: none;
@@ -47,12 +47,12 @@
   position: absolute;
   inset: 0;
   border-radius: var(--cs-radius);
-  background-size: calc(0.5rem * var(--mantine-scale)) calc(0.5rem * var(--mantine-scale));
+  background-size: 8px 8px;
   background-position:
     0 0,
-    0 calc(0.25rem * var(--mantine-scale)),
-    calc(0.25rem * var(--mantine-scale)) calc(-0.25rem * var(--mantine-scale)),
-    calc(-0.25rem * var(--mantine-scale)) 0;
+    0 4px,
+    4px -4px,
+    -4px 0;
   background-image: linear-gradient(45deg, var(--alpha-overlay-color) 25%, transparent 25%),
     linear-gradient(-45deg, var(--alpha-overlay-color) 25%, transparent 25%),
     linear-gradient(45deg, transparent 75%, var(--alpha-overlay-color) 75%),

package/styles/ColorSwatch.layer.css

@@ -1,6 +1,6 @@
 @layer mantine {.m_de3d2490 {
-  --cs-size: calc(1.75rem * var(--mantine-scale));
-  --cs-radius: calc(62.5rem * var(--mantine-scale));
+  --cs-size: 28px;
+  --cs-radius: 1000px;
 
   -webkit-tap-highlight-color: transparent;
   border: none;
@@ -47,12 +47,12 @@
   position: absolute;
   inset: 0;
   border-radius: var(--cs-radius);
-  background-size: calc(0.5rem * var(--mantine-scale)) calc(0.5rem * var(--mantine-scale));
+  background-size: 8px 8px;
   background-position:
     0 0,
-    0 calc(0.25rem * var(--mantine-scale)),
-    calc(0.25rem * var(--mantine-scale)) calc(-0.25rem * var(--mantine-scale)),
-    calc(-0.25rem * var(--mantine-scale)) 0;
+    0 4px,
+    4px -4px,
+    -4px 0;
   background-image: linear-gradient(45deg, var(--alpha-overlay-color) 25%, transparent 25%),
     linear-gradient(-45deg, var(--alpha-overlay-color) 25%, transparent 25%),
     linear-gradient(45deg, transparent 75%, var(--alpha-overlay-color) 75%),

package/styles/Combobox.css

@@ -1,5 +1,5 @@
 .m_88b62a41 {
-  --combobox-padding: calc(0.25rem * var(--mantine-scale));
+  --combobox-padding: 4px;
   padding: var(--combobox-padding);
 }
 
@@ -10,11 +10,11 @@
 /* Variables must be both on dropdown and options to support usage of Combobox.Options without Combobox.Dropdown */
 .m_88b62a41,
 .m_b2821a6e {
-  --combobox-option-padding-xs: calc(0.25rem * var(--mantine-scale)) calc(0.5rem * var(--mantine-scale));
-  --combobox-option-padding-sm: calc(0.375rem * var(--mantine-scale)) calc(0.625rem * var(--mantine-scale));
-  --combobox-option-padding-md: calc(0.5rem * var(--mantine-scale)) calc(0.75rem * var(--mantine-scale));
-  --combobox-option-padding-lg: calc(0.625rem * var(--mantine-scale)) calc(1rem * var(--mantine-scale));
-  --combobox-option-padding-xl: calc(0.875rem * var(--mantine-scale)) calc(1.25rem * var(--mantine-scale));
+  --combobox-option-padding-xs: 4px 8px;
+  --combobox-option-padding-sm: 6px 10px;
+  --combobox-option-padding-md: 8px 12px;
+  --combobox-option-padding-lg: 10px 16px;
+  --combobox-option-padding-xl: 14px 20px;
   --combobox-option-padding: var(--combobox-option-padding-sm);
 }
 
@@ -110,13 +110,13 @@
 }
 
 .m_82b967cb {
-  border-top-width: calc(0.0625rem * var(--mantine-scale));
+  border-top-width: 1px;
   margin-top: var(--combobox-padding);
   margin-bottom: calc(var(--combobox-padding) * -1);
 }
 
 .m_858f94bd {
-  border-bottom-width: calc(0.0625rem * var(--mantine-scale));
+  border-bottom-width: 1px;
   margin-bottom: var(--combobox-padding);
   margin-top: calc(var(--combobox-padding) * -1);
 }
@@ -139,7 +139,7 @@
     content: '';
     flex: 1;
     inset-inline: 0;
-    height: calc(0.0625rem * var(--mantine-scale));
+    height: 1px;
     margin-inline-start: var(--mantine-spacing-xs);
   }
 
@@ -157,11 +157,11 @@
 
 /* ------- Combobox.Chevron ------- */
 .m_2943220b {
-  --combobox-chevron-size-xs: calc(0.875rem * var(--mantine-scale));
-  --combobox-chevron-size-sm: calc(1.125rem * var(--mantine-scale));
-  --combobox-chevron-size-md: calc(1.25rem * var(--mantine-scale));
-  --combobox-chevron-size-lg: calc(1.5rem * var(--mantine-scale));
-  --combobox-chevron-size-xl: calc(1.75rem * var(--mantine-scale));
+  --combobox-chevron-size-xs: 14px;
+  --combobox-chevron-size-sm: 18px;
+  --combobox-chevron-size-md: 20px;
+  --combobox-chevron-size-lg: 24px;
+  --combobox-chevron-size-xl: 28px;
   --combobox-chevron-size: var(--combobox-chevron-size-sm);
 
   width: var(--combobox-chevron-size);
@@ -181,7 +181,7 @@
 .m_390b5f4 {
   display: flex;
   align-items: center;
-  gap: calc(0.5rem * var(--mantine-scale));
+  gap: 8px;
 }
 .m_390b5f4:where([data-reverse]) {
     justify-content: space-between;

package/styles/Combobox.layer.css

@@ -1,5 +1,5 @@
 @layer mantine {.m_88b62a41 {
-  --combobox-padding: calc(0.25rem * var(--mantine-scale));
+  --combobox-padding: 4px;
   padding: var(--combobox-padding);
 }
 
@@ -10,11 +10,11 @@
 /* Variables must be both on dropdown and options to support usage of Combobox.Options without Combobox.Dropdown */
 .m_88b62a41,
 .m_b2821a6e {
-  --combobox-option-padding-xs: calc(0.25rem * var(--mantine-scale)) calc(0.5rem * var(--mantine-scale));
-  --combobox-option-padding-sm: calc(0.375rem * var(--mantine-scale)) calc(0.625rem * var(--mantine-scale));
-  --combobox-option-padding-md: calc(0.5rem * var(--mantine-scale)) calc(0.75rem * var(--mantine-scale));
-  --combobox-option-padding-lg: calc(0.625rem * var(--mantine-scale)) calc(1rem * var(--mantine-scale));
-  --combobox-option-padding-xl: calc(0.875rem * var(--mantine-scale)) calc(1.25rem * var(--mantine-scale));
+  --combobox-option-padding-xs: 4px 8px;
+  --combobox-option-padding-sm: 6px 10px;
+  --combobox-option-padding-md: 8px 12px;
+  --combobox-option-padding-lg: 10px 16px;
+  --combobox-option-padding-xl: 14px 20px;
   --combobox-option-padding: var(--combobox-option-padding-sm);
 }
 
@@ -110,13 +110,13 @@
 }
 
 .m_82b967cb {
-  border-top-width: calc(0.0625rem * var(--mantine-scale));
+  border-top-width: 1px;
   margin-top: var(--combobox-padding);
   margin-bottom: calc(var(--combobox-padding) * -1);
 }
 
 .m_858f94bd {
-  border-bottom-width: calc(0.0625rem * var(--mantine-scale));
+  border-bottom-width: 1px;
   margin-bottom: var(--combobox-padding);
   margin-top: calc(var(--combobox-padding) * -1);
 }
@@ -139,7 +139,7 @@
     content: '';
     flex: 1;
     inset-inline: 0;
-    height: calc(0.0625rem * var(--mantine-scale));
+    height: 1px;
     margin-inline-start: var(--mantine-spacing-xs);
   }
 
@@ -157,11 +157,11 @@
 
 /* ------- Combobox.Chevron ------- */
 .m_2943220b {
-  --combobox-chevron-size-xs: calc(0.875rem * var(--mantine-scale));
-  --combobox-chevron-size-sm: calc(1.125rem * var(--mantine-scale));
-  --combobox-chevron-size-md: calc(1.25rem * var(--mantine-scale));
-  --combobox-chevron-size-lg: calc(1.5rem * var(--mantine-scale));
-  --combobox-chevron-size-xl: calc(1.75rem * var(--mantine-scale));
+  --combobox-chevron-size-xs: 14px;
+  --combobox-chevron-size-sm: 18px;
+  --combobox-chevron-size-md: 20px;
+  --combobox-chevron-size-lg: 24px;
+  --combobox-chevron-size-xl: 28px;
   --combobox-chevron-size: var(--combobox-chevron-size-sm);
 
   width: var(--combobox-chevron-size);
@@ -181,7 +181,7 @@
 .m_390b5f4 {
   display: flex;
   align-items: center;
-  gap: calc(0.5rem * var(--mantine-scale));
+  gap: 8px;
 }
 .m_390b5f4:where([data-reverse]) {
     justify-content: space-between;

package/styles/Container.css

@@ -1,9 +1,9 @@
 .m_7485cace {
-  --container-size-xs: calc(33.75rem * var(--mantine-scale));
-  --container-size-sm: calc(45rem * var(--mantine-scale));
-  --container-size-md: calc(60rem * var(--mantine-scale));
-  --container-size-lg: calc(71.25rem * var(--mantine-scale));
-  --container-size-xl: calc(82.5rem * var(--mantine-scale));
+  --container-size-xs: 540px;
+  --container-size-sm: 720px;
+  --container-size-md: 960px;
+  --container-size-lg: 1140px;
+  --container-size-xl: 1320px;
   --container-size: var(--container-size-md);
 
   max-width: var(--container-size);

package/styles/Container.layer.css

@@ -1,9 +1,9 @@
 @layer mantine {.m_7485cace {
-  --container-size-xs: calc(33.75rem * var(--mantine-scale));
-  --container-size-sm: calc(45rem * var(--mantine-scale));
-  --container-size-md: calc(60rem * var(--mantine-scale));
-  --container-size-lg: calc(71.25rem * var(--mantine-scale));
-  --container-size-xl: calc(82.5rem * var(--mantine-scale));
+  --container-size-xs: 540px;
+  --container-size-sm: 720px;
+  --container-size-md: 960px;
+  --container-size-lg: 1140px;
+  --container-size-xl: 1320px;
   --container-size: var(--container-size-md);
 
   max-width: var(--container-size);

package/styles/Dialog.css

@@ -1,15 +1,15 @@
 .m_e2125a27 {
-  --dialog-size-xs: calc(10rem * var(--mantine-scale));
-  --dialog-size-sm: calc(12.5rem * var(--mantine-scale));
-  --dialog-size-md: calc(21.25rem * var(--mantine-scale));
-  --dialog-size-lg: calc(25rem * var(--mantine-scale));
-  --dialog-size-xl: calc(31.25rem * var(--mantine-scale));
+  --dialog-size-xs: 160px;
+  --dialog-size-sm: 200px;
+  --dialog-size-md: 340px;
+  --dialog-size-lg: 400px;
+  --dialog-size-xl: 500px;
   --dialog-size: var(--dialog-size-md);
 
   position: relative;
   width: var(--dialog-size);
   max-width: calc(100vw - var(--mantine-spacing-xl) * 2);
-  min-height: calc(3.125rem * var(--mantine-scale));
+  min-height: 50px;
 }
 
 .m_5abab665 {

package/styles/Dialog.layer.css

@@ -1,15 +1,15 @@
 @layer mantine {.m_e2125a27 {
-  --dialog-size-xs: calc(10rem * var(--mantine-scale));
-  --dialog-size-sm: calc(12.5rem * var(--mantine-scale));
-  --dialog-size-md: calc(21.25rem * var(--mantine-scale));
-  --dialog-size-lg: calc(25rem * var(--mantine-scale));
-  --dialog-size-xl: calc(31.25rem * var(--mantine-scale));
+  --dialog-size-xs: 160px;
+  --dialog-size-sm: 200px;
+  --dialog-size-md: 340px;
+  --dialog-size-lg: 400px;
+  --dialog-size-xl: 500px;
   --dialog-size: var(--dialog-size-md);
 
   position: relative;
   width: var(--dialog-size);
   max-width: calc(100vw - var(--mantine-spacing-xl) * 2);
-  min-height: calc(3.125rem * var(--mantine-scale));
+  min-height: 50px;
 }
 
 .m_5abab665 {

package/styles/Divider.css

@@ -1,9 +1,9 @@
 .m_3eebeb36 {
-  --divider-size-xs: calc(0.0625rem * var(--mantine-scale));
-  --divider-size-sm: calc(0.125rem * var(--mantine-scale));
-  --divider-size-md: calc(0.1875rem * var(--mantine-scale));
-  --divider-size-lg: calc(0.25rem * var(--mantine-scale));
-  --divider-size-xl: calc(0.3125rem * var(--mantine-scale));
+  --divider-size-xs: 1px;
+  --divider-size-sm: 2px;
+  --divider-size-md: 3px;
+  --divider-size-lg: 4px;
+  --divider-size-xl: 5px;
   --divider-size: var(--divider-size-xs);
 }
 
@@ -48,7 +48,7 @@
 .m_9e365f20::before {
     content: '';
     flex: 1;
-    height: calc(0.0625rem * var(--mantine-scale));
+    height: 1px;
     border-top: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
     margin-inline-end: var(--mantine-spacing-xs);
   }
@@ -56,7 +56,7 @@
 .m_9e365f20::after {
     content: '';
     flex: 1;
-    height: calc(0.0625rem * var(--mantine-scale));
+    height: 1px;
     border-top: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
     margin-inline-start: var(--mantine-spacing-xs);
   }

package/styles/Divider.layer.css

@@ -1,9 +1,9 @@
 @layer mantine {.m_3eebeb36 {
-  --divider-size-xs: calc(0.0625rem * var(--mantine-scale));
-  --divider-size-sm: calc(0.125rem * var(--mantine-scale));
-  --divider-size-md: calc(0.1875rem * var(--mantine-scale));
-  --divider-size-lg: calc(0.25rem * var(--mantine-scale));
-  --divider-size-xl: calc(0.3125rem * var(--mantine-scale));
+  --divider-size-xs: 1px;
+  --divider-size-sm: 2px;
+  --divider-size-md: 3px;
+  --divider-size-lg: 4px;
+  --divider-size-xl: 5px;
   --divider-size: var(--divider-size-xs);
 }
 
@@ -48,7 +48,7 @@
 .m_9e365f20::before {
     content: '';
     flex: 1;
-    height: calc(0.0625rem * var(--mantine-scale));
+    height: 1px;
     border-top: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
     margin-inline-end: var(--mantine-spacing-xs);
   }
@@ -56,7 +56,7 @@
 .m_9e365f20::after {
     content: '';
     flex: 1;
-    height: calc(0.0625rem * var(--mantine-scale));
+    height: 1px;
     border-top: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
     margin-inline-start: var(--mantine-spacing-xs);
   }

package/styles/Drawer.css

@@ -1,9 +1,9 @@
 .m_f11b401e {
-  --drawer-size-xs: calc(20rem * var(--mantine-scale));
-  --drawer-size-sm: calc(23.75rem * var(--mantine-scale));
-  --drawer-size-md: calc(27.5rem * var(--mantine-scale));
-  --drawer-size-lg: calc(38.75rem * var(--mantine-scale));
-  --drawer-size-xl: calc(48.75rem * var(--mantine-scale));
+  --drawer-size-xs: 320px;
+  --drawer-size-sm: 380px;
+  --drawer-size-md: 440px;
+  --drawer-size-lg: 620px;
+  --drawer-size-xl: 780px;
   --drawer-size: var(--drawer-size-md);
   --drawer-offset: 0rem;
 }

package/styles/Drawer.layer.css

@@ -1,9 +1,9 @@
 @layer mantine {.m_f11b401e {
-  --drawer-size-xs: calc(20rem * var(--mantine-scale));
-  --drawer-size-sm: calc(23.75rem * var(--mantine-scale));
-  --drawer-size-md: calc(27.5rem * var(--mantine-scale));
-  --drawer-size-lg: calc(38.75rem * var(--mantine-scale));
-  --drawer-size-xl: calc(48.75rem * var(--mantine-scale));
+  --drawer-size-xs: 320px;
+  --drawer-size-sm: 380px;
+  --drawer-size-md: 440px;
+  --drawer-size-lg: 620px;
+  --drawer-size-xl: 780px;
   --drawer-size: var(--drawer-size-md);
   --drawer-offset: 0rem;
 }

package/styles/Fieldset.css

@@ -6,7 +6,7 @@
 }
 
 .m_84c9523a {
-  border: calc(0.0625rem * var(--mantine-scale)) solid;
+  border: 1px solid;
 }
 
 :where([data-mantine-color-scheme='light']) .m_84c9523a {
@@ -20,7 +20,7 @@
 }
 
 .m_ef274e49 {
-  border: calc(0.0625rem * var(--mantine-scale)) solid;
+  border: 1px solid;
 }
 
 :where([data-mantine-color-scheme='light']) .m_ef274e49 {

package/styles/Fieldset.layer.css

@@ -6,7 +6,7 @@
 }
 
 .m_84c9523a {
-  border: calc(0.0625rem * var(--mantine-scale)) solid;
+  border: 1px solid;
 }
 
 :where([data-mantine-color-scheme='light']) .m_84c9523a {
@@ -20,7 +20,7 @@
 }
 
 .m_ef274e49 {
-  border: calc(0.0625rem * var(--mantine-scale)) solid;
+  border: 1px solid;
 }
 
 :where([data-mantine-color-scheme='light']) .m_ef274e49 {

package/styles/Indicator.css

@@ -11,7 +11,7 @@
 }
 
 .m_e5262200 {
-  --indicator-size: calc(0.625rem * var(--mantine-scale));
+  --indicator-size: 10px;
   --indicator-color: var(--mantine-primary-color-filled);
 
   position: relative;
@@ -31,7 +31,7 @@
   transform: translate(var(--indicator-translate-x), var(--indicator-translate-y));
   min-width: var(--indicator-size);
   height: var(--indicator-size);
-  border-radius: var(--indicator-radius, calc(62.5rem * var(--mantine-scale)));
+  border-radius: var(--indicator-radius, 1000rem);
   z-index: var(--indicator-z-index, 200);
   display: flex;
   align-items: center;
@@ -47,7 +47,7 @@
     position: absolute;
     inset: 0;
     background-color: var(--indicator-color);
-    border-radius: var(--indicator-radius, calc(62.5rem * var(--mantine-scale)));
+    border-radius: var(--indicator-radius, 1000rem);
     z-index: -1;
   }
 
@@ -56,7 +56,7 @@
   }
 
 .m_760d1fb1:where([data-with-border]) {
-    border: calc(0.125rem * var(--mantine-scale)) solid var(--mantine-color-body);
+    border: 2px solid var(--mantine-color-body);
   }
 
 .m_760d1fb1[data-processing]::before {

package/styles/Indicator.layer.css

@@ -11,7 +11,7 @@
 }
 
 .m_e5262200 {
-  --indicator-size: calc(0.625rem * var(--mantine-scale));
+  --indicator-size: 10px;
   --indicator-color: var(--mantine-primary-color-filled);
 
   position: relative;
@@ -31,7 +31,7 @@
   transform: translate(var(--indicator-translate-x), var(--indicator-translate-y));
   min-width: var(--indicator-size);
   height: var(--indicator-size);
-  border-radius: var(--indicator-radius, calc(62.5rem * var(--mantine-scale)));
+  border-radius: var(--indicator-radius, 1000rem);
   z-index: var(--indicator-z-index, 200);
   display: flex;
   align-items: center;
@@ -47,7 +47,7 @@
     position: absolute;
     inset: 0;
     background-color: var(--indicator-color);
-    border-radius: var(--indicator-radius, calc(62.5rem * var(--mantine-scale)));
+    border-radius: var(--indicator-radius, 1000rem);
     z-index: -1;
   }
 
@@ -56,7 +56,7 @@
   }
 
 .m_760d1fb1:where([data-with-border]) {
-    border: calc(0.125rem * var(--mantine-scale)) solid var(--mantine-color-body);
+    border: 2px solid var(--mantine-color-body);
   }
 
 .m_760d1fb1[data-processing]::before {

package/styles/InlineInput.css

@@ -1,9 +1,9 @@
 .m_5f75b09e {
-  --label-lh-xs: calc(1rem * var(--mantine-scale));
-  --label-lh-sm: calc(1.25rem * var(--mantine-scale));
-  --label-lh-md: calc(1.5rem * var(--mantine-scale));
-  --label-lh-lg: calc(1.875rem * var(--mantine-scale));
-  --label-lh-xl: calc(2.25rem * var(--mantine-scale));
+  --label-lh-xs: 16px;
+  --label-lh-sm: 20px;
+  --label-lh-md: 24px;
+  --label-lh-lg: 30px;
+  --label-lh-xl: 36px;
   --label-lh: var(--label-lh-sm);
 }
 

package/styles/InlineInput.layer.css

@@ -1,9 +1,9 @@
 @layer mantine {.m_5f75b09e {
-  --label-lh-xs: calc(1rem * var(--mantine-scale));
-  --label-lh-sm: calc(1.25rem * var(--mantine-scale));
-  --label-lh-md: calc(1.5rem * var(--mantine-scale));
-  --label-lh-lg: calc(1.875rem * var(--mantine-scale));
-  --label-lh-xl: calc(2.25rem * var(--mantine-scale));
+  --label-lh-xs: 16px;
+  --label-lh-sm: 20px;
+  --label-lh-md: 24px;
+  --label-lh-lg: 30px;
+  --label-lh-xl: 36px;
   --label-lh: var(--label-lh-sm);
 }
 

package/styles/Input.css

@@ -3,17 +3,17 @@
   margin-top: var(--input-margin-top, 0rem);
   margin-bottom: var(--input-margin-bottom, 0rem);
 
-  --input-height-xs: calc(1.875rem * var(--mantine-scale));
-  --input-height-sm: calc(2.25rem * var(--mantine-scale));
-  --input-height-md: calc(2.625rem * var(--mantine-scale));
-  --input-height-lg: calc(3.125rem * var(--mantine-scale));
-  --input-height-xl: calc(3.75rem * var(--mantine-scale));
-
-  --input-padding-y-xs: calc(0.3125rem * var(--mantine-scale));
-  --input-padding-y-sm: calc(0.375rem * var(--mantine-scale));
-  --input-padding-y-md: calc(0.5rem * var(--mantine-scale));
-  --input-padding-y-lg: calc(0.625rem * var(--mantine-scale));
-  --input-padding-y-xl: calc(0.8125rem * var(--mantine-scale));
+  --input-height-xs: 30px;
+  --input-height-sm: 36px;
+  --input-height-md: 42px;
+  --input-height-lg: 50px;
+  --input-height-xl: 60px;
+
+  --input-padding-y-xs: 5px;
+  --input-padding-y-sm: 6px;
+  --input-padding-y-md: 8px;
+  --input-padding-y-lg: 10px;
+  --input-padding-y-xl: 13px;
 
   --input-height: var(--input-height-sm);
   --input-radius: var(--mantine-radius-default);
@@ -36,11 +36,11 @@
 
   --input-size: var(--input-height);
 
-  --section-y: calc(0.0625rem * var(--mantine-scale));
-  --left-section-start: calc(0.0625rem * var(--mantine-scale));
+  --section-y: 1px;
+  --left-section-start: 1px;
   --left-section-border-radius: var(--input-radius) 0 0 var(--input-radius);
 
-  --right-section-end: calc(0.0625rem * var(--mantine-scale));
+  --right-section-end: 1px;
   --right-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;
 }
 
@@ -56,11 +56,11 @@
   }
 
   .m_6c018570[data-multiline] {
-    --input-padding-y-xs: calc(0.28125rem * var(--mantine-scale));
-    --input-padding-y-sm: calc(0.34375rem * var(--mantine-scale));
-    --input-padding-y-md: calc(0.4375rem * var(--mantine-scale));
-    --input-padding-y-lg: calc(0.59375rem * var(--mantine-scale));
-    --input-padding-y-xl: calc(0.8125rem * var(--mantine-scale));
+    --input-padding-y-xs: 4.5px;
+    --input-padding-y-sm: 5.5px;
+    --input-padding-y-md: 7px;
+    --input-padding-y-lg: 9.5px;
+    --input-padding-y-xl: 13px;
 
     --input-size: auto;
     --input-line-height: var(--mantine-line-height);
@@ -148,7 +148,7 @@
 
   text-align: var(--input-text-align);
   color: var(--input-color);
-  border: calc(0.0625rem * var(--mantine-scale)) solid var(--input-bd);
+  border: 1px solid var(--input-bd);
   background-color: var(--input-bg);
   font-family: var(--input-font-family, var(--mantine-font-family));
   height: var(--input-size);

package/styles/Input.layer.css

@@ -3,17 +3,17 @@
   margin-top: var(--input-margin-top, 0rem);
   margin-bottom: var(--input-margin-bottom, 0rem);
 
-  --input-height-xs: calc(1.875rem * var(--mantine-scale));
-  --input-height-sm: calc(2.25rem * var(--mantine-scale));
-  --input-height-md: calc(2.625rem * var(--mantine-scale));
-  --input-height-lg: calc(3.125rem * var(--mantine-scale));
-  --input-height-xl: calc(3.75rem * var(--mantine-scale));
-
-  --input-padding-y-xs: calc(0.3125rem * var(--mantine-scale));
-  --input-padding-y-sm: calc(0.375rem * var(--mantine-scale));
-  --input-padding-y-md: calc(0.5rem * var(--mantine-scale));
-  --input-padding-y-lg: calc(0.625rem * var(--mantine-scale));
-  --input-padding-y-xl: calc(0.8125rem * var(--mantine-scale));
+  --input-height-xs: 30px;
+  --input-height-sm: 36px;
+  --input-height-md: 42px;
+  --input-height-lg: 50px;
+  --input-height-xl: 60px;
+
+  --input-padding-y-xs: 5px;
+  --input-padding-y-sm: 6px;
+  --input-padding-y-md: 8px;
+  --input-padding-y-lg: 10px;
+  --input-padding-y-xl: 13px;
 
   --input-height: var(--input-height-sm);
   --input-radius: var(--mantine-radius-default);
@@ -36,11 +36,11 @@
 
   --input-size: var(--input-height);
 
-  --section-y: calc(0.0625rem * var(--mantine-scale));
-  --left-section-start: calc(0.0625rem * var(--mantine-scale));
+  --section-y: 1px;
+  --left-section-start: 1px;
   --left-section-border-radius: var(--input-radius) 0 0 var(--input-radius);
 
-  --right-section-end: calc(0.0625rem * var(--mantine-scale));
+  --right-section-end: 1px;
   --right-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;
 }
 
@@ -56,11 +56,11 @@
   }
 
   .m_6c018570[data-multiline] {
-    --input-padding-y-xs: calc(0.28125rem * var(--mantine-scale));
-    --input-padding-y-sm: calc(0.34375rem * var(--mantine-scale));
-    --input-padding-y-md: calc(0.4375rem * var(--mantine-scale));
-    --input-padding-y-lg: calc(0.59375rem * var(--mantine-scale));
-    --input-padding-y-xl: calc(0.8125rem * var(--mantine-scale));
+    --input-padding-y-xs: 4.5px;
+    --input-padding-y-sm: 5.5px;
+    --input-padding-y-md: 7px;
+    --input-padding-y-lg: 9.5px;
+    --input-padding-y-xl: 13px;
 
     --input-size: auto;
     --input-line-height: var(--mantine-line-height);
@@ -148,7 +148,7 @@
 
   text-align: var(--input-text-align);
   color: var(--input-color);
-  border: calc(0.0625rem * var(--mantine-scale)) solid var(--input-bd);
+  border: 1px solid var(--input-bd);
   background-color: var(--input-bg);
   font-family: var(--input-font-family, var(--mantine-font-family));
   height: var(--input-size);