@mantine/core 7.7.2 → 7.8.0

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.
Files changed (145) hide show
  1. package/cjs/components/NumberInput/NumberInput.cjs +3 -1
  2. package/cjs/components/NumberInput/NumberInput.cjs.map +1 -1
  3. package/cjs/components/Popover/use-popover.cjs +31 -8
  4. package/cjs/components/Popover/use-popover.cjs.map +1 -1
  5. package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.cjs +1 -1
  6. package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.cjs.map +1 -1
  7. package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.cjs +1 -1
  8. package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.cjs.map +1 -1
  9. package/cjs/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.cjs +1 -1
  10. package/cjs/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.cjs.map +1 -1
  11. package/cjs/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.cjs +1 -1
  12. package/cjs/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.cjs.map +1 -1
  13. package/cjs/core/utils/units-converters/rem.cjs +7 -1
  14. package/cjs/core/utils/units-converters/rem.cjs.map +1 -1
  15. package/esm/components/NumberInput/NumberInput.mjs +3 -1
  16. package/esm/components/NumberInput/NumberInput.mjs.map +1 -1
  17. package/esm/components/Popover/use-popover.mjs +31 -8
  18. package/esm/components/Popover/use-popover.mjs.map +1 -1
  19. package/esm/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.mjs +2 -2
  20. package/esm/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.mjs.map +1 -1
  21. package/esm/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.mjs +2 -2
  22. package/esm/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.mjs.map +1 -1
  23. package/esm/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.mjs +2 -2
  24. package/esm/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.mjs.map +1 -1
  25. package/esm/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.mjs +2 -2
  26. package/esm/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.mjs.map +1 -1
  27. package/esm/core/utils/units-converters/rem.mjs +7 -1
  28. package/esm/core/utils/units-converters/rem.mjs.map +1 -1
  29. package/lib/components/NumberInput/NumberInput.d.ts +2 -0
  30. package/lib/components/Popover/Popover.types.d.ts +5 -4
  31. package/package.json +3 -3
  32. package/styles/Accordion.css +3 -3
  33. package/styles/Accordion.layer.css +3 -3
  34. package/styles/ActionIcon.css +14 -14
  35. package/styles/ActionIcon.layer.css +14 -14
  36. package/styles/Alert.css +6 -6
  37. package/styles/Alert.layer.css +6 -6
  38. package/styles/AppShell.css +17 -15
  39. package/styles/AppShell.layer.css +17 -15
  40. package/styles/Avatar.css +8 -8
  41. package/styles/Avatar.layer.css +8 -8
  42. package/styles/Badge.css +19 -19
  43. package/styles/Badge.layer.css +19 -19
  44. package/styles/Blockquote.css +1 -1
  45. package/styles/Blockquote.layer.css +1 -1
  46. package/styles/Burger.css +6 -6
  47. package/styles/Burger.layer.css +6 -6
  48. package/styles/Button.css +26 -26
  49. package/styles/Button.layer.css +26 -26
  50. package/styles/Card.css +2 -2
  51. package/styles/Card.layer.css +2 -2
  52. package/styles/Checkbox.css +6 -6
  53. package/styles/Checkbox.layer.css +6 -6
  54. package/styles/Chip.css +37 -37
  55. package/styles/Chip.layer.css +37 -37
  56. package/styles/CloseButton.css +5 -5
  57. package/styles/CloseButton.layer.css +5 -5
  58. package/styles/Code.css +1 -1
  59. package/styles/Code.layer.css +1 -1
  60. package/styles/ColorInput.css +11 -11
  61. package/styles/ColorInput.layer.css +11 -11
  62. package/styles/ColorPicker.css +44 -44
  63. package/styles/ColorPicker.layer.css +44 -44
  64. package/styles/ColorSwatch.css +6 -6
  65. package/styles/ColorSwatch.layer.css +6 -6
  66. package/styles/Combobox.css +15 -15
  67. package/styles/Combobox.layer.css +15 -15
  68. package/styles/Container.css +5 -5
  69. package/styles/Container.layer.css +5 -5
  70. package/styles/Dialog.css +6 -6
  71. package/styles/Dialog.layer.css +6 -6
  72. package/styles/Divider.css +7 -7
  73. package/styles/Divider.layer.css +7 -7
  74. package/styles/Drawer.css +5 -5
  75. package/styles/Drawer.layer.css +5 -5
  76. package/styles/Fieldset.css +2 -2
  77. package/styles/Fieldset.layer.css +2 -2
  78. package/styles/Indicator.css +4 -4
  79. package/styles/Indicator.layer.css +4 -4
  80. package/styles/InlineInput.css +5 -5
  81. package/styles/InlineInput.layer.css +5 -5
  82. package/styles/Input.css +20 -20
  83. package/styles/Input.layer.css +20 -20
  84. package/styles/Kbd.css +12 -12
  85. package/styles/Kbd.layer.css +12 -12
  86. package/styles/Loader.css +7 -7
  87. package/styles/Loader.layer.css +7 -7
  88. package/styles/Menu.css +4 -4
  89. package/styles/Menu.layer.css +4 -4
  90. package/styles/Modal.css +5 -5
  91. package/styles/Modal.layer.css +5 -5
  92. package/styles/ModalBase.css +1 -1
  93. package/styles/ModalBase.layer.css +1 -1
  94. package/styles/NavLink.css +1 -1
  95. package/styles/NavLink.layer.css +1 -1
  96. package/styles/Notification.css +9 -9
  97. package/styles/Notification.layer.css +9 -9
  98. package/styles/NumberInput.css +12 -12
  99. package/styles/NumberInput.layer.css +12 -12
  100. package/styles/Pagination.css +6 -6
  101. package/styles/Pagination.layer.css +6 -6
  102. package/styles/Paper.css +2 -2
  103. package/styles/Paper.layer.css +2 -2
  104. package/styles/PasswordInput.css +11 -11
  105. package/styles/PasswordInput.layer.css +11 -11
  106. package/styles/Pill.css +17 -17
  107. package/styles/Pill.layer.css +17 -17
  108. package/styles/PillsInput.css +3 -3
  109. package/styles/PillsInput.layer.css +3 -3
  110. package/styles/PinInput.css +5 -5
  111. package/styles/PinInput.layer.css +5 -5
  112. package/styles/Popover.css +2 -2
  113. package/styles/Popover.layer.css +2 -2
  114. package/styles/Progress.css +8 -8
  115. package/styles/Progress.layer.css +8 -8
  116. package/styles/Radio.css +11 -11
  117. package/styles/Radio.layer.css +11 -11
  118. package/styles/Rating.css +7 -7
  119. package/styles/Rating.layer.css +7 -7
  120. package/styles/ScrollArea.css +3 -3
  121. package/styles/ScrollArea.layer.css +3 -3
  122. package/styles/SegmentedControl.css +10 -10
  123. package/styles/SegmentedControl.layer.css +10 -10
  124. package/styles/Slider.css +11 -11
  125. package/styles/Slider.layer.css +11 -11
  126. package/styles/Spoiler.css +2 -2
  127. package/styles/Spoiler.layer.css +2 -2
  128. package/styles/Stepper.css +10 -10
  129. package/styles/Stepper.layer.css +10 -10
  130. package/styles/Switch.css +34 -34
  131. package/styles/Switch.layer.css +34 -34
  132. package/styles/Table.css +3 -3
  133. package/styles/Table.layer.css +3 -3
  134. package/styles/Tabs.css +23 -23
  135. package/styles/Tabs.layer.css +23 -23
  136. package/styles/ThemeIcon.css +6 -6
  137. package/styles/ThemeIcon.layer.css +6 -6
  138. package/styles/Timeline.css +3 -3
  139. package/styles/Timeline.layer.css +3 -3
  140. package/styles/TypographyStylesProvider.css +10 -10
  141. package/styles/TypographyStylesProvider.layer.css +10 -10
  142. package/styles/global.css +5 -5
  143. package/styles/global.layer.css +5 -5
  144. package/styles.css +65 -63
  145. package/styles.layer.css +65 -63
package/styles/Tabs.css CHANGED
@@ -7,7 +7,7 @@
7
7
  --tabs-panel-grow: unset;
8
8
  --tabs-display: block;
9
9
  --tabs-flex-direction: row;
10
- --tabs-list-border-width: 0rem;
10
+ --tabs-list-border-width: 0;
11
11
  --tabs-list-border-size: 0 0 var(--tabs-list-border-width) 0;
12
12
  --tabs-list-gap: unset;
13
13
 
@@ -79,7 +79,7 @@
79
79
  }
80
80
 
81
81
  .m_89d60db1[data-variant='default'] {
82
- --tabs-list-border-width: calc(0.125rem * var(--mantine-scale));
82
+ --tabs-list-border-width: 2px;
83
83
  }
84
84
 
85
85
  [data-mantine-color-scheme='light'] .m_89d60db1[data-variant='default'] {
@@ -91,7 +91,7 @@
91
91
  }
92
92
 
93
93
  .m_89d60db1[data-variant='outline'] {
94
- --tabs-list-border-width: calc(0.0625rem * var(--mantine-scale));
94
+ --tabs-list-border-width: 1px;
95
95
  }
96
96
 
97
97
  .m_89d60db1[data-variant='pills'] {
@@ -257,10 +257,10 @@
257
257
  }
258
258
 
259
259
  .m_b59ab47c {
260
- border-top: calc(0.0625rem * var(--mantine-scale)) solid transparent;
261
- border-bottom: calc(0.0625rem * var(--mantine-scale)) solid transparent;
262
- border-right: calc(0.0625rem * var(--mantine-scale)) solid transparent;
263
- border-left: calc(0.0625rem * var(--mantine-scale)) solid transparent;
260
+ border-top: 1px solid transparent;
261
+ border-bottom: 1px solid transparent;
262
+ border-right: 1px solid transparent;
263
+ border-left: 1px solid transparent;
264
264
  border-top-color: var(--tab-border-top-color);
265
265
  border-bottom-color: var(--tab-border-bottom-color);
266
266
  border-radius: var(--tab-radius);
@@ -280,8 +280,8 @@
280
280
  left: var(--tab-before-left, calc(-0.0625rem * var(--mantine-scale)));
281
281
  right: var(--tab-before-right, auto);
282
282
  top: var(--tab-before-top, auto);
283
- width: calc(0.0625rem * var(--mantine-scale));
284
- height: calc(0.0625rem * var(--mantine-scale));
283
+ width: 1px;
284
+ height: 1px;
285
285
  }
286
286
 
287
287
  .m_b59ab47c:where([data-active])::after {
@@ -292,8 +292,8 @@
292
292
  right: var(--tab-after-right, calc(-0.0625rem * var(--mantine-scale)));
293
293
  left: var(--tab-after-left, auto);
294
294
  top: var(--tab-after-top, auto);
295
- width: calc(0.0625rem * var(--mantine-scale));
296
- height: calc(0.0625rem * var(--mantine-scale));
295
+ width: 1px;
296
+ height: 1px;
297
297
  }
298
298
 
299
299
  .m_b59ab47c:where([data-active]) {
@@ -314,9 +314,9 @@
314
314
  --tab-border-top-color: var(--mantine-color-body);
315
315
 
316
316
  --tab-before-bottom: auto;
317
- --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
317
+ --tab-before-top: -1px;
318
318
  --tab-after-bottom: auto;
319
- --tab-after-top: calc(-0.0625rem * var(--mantine-scale));
319
+ --tab-after-top: -1px;
320
320
  }
321
321
 
322
322
  .m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='left'] {
@@ -324,18 +324,18 @@
324
324
  --tab-border-inline-start-color: var(--tab-border-color);
325
325
  --tab-border-bottom-color: var(--tab-border-color);
326
326
 
327
- --tab-before-right: calc(-0.0625rem * var(--mantine-scale));
327
+ --tab-before-right: -1px;
328
328
  --tab-before-left: auto;
329
329
  --tab-before-bottom: auto;
330
- --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
330
+ --tab-before-top: -1px;
331
331
  --tab-after-left: auto;
332
- --tab-after-right: calc(-0.0625rem * var(--mantine-scale));
332
+ --tab-after-right: -1px;
333
333
  }
334
334
 
335
335
  [dir="rtl"] .m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='left'] {
336
336
  --tab-before-right: auto;
337
- --tab-before-left: calc(-0.0625rem * var(--mantine-scale));
338
- --tab-after-left: calc(-0.0625rem * var(--mantine-scale));
337
+ --tab-before-left: -1px;
338
+ --tab-after-left: -1px;
339
339
  --tab-after-right: auto;
340
340
  }
341
341
 
@@ -344,18 +344,18 @@
344
344
  --tab-border-inline-end-color: var(--tab-border-color);
345
345
  --tab-border-bottom-color: var(--tab-border-color);
346
346
 
347
- --tab-before-left: calc(-0.0625rem * var(--mantine-scale));
347
+ --tab-before-left: -1px;
348
348
  --tab-before-right: auto;
349
349
  --tab-before-bottom: auto;
350
- --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
350
+ --tab-before-top: -1px;
351
351
  --tab-after-right: auto;
352
- --tab-after-left: calc(-0.0625rem * var(--mantine-scale));
352
+ --tab-after-left: -1px;
353
353
  }
354
354
 
355
355
  [dir="rtl"] .m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='right'] {
356
356
  --tab-before-left: auto;
357
- --tab-before-right: calc(-0.0625rem * var(--mantine-scale));
358
- --tab-after-right: calc(-0.0625rem * var(--mantine-scale));
357
+ --tab-before-right: -1px;
358
+ --tab-after-right: -1px;
359
359
  --tab-after-left: auto;
360
360
  }
361
361
 
package/styles/Tabs.layer.css CHANGED
@@ -7,7 +7,7 @@
7
7
  --tabs-panel-grow: unset;
8
8
  --tabs-display: block;
9
9
  --tabs-flex-direction: row;
10
- --tabs-list-border-width: 0rem;
10
+ --tabs-list-border-width: 0;
11
11
  --tabs-list-border-size: 0 0 var(--tabs-list-border-width) 0;
12
12
  --tabs-list-gap: unset;
13
13
 
@@ -79,7 +79,7 @@
79
79
  }
80
80
 
81
81
  .m_89d60db1[data-variant='default'] {
82
- --tabs-list-border-width: calc(0.125rem * var(--mantine-scale));
82
+ --tabs-list-border-width: 2px;
83
83
  }
84
84
 
85
85
  [data-mantine-color-scheme='light'] .m_89d60db1[data-variant='default'] {
@@ -91,7 +91,7 @@
91
91
  }
92
92
 
93
93
  .m_89d60db1[data-variant='outline'] {
94
- --tabs-list-border-width: calc(0.0625rem * var(--mantine-scale));
94
+ --tabs-list-border-width: 1px;
95
95
  }
96
96
 
97
97
  .m_89d60db1[data-variant='pills'] {
@@ -257,10 +257,10 @@
257
257
  }
258
258
 
259
259
  .m_b59ab47c {
260
- border-top: calc(0.0625rem * var(--mantine-scale)) solid transparent;
261
- border-bottom: calc(0.0625rem * var(--mantine-scale)) solid transparent;
262
- border-right: calc(0.0625rem * var(--mantine-scale)) solid transparent;
263
- border-left: calc(0.0625rem * var(--mantine-scale)) solid transparent;
260
+ border-top: 1px solid transparent;
261
+ border-bottom: 1px solid transparent;
262
+ border-right: 1px solid transparent;
263
+ border-left: 1px solid transparent;
264
264
  border-top-color: var(--tab-border-top-color);
265
265
  border-bottom-color: var(--tab-border-bottom-color);
266
266
  border-radius: var(--tab-radius);
@@ -280,8 +280,8 @@
280
280
  left: var(--tab-before-left, calc(-0.0625rem * var(--mantine-scale)));
281
281
  right: var(--tab-before-right, auto);
282
282
  top: var(--tab-before-top, auto);
283
- width: calc(0.0625rem * var(--mantine-scale));
284
- height: calc(0.0625rem * var(--mantine-scale));
283
+ width: 1px;
284
+ height: 1px;
285
285
  }
286
286
 
287
287
  .m_b59ab47c:where([data-active])::after {
@@ -292,8 +292,8 @@
292
292
  right: var(--tab-after-right, calc(-0.0625rem * var(--mantine-scale)));
293
293
  left: var(--tab-after-left, auto);
294
294
  top: var(--tab-after-top, auto);
295
- width: calc(0.0625rem * var(--mantine-scale));
296
- height: calc(0.0625rem * var(--mantine-scale));
295
+ width: 1px;
296
+ height: 1px;
297
297
  }
298
298
 
299
299
  .m_b59ab47c:where([data-active]) {
@@ -314,9 +314,9 @@
314
314
  --tab-border-top-color: var(--mantine-color-body);
315
315
 
316
316
  --tab-before-bottom: auto;
317
- --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
317
+ --tab-before-top: -1px;
318
318
  --tab-after-bottom: auto;
319
- --tab-after-top: calc(-0.0625rem * var(--mantine-scale));
319
+ --tab-after-top: -1px;
320
320
  }
321
321
 
322
322
  .m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='left'] {
@@ -324,18 +324,18 @@
324
324
  --tab-border-inline-start-color: var(--tab-border-color);
325
325
  --tab-border-bottom-color: var(--tab-border-color);
326
326
 
327
- --tab-before-right: calc(-0.0625rem * var(--mantine-scale));
327
+ --tab-before-right: -1px;
328
328
  --tab-before-left: auto;
329
329
  --tab-before-bottom: auto;
330
- --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
330
+ --tab-before-top: -1px;
331
331
  --tab-after-left: auto;
332
- --tab-after-right: calc(-0.0625rem * var(--mantine-scale));
332
+ --tab-after-right: -1px;
333
333
  }
334
334
 
335
335
  [dir="rtl"] .m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='left'] {
336
336
  --tab-before-right: auto;
337
- --tab-before-left: calc(-0.0625rem * var(--mantine-scale));
338
- --tab-after-left: calc(-0.0625rem * var(--mantine-scale));
337
+ --tab-before-left: -1px;
338
+ --tab-after-left: -1px;
339
339
  --tab-after-right: auto;
340
340
  }
341
341
 
@@ -344,18 +344,18 @@
344
344
  --tab-border-inline-end-color: var(--tab-border-color);
345
345
  --tab-border-bottom-color: var(--tab-border-color);
346
346
 
347
- --tab-before-left: calc(-0.0625rem * var(--mantine-scale));
347
+ --tab-before-left: -1px;
348
348
  --tab-before-right: auto;
349
349
  --tab-before-bottom: auto;
350
- --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
350
+ --tab-before-top: -1px;
351
351
  --tab-after-right: auto;
352
- --tab-after-left: calc(-0.0625rem * var(--mantine-scale));
352
+ --tab-after-left: -1px;
353
353
  }
354
354
 
355
355
  [dir="rtl"] .m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='right'] {
356
356
  --tab-before-left: auto;
357
- --tab-before-right: calc(-0.0625rem * var(--mantine-scale));
358
- --tab-after-right: calc(-0.0625rem * var(--mantine-scale));
357
+ --tab-before-right: -1px;
358
+ --tab-after-right: -1px;
359
359
  --tab-after-left: auto;
360
360
  }
361
361
 
package/styles/ThemeIcon.css CHANGED
@@ -1,9 +1,9 @@
1
1
  .m_7341320d {
2
- --ti-size-xs: calc(1.125rem * var(--mantine-scale));
3
- --ti-size-sm: calc(1.375rem * var(--mantine-scale));
4
- --ti-size-md: calc(1.75rem * var(--mantine-scale));
5
- --ti-size-lg: calc(2.125rem * var(--mantine-scale));
6
- --ti-size-xl: calc(2.75rem * var(--mantine-scale));
2
+ --ti-size-xs: 18px;
3
+ --ti-size-sm: 22px;
4
+ --ti-size-md: 28px;
5
+ --ti-size-lg: 34px;
6
+ --ti-size-xl: 44px;
7
7
  --ti-size: var(--ti-size-md);
8
8
 
9
9
  line-height: 1;
@@ -20,5 +20,5 @@
20
20
  border-radius: var(--ti-radius, var(--mantine-radius-default));
21
21
  background: var(--ti-bg, var(--mantine-primary-color-filled));
22
22
  color: var(--ti-color, var(--mantine-color-white));
23
- border: var(--ti-bd, calc(0.0625rem * var(--mantine-scale)) solid transparent);
23
+ border: var(--ti-bd, 1px solid transparent);
24
24
  }
package/styles/ThemeIcon.layer.css CHANGED
@@ -1,9 +1,9 @@
1
1
  @layer mantine {.m_7341320d {
2
- --ti-size-xs: calc(1.125rem * var(--mantine-scale));
3
- --ti-size-sm: calc(1.375rem * var(--mantine-scale));
4
- --ti-size-md: calc(1.75rem * var(--mantine-scale));
5
- --ti-size-lg: calc(2.125rem * var(--mantine-scale));
6
- --ti-size-xl: calc(2.75rem * var(--mantine-scale));
2
+ --ti-size-xs: 18px;
3
+ --ti-size-sm: 22px;
4
+ --ti-size-md: 28px;
5
+ --ti-size-lg: 34px;
6
+ --ti-size-xl: 44px;
7
7
  --ti-size: var(--ti-size-md);
8
8
 
9
9
  line-height: 1;
@@ -20,6 +20,6 @@
20
20
  border-radius: var(--ti-radius, var(--mantine-radius-default));
21
21
  background: var(--ti-bg, var(--mantine-primary-color-filled));
22
22
  color: var(--ti-color, var(--mantine-color-white));
23
- border: var(--ti-bd, calc(0.0625rem * var(--mantine-scale)) solid transparent);
23
+ border: var(--ti-bd, 1px solid transparent);
24
24
  }
25
25
  }
package/styles/Timeline.css CHANGED
@@ -1,8 +1,8 @@
1
1
  .m_43657ece {
2
2
  --offset: calc(var(--tl-bullet-size) / 2 + var(--tl-line-width) / 2);
3
- --tl-bullet-size: calc(1.25rem * var(--mantine-scale));
4
- --tl-line-width: calc(0.25rem * var(--mantine-scale));
5
- --tl-radius: calc(62.5rem * var(--mantine-scale));
3
+ --tl-bullet-size: 20px;
4
+ --tl-line-width: 4px;
5
+ --tl-radius: 1000px;
6
6
  --tl-color: var(--mantine-primary-color-filled);
7
7
  }
8
8
 
package/styles/Timeline.layer.css CHANGED
@@ -1,8 +1,8 @@
1
1
  @layer mantine {.m_43657ece {
2
2
  --offset: calc(var(--tl-bullet-size) / 2 + var(--tl-line-width) / 2);
3
- --tl-bullet-size: calc(1.25rem * var(--mantine-scale));
4
- --tl-line-width: calc(0.25rem * var(--mantine-scale));
5
- --tl-radius: calc(62.5rem * var(--mantine-scale));
3
+ --tl-bullet-size: 20px;
4
+ --tl-line-width: 4px;
5
+ --tl-radius: 1000px;
6
6
  --tl-color: var(--mantine-primary-color-filled);
7
7
  }
8
8
 
package/styles/TypographyStylesProvider.css CHANGED
@@ -78,7 +78,7 @@
78
78
  margin-top: var(--mantine-spacing-md);
79
79
  margin-bottom: var(--mantine-spacing-md);
80
80
  border: 0;
81
- border-top: calc(0.0625rem * var(--mantine-scale)) solid;
81
+ border-top: 1px solid;
82
82
  }
83
83
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(hr) {
84
84
  border-color: var(--mantine-color-gray-3);
@@ -111,8 +111,8 @@
111
111
  border: 0;
112
112
  }
113
113
  .m_d6493fad :where(kbd) {
114
- --kbd-fz: calc(0.75rem * var(--mantine-scale));
115
- --kbd-padding: calc(0.1875rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
114
+ --kbd-fz: 12px;
115
+ --kbd-padding: 3px 5px;
116
116
 
117
117
  font-family: var(--mantine-font-family-monospace);
118
118
  line-height: var(--mantine-line-height);
@@ -120,8 +120,8 @@
120
120
  padding: var(--kbd-padding);
121
121
  font-size: var(--kbd-fz);
122
122
  border-radius: var(--mantine-radius-sm);
123
- border: calc(0.0625rem * var(--mantine-scale)) solid;
124
- border-bottom-width: calc(0.1875rem * var(--mantine-scale));
123
+ border: 1px solid;
124
+ border-bottom-width: 3px;
125
125
  }
126
126
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(kbd) {
127
127
  border-color: var(--mantine-color-gray-3);
@@ -135,7 +135,7 @@
135
135
  }
136
136
  .m_d6493fad :where(code) {
137
137
  line-height: var(--mantine-line-height);
138
- padding: calc(0.0625rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
138
+ padding: 1px 5px;
139
139
  border-radius: var(--mantine-radius-sm);
140
140
  font-family: var(--mantine-font-family-monospace);
141
141
  font-size: var(--mantine-font-size-xs);
@@ -150,7 +150,7 @@
150
150
  }
151
151
  .m_d6493fad :where(ul, ol):not([data-type='taskList']) {
152
152
  margin-bottom: var(--mantine-spacing-md);
153
- padding-inline-start: calc(2.375rem * var(--mantine-scale));
153
+ padding-inline-start: 38px;
154
154
  }
155
155
  .m_d6493fad :where(ul, ol):not([data-type='taskList']) :where(li) {
156
156
  margin-bottom: var(--mantine-spacing-xs);
@@ -174,16 +174,16 @@
174
174
  padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
175
175
  }
176
176
  .m_d6493fad :where(table) :where(thead th) {
177
- border-bottom: calc(0.0625rem * var(--mantine-scale)) solid;
177
+ border-bottom: 1px solid;
178
178
  border-color: var(--mantine-color-gray-3);
179
179
  }
180
180
  .m_d6493fad :where(table) :where(tfoot th) {
181
- border-top: calc(0.0625rem * var(--mantine-scale)) solid;
181
+ border-top: 1px solid;
182
182
  border-color: var(--mantine-color-gray-3);
183
183
  }
184
184
  .m_d6493fad :where(table) :where(td) {
185
185
  padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
186
- border-bottom: calc(0.0625rem * var(--mantine-scale)) solid;
186
+ border-bottom: 1px solid;
187
187
  border-color: var(--mantine-color-gray-3);
188
188
  font-size: var(--mantine-font-size-sm);
189
189
  }
package/styles/TypographyStylesProvider.layer.css CHANGED
@@ -78,7 +78,7 @@
78
78
  margin-top: var(--mantine-spacing-md);
79
79
  margin-bottom: var(--mantine-spacing-md);
80
80
  border: 0;
81
- border-top: calc(0.0625rem * var(--mantine-scale)) solid;
81
+ border-top: 1px solid;
82
82
  }
83
83
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(hr) {
84
84
  border-color: var(--mantine-color-gray-3);
@@ -111,8 +111,8 @@
111
111
  border: 0;
112
112
  }
113
113
  .m_d6493fad :where(kbd) {
114
- --kbd-fz: calc(0.75rem * var(--mantine-scale));
115
- --kbd-padding: calc(0.1875rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
114
+ --kbd-fz: 12px;
115
+ --kbd-padding: 3px 5px;
116
116
 
117
117
  font-family: var(--mantine-font-family-monospace);
118
118
  line-height: var(--mantine-line-height);
@@ -120,8 +120,8 @@
120
120
  padding: var(--kbd-padding);
121
121
  font-size: var(--kbd-fz);
122
122
  border-radius: var(--mantine-radius-sm);
123
- border: calc(0.0625rem * var(--mantine-scale)) solid;
124
- border-bottom-width: calc(0.1875rem * var(--mantine-scale));
123
+ border: 1px solid;
124
+ border-bottom-width: 3px;
125
125
  }
126
126
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(kbd) {
127
127
  border-color: var(--mantine-color-gray-3);
@@ -135,7 +135,7 @@
135
135
  }
136
136
  .m_d6493fad :where(code) {
137
137
  line-height: var(--mantine-line-height);
138
- padding: calc(0.0625rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
138
+ padding: 1px 5px;
139
139
  border-radius: var(--mantine-radius-sm);
140
140
  font-family: var(--mantine-font-family-monospace);
141
141
  font-size: var(--mantine-font-size-xs);
@@ -150,7 +150,7 @@
150
150
  }
151
151
  .m_d6493fad :where(ul, ol):not([data-type='taskList']) {
152
152
  margin-bottom: var(--mantine-spacing-md);
153
- padding-inline-start: calc(2.375rem * var(--mantine-scale));
153
+ padding-inline-start: 38px;
154
154
  }
155
155
  .m_d6493fad :where(ul, ol):not([data-type='taskList']) :where(li) {
156
156
  margin-bottom: var(--mantine-spacing-xs);
@@ -174,16 +174,16 @@
174
174
  padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
175
175
  }
176
176
  .m_d6493fad :where(table) :where(thead th) {
177
- border-bottom: calc(0.0625rem * var(--mantine-scale)) solid;
177
+ border-bottom: 1px solid;
178
178
  border-color: var(--mantine-color-gray-3);
179
179
  }
180
180
  .m_d6493fad :where(table) :where(tfoot th) {
181
- border-top: calc(0.0625rem * var(--mantine-scale)) solid;
181
+ border-top: 1px solid;
182
182
  border-color: var(--mantine-color-gray-3);
183
183
  }
184
184
  .m_d6493fad :where(table) :where(td) {
185
185
  padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
186
- border-bottom: calc(0.0625rem * var(--mantine-scale)) solid;
186
+ border-bottom: 1px solid;
187
187
  border-color: var(--mantine-color-gray-3);
188
188
  font-size: var(--mantine-font-size-sm);
189
189
  }
package/styles/global.css CHANGED
@@ -29,7 +29,7 @@ body {
29
29
  -webkit-font-smoothing: var(--mantine-webkit-font-smoothing);
30
30
  -moz-osx-font-smoothing: var(--mantine-moz-font-smoothing);
31
31
  }
32
- @media screen and (max-device-width: 500px) {
32
+ @media screen and (max-device-width: 31.25em) {
33
33
  body {
34
34
  -webkit-text-size-adjust: 100%
35
35
  }
@@ -51,13 +51,13 @@ body {
51
51
  }
52
52
 
53
53
  .mantine-focus-auto:focus-visible {
54
- outline: calc(0.125rem * var(--mantine-scale)) solid var(--mantine-primary-color-filled);
55
- outline-offset: calc(0.125rem * var(--mantine-scale));
54
+ outline: 2px solid var(--mantine-primary-color-filled);
55
+ outline-offset: 2px;
56
56
  }
57
57
 
58
58
  .mantine-focus-always:focus {
59
- outline: calc(0.125rem * var(--mantine-scale)) solid var(--mantine-primary-color-filled);
60
- outline-offset: calc(0.125rem * var(--mantine-scale));
59
+ outline: 2px solid var(--mantine-primary-color-filled);
60
+ outline-offset: 2px;
61
61
  }
62
62
 
63
63
  .mantine-focus-never:focus {
package/styles/global.layer.css CHANGED
@@ -29,7 +29,7 @@ body {
29
29
  -webkit-font-smoothing: var(--mantine-webkit-font-smoothing);
30
30
  -moz-osx-font-smoothing: var(--mantine-moz-font-smoothing);
31
31
  }
32
- @media screen and (max-device-width: 500px) {
32
+ @media screen and (max-device-width: 31.25em) {
33
33
  body {
34
34
  -webkit-text-size-adjust: 100%
35
35
  }
@@ -51,13 +51,13 @@ body {
51
51
  }
52
52
 
53
53
  .mantine-focus-auto:focus-visible {
54
- outline: calc(0.125rem * var(--mantine-scale)) solid var(--mantine-primary-color-filled);
55
- outline-offset: calc(0.125rem * var(--mantine-scale));
54
+ outline: 2px solid var(--mantine-primary-color-filled);
55
+ outline-offset: 2px;
56
56
  }
57
57
 
58
58
  .mantine-focus-always:focus {
59
- outline: calc(0.125rem * var(--mantine-scale)) solid var(--mantine-primary-color-filled);
60
- outline-offset: calc(0.125rem * var(--mantine-scale));
59
+ outline: 2px solid var(--mantine-primary-color-filled);
60
+ outline-offset: 2px;
61
61
  }
62
62
 
63
63
  .mantine-focus-never:focus {