@ardium-ui/ui 5.0.0-alpha.41 → 5.0.0-alpha.42

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 (35) hide show
  1. package/package.json +1 -1
  2. package/prebuilt-themes/default/buttons/button.css +1 -1
  3. package/prebuilt-themes/default/buttons/fab.css +1 -1
  4. package/prebuilt-themes/default/buttons/icon-button.css +6 -6
  5. package/prebuilt-themes/default/calendar.css +3 -3
  6. package/prebuilt-themes/default/inputs/autocomplete-input.css +11 -11
  7. package/prebuilt-themes/default/inputs/date-input.css +8 -8
  8. package/prebuilt-themes/default/inputs/file-input.css +11 -11
  9. package/prebuilt-themes/default/inputs/hex-input.css +9 -9
  10. package/prebuilt-themes/default/inputs/input.css +8 -8
  11. package/prebuilt-themes/default/inputs/number-input.css +8 -8
  12. package/prebuilt-themes/default/inputs/password-input.css +9 -9
  13. package/prebuilt-themes/default/inputs/search-bar.css +8 -8
  14. package/prebuilt-themes/default/segment.css +3 -3
  15. package/prebuilt-themes/default/select.css +13 -13
  16. package/prebuilt-themes/default/slider.css +7 -7
  17. package/prebuilt-themes/default/tabber.css +1 -1
  18. package/prebuilt-themes/default/table.css +8 -8
  19. package/themes/default/buttons/button.scss +1 -1
  20. package/themes/default/buttons/fab.scss +1 -1
  21. package/themes/default/buttons/icon-button.scss +6 -6
  22. package/themes/default/calendar.scss +3 -3
  23. package/themes/default/inputs/autocomplete-input.scss +11 -11
  24. package/themes/default/inputs/date-input.scss +8 -8
  25. package/themes/default/inputs/file-input.scss +11 -11
  26. package/themes/default/inputs/hex-input.scss +9 -9
  27. package/themes/default/inputs/input.scss +8 -8
  28. package/themes/default/inputs/number-input.scss +8 -8
  29. package/themes/default/inputs/password-input.scss +9 -9
  30. package/themes/default/inputs/search-bar.scss +8 -8
  31. package/themes/default/segment.scss +3 -3
  32. package/themes/default/select.scss +13 -13
  33. package/themes/default/slider.scss +7 -7
  34. package/themes/default/tabber.scss +1 -1
  35. package/themes/default/table.scss +8 -8
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ardium-ui/ui",
3
- "version": "5.0.0-alpha.41",
3
+ "version": "5.0.0-alpha.42",
4
4
  "peerDependencies": {
5
5
  "@angular/common": ">=18.0.0",
6
6
  "@angular/core": ">=18.0.0",
package/prebuilt-themes/default/buttons/button.css CHANGED
@@ -15,7 +15,7 @@
15
15
  --ard-button-overlay-active-opacity: 0.18;
16
16
  --ard-button-overlay-focus-visible-opacity: 0.24;
17
17
  --ard-button-overlay-disabled-opacity: 0.2;
18
- --ard-button-rounded-corner-radius: var(--ard-rounded-corner-radius, 0.375rem);
18
+ --ard-button-rounded-corner-radius: ;
19
19
  --ard-button-disabled-opacity: 0.6;
20
20
  }
21
21
 
package/prebuilt-themes/default/buttons/fab.css CHANGED
@@ -11,7 +11,7 @@
11
11
  --ard-fab-overlay-active-opacity: 0.18;
12
12
  --ard-fab-overlay-focus-visible-opacity: 0.24;
13
13
  --ard-fab-overlay-disabled-opacity: 0.2;
14
- --ard-fab-rounded-corner-radius: var(--ard-rounded-corner-radius, 0.375rem);
14
+ --ard-fab-rounded-corner-radius: ;
15
15
  --ard-fab-disabled-opacity: 0.6;
16
16
  }
17
17
 
package/prebuilt-themes/default/buttons/icon-button.css CHANGED
@@ -6,12 +6,12 @@
6
6
  --ard-icon-button-icon-font-size: 1.5em;
7
7
  --ard-icon-button-font-size-compact: 0.75rem;
8
8
  --ard-icon-button-font-weight: 600;
9
- --ard-icon-button-overlay-hover-opacity: var(--ard-button-overlay-hover-opacity, 0.04);
10
- --ard-icon-button-overlay-focus-opacity: var(--ard-button-overlay-focus-opacity, 0.12);
11
- --ard-icon-button-overlay-active-opacity: var(--ard-button-overlay-active-opacity, 0.18);
12
- --ard-icon-button-overlay-focus-visible-opacity: var(--ard-button-overlay-focus-visible-opacity, 0.24);
13
- --ard-icon-button-overlay-disabled-opacity: var(--ard-button-overlay-disabled-opacity, 0.2);
14
- --ard-icon-button-disabled-opacity: var(--ard-button-disabled-opacity, 0.6);
9
+ --ard-icon-button-overlay-hover-opacity: ;
10
+ --ard-icon-button-overlay-focus-opacity: ;
11
+ --ard-icon-button-overlay-active-opacity: ;
12
+ --ard-icon-button-overlay-focus-visible-opacity: ;
13
+ --ard-icon-button-overlay-disabled-opacity: ;
14
+ --ard-icon-button-disabled-opacity: ;
15
15
  }
16
16
 
17
17
  ard-icon-button {
package/prebuilt-themes/default/calendar.css CHANGED
@@ -6,19 +6,19 @@
6
6
  --ard-calendar-weekday-padding: 0 0 0.5rem 0;
7
7
  --ard-calendar-weekday-font-size: 0.875rem;
8
8
  --ard-calendar-weekday-font-weight: 500;
9
- --ard-calendar-weekday-color: var(--ard-text);
9
+ --ard-calendar-weekday-color: ;
10
10
  --ard-calendar-floating-month-transform: none;
11
11
  --ard-calendar-floating-month-padding: 0 0 0 1rem;
12
12
  --ard-calendar-floating-month-font-size: 0.875rem;
13
13
  --ard-calendar-floating-month-font-weight: 500;
14
- --ard-calendar-floating-month-color: var(--ard-text3);
14
+ --ard-calendar-floating-month-color: ;
15
15
  --ard-calendar-entry-padding: 0;
16
16
  --ard-calendar-entry-font-size: 0.875rem;
17
17
  --ard-calendar-entry-font-weight: 400;
18
18
  --ard-calendar-entry-border-radius: 9999px;
19
19
  --ard-calendar-entry-range-overlay-border-width: 1px;
20
20
  --ard-calendar-entry-range-overlay-border-style: dashed;
21
- --ard-calendar-entry-today-border-color: var(--ard-detail);
21
+ --ard-calendar-entry-today-border-color: ;
22
22
  --ard-calendar-entry-today-selected-border: 2px solid var(--ard-bg);
23
23
  --ard-calendar-entry-highlighted-overlay-opacity: 20%;
24
24
  --ard-calendar-entry-selected-overlay-opacity: 100%;
package/prebuilt-themes/default/inputs/autocomplete-input.css CHANGED
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-autocomplete-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-autocomplete-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-autocomplete-input-height: ;
6
+ --ard-autocomplete-input-height-compact: ;
7
7
  --ard-autocomplete-input-gap: 0.625rem;
8
- --ard-autocomplete-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-autocomplete-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-autocomplete-input-font-size: ;
9
+ --ard-autocomplete-input-font-size-compact: ;
10
10
  --ard-autocomplete-input-line-height: 1.25;
11
11
  --ard-autocomplete-input-line-height-compact: 1;
12
12
  --ard-autocomplete-input-font-weight: 400;
13
- --ard-autocomplete-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-autocomplete-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-autocomplete-input-color: var(--ard-text);
16
- --ard-autocomplete-input-placeholder-color: var(--ard-text);
13
+ --ard-autocomplete-input-padding: ;
14
+ --ard-autocomplete-input-padding-compact: ;
15
+ --ard-autocomplete-input-color: ;
16
+ --ard-autocomplete-input-placeholder-color: ;
17
17
  --ard-autocomplete-input-placeholder-opacity: 60%;
18
18
  --ard-autocomplete-input-min-width: 10rem;
19
19
  --ard-autocomplete-input-max-width: 100%;
@@ -25,10 +25,10 @@
25
25
  --ard-autocomplete-input-option-padding-compact: 0.25rem 0.5rem;
26
26
  --ard-autocomplete-input-font-size: 1rem;
27
27
  --ard-autocomplete-input-font-size-compact: 0.875rem;
28
- --ard-autocomplete-input-color: var(--ard-text2);
29
- --ard-autocomplete-input-highlighted-background: var(--ard-darken-overlay-light);
28
+ --ard-autocomplete-input-color: ;
29
+ --ard-autocomplete-input-highlighted-background: ;
30
30
  --ard-autocomplete-input-highlighted-font-weight: 400;
31
- --ard-autocomplete-input-selected-background: var(--ard-darken-overlay-medium);
31
+ --ard-autocomplete-input-selected-background: ;
32
32
  --ard-autocomplete-input-selected-font-weight: 500;
33
33
  --ard-autocomplete-input-disabled-opacity: 50%;
34
34
  }
package/prebuilt-themes/default/inputs/date-input.css CHANGED
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-date-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-date-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-date-input-height: ;
6
+ --ard-date-input-height-compact: ;
7
7
  --ard-date-input-gap: 0.625rem;
8
- --ard-date-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-date-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-date-input-font-size: ;
9
+ --ard-date-input-font-size-compact: ;
10
10
  --ard-date-input-line-height: 1.25;
11
11
  --ard-date-input-line-height-compact: 1;
12
12
  --ard-date-input-font-weight: 400;
13
- --ard-date-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-date-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-date-input-color: var(--ard-text);
16
- --ard-date-input-placeholder-color: var(--ard-text);
13
+ --ard-date-input-padding: ;
14
+ --ard-date-input-padding-compact: ;
15
+ --ard-date-input-color: ;
16
+ --ard-date-input-placeholder-color: ;
17
17
  --ard-date-input-placeholder-opacity: 60%;
18
18
  --ard-date-input-padding: 0 0 0 0.375rem;
19
19
  --ard-date-input-input-padding: 0 2.625rem 0 0.375rem;
package/prebuilt-themes/default/inputs/file-input.css CHANGED
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-file-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-file-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-file-input-height: ;
6
+ --ard-file-input-height-compact: ;
7
7
  --ard-file-input-gap: 0.625rem;
8
- --ard-file-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-file-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-file-input-font-size: ;
9
+ --ard-file-input-font-size-compact: ;
10
10
  --ard-file-input-line-height: 1.25;
11
11
  --ard-file-input-line-height-compact: 1;
12
12
  --ard-file-input-font-weight: 400;
13
- --ard-file-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-file-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-file-input-color: var(--ard-text);
16
- --ard-file-input-placeholder-color: var(--ard-text);
13
+ --ard-file-input-padding: ;
14
+ --ard-file-input-padding-compact: ;
15
+ --ard-file-input-color: ;
16
+ --ard-file-input-placeholder-color: ;
17
17
  --ard-file-input-placeholder-opacity: 60%;
18
18
  --ard-file-input-min-width: 10rem;
19
19
  --ard-file-input-max-width: 100%;
@@ -28,10 +28,10 @@
28
28
  --ard-file-input-browse-button-border-radius: 9999px;
29
29
  --ard-file-input-browse-button-background: none;
30
30
  --ard-file-input-browse-button-padding: 0;
31
- --ard-file-input-browse-button-color: var(--ard-text2);
32
- --ard-file-input-browse-button-color-error: rgb(var(--ard-danger-700));
31
+ --ard-file-input-browse-button-color: ;
32
+ --ard-file-input-browse-button-color-error: ;
33
33
  --ard-file-input-browse-button-overlay-offset: 0rem;
34
- --ard-file-input-browse-button-overlay-color: var(--ard-overlay);
34
+ --ard-file-input-browse-button-overlay-color: ;
35
35
  --ard-file-input-browse-button-overlay-hover-opacity: 4%;
36
36
  --ard-file-input-browse-button-overlay-focus-opacity: 0;
37
37
  --ard-file-input-browse-button-overlay-active-opacity: 12%;
package/prebuilt-themes/default/inputs/hex-input.css CHANGED
@@ -2,23 +2,23 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-hex-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-hex-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-hex-input-height: ;
6
+ --ard-hex-input-height-compact: ;
7
7
  --ard-hex-input-gap: 0.625rem;
8
- --ard-hex-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-hex-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-hex-input-font-size: ;
9
+ --ard-hex-input-font-size-compact: ;
10
10
  --ard-hex-input-line-height: 1.25;
11
11
  --ard-hex-input-line-height-compact: 1;
12
12
  --ard-hex-input-font-weight: 400;
13
- --ard-hex-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-hex-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-hex-input-color: var(--ard-text);
16
- --ard-hex-input-placeholder-color: var(--ard-text);
13
+ --ard-hex-input-padding: ;
14
+ --ard-hex-input-padding-compact: ;
15
+ --ard-hex-input-color: ;
16
+ --ard-hex-input-placeholder-color: ;
17
17
  --ard-hex-input-placeholder-opacity: 60%;
18
18
  --ard-hex-input-min-width: 10rem;
19
19
  --ard-hex-input-max-width: 100%;
20
20
  --ard-hex-input-hash-margin: 0 0 -0.5rem 0;
21
- --ard-hex-input-hash-color: var(--ard-text);
21
+ --ard-hex-input-hash-color: ;
22
22
  --ard-hex-input-hash-opacity: 70%;
23
23
  }
24
24
 
package/prebuilt-themes/default/inputs/input.css CHANGED
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-input-height: ;
6
+ --ard-input-height-compact: ;
7
7
  --ard-input-gap: 0.625rem;
8
- --ard-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-input-font-size: ;
9
+ --ard-input-font-size-compact: ;
10
10
  --ard-input-line-height: 1.25;
11
11
  --ard-input-line-height-compact: 1;
12
12
  --ard-input-font-weight: 400;
13
- --ard-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-input-color: var(--ard-text);
16
- --ard-input-placeholder-color: var(--ard-text);
13
+ --ard-input-padding: ;
14
+ --ard-input-padding-compact: ;
15
+ --ard-input-color: ;
16
+ --ard-input-placeholder-color: ;
17
17
  --ard-input-placeholder-opacity: 60%;
18
18
  --ard-input-min-width: 10rem;
19
19
  --ard-input-max-width: 100%;
package/prebuilt-themes/default/inputs/number-input.css CHANGED
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-number-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-number-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-number-input-height: ;
6
+ --ard-number-input-height-compact: ;
7
7
  --ard-number-input-gap: 0.625rem;
8
- --ard-number-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-number-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-number-input-font-size: ;
9
+ --ard-number-input-font-size-compact: ;
10
10
  --ard-number-input-line-height: 1.25;
11
11
  --ard-number-input-line-height-compact: 1;
12
12
  --ard-number-input-font-weight: 400;
13
- --ard-number-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-number-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-number-input-color: var(--ard-text);
16
- --ard-number-input-placeholder-color: var(--ard-text);
13
+ --ard-number-input-padding: ;
14
+ --ard-number-input-padding-compact: ;
15
+ --ard-number-input-color: ;
16
+ --ard-number-input-placeholder-color: ;
17
17
  --ard-number-input-placeholder-opacity: 60%;
18
18
  --ard-number-input-width: 9.5rem;
19
19
  --ard-number-input-rounded-border-radius: 8px;
package/prebuilt-themes/default/inputs/password-input.css CHANGED
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-password-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-password-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-password-input-height: ;
6
+ --ard-password-input-height-compact: ;
7
7
  --ard-password-input-gap: 0.625rem;
8
- --ard-password-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-password-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-password-input-font-size: ;
9
+ --ard-password-input-font-size-compact: ;
10
10
  --ard-password-input-line-height: 1.25;
11
11
  --ard-password-input-line-height-compact: 1;
12
12
  --ard-password-input-font-weight: 400;
13
- --ard-password-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-password-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-password-input-color: var(--ard-text);
16
- --ard-password-input-placeholder-color: var(--ard-text);
13
+ --ard-password-input-padding: ;
14
+ --ard-password-input-padding-compact: ;
15
+ --ard-password-input-color: ;
16
+ --ard-password-input-placeholder-color: ;
17
17
  --ard-password-input-placeholder-opacity: 60%;
18
18
  --ard-password-input-min-width: 10rem;
19
19
  --ard-password-input-max-width: 100%;
@@ -24,7 +24,7 @@
24
24
  --ard-password-input-reveal-button-width: unset;
25
25
  --ard-password-input-reveal-button-aspect-ratio: 1;
26
26
  --ard-password-input-reveal-button-padding: 0;
27
- --ard-password-input-reveal-button-color: var(--ard-text);
27
+ --ard-password-input-reveal-button-color: ;
28
28
  --ard-password-input-reveal-button-border-radius: 9999px;
29
29
  --ard-password-input-reveal-button-border: none;
30
30
  --ard-password-input-reveal-button-background: transparent;
package/prebuilt-themes/default/inputs/search-bar.css CHANGED
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-search-bar-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-search-bar-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-search-bar-height: ;
6
+ --ard-search-bar-height-compact: ;
7
7
  --ard-search-bar-gap: 0.625rem;
8
- --ard-search-bar-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-search-bar-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-search-bar-font-size: ;
9
+ --ard-search-bar-font-size-compact: ;
10
10
  --ard-search-bar-line-height: 1.25;
11
11
  --ard-search-bar-line-height-compact: 1;
12
12
  --ard-search-bar-font-weight: 400;
13
- --ard-search-bar-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-search-bar-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-search-bar-color: var(--ard-text);
16
- --ard-search-bar-placeholder-color: var(--ard-text);
13
+ --ard-search-bar-padding: ;
14
+ --ard-search-bar-padding-compact: ;
15
+ --ard-search-bar-color: ;
16
+ --ard-search-bar-placeholder-color: ;
17
17
  --ard-search-bar-placeholder-opacity: 60%;
18
18
  --ard-search-bar-min-width: 10rem;
19
19
  --ard-search-bar-max-width: 100%;
package/prebuilt-themes/default/segment.css CHANGED
@@ -1,8 +1,8 @@
1
1
  :root {
2
2
  --ard-segment-margin: 0;
3
3
  --ard-segment-padding: 0.15rem;
4
- --ard-segment-option-gap: var(--ard-segment-padding, 0.15rem);
5
- --ard-segment-font-family: var(--ard-font-family);
4
+ --ard-segment-option-gap: ;
5
+ --ard-segment-font-family: ;
6
6
  --ard-segment-font-size: 0.875rem;
7
7
  --ard-segment-font-size-compact: 0.75rem;
8
8
  --ard-segment-rounded-border-radius: 0.5rem;
@@ -17,7 +17,7 @@
17
17
  --ard-segment-option-active-bg-opacity: 12%;
18
18
  --ard-segment-option-active-keyboard-bg-opacity: 34%;
19
19
  --ard-segment-option-selected-bg-opacity: 16%;
20
- --ard-segment-border-color: var(--ard-border-light);
20
+ --ard-segment-border-color: ;
21
21
  }
22
22
 
23
23
  .ard-segment-container {
package/prebuilt-themes/default/select.css CHANGED
@@ -1,18 +1,18 @@
1
1
  :root {
2
- --ard-select-height: var(--ard-form-field-height, 2.3125rem);
3
- --ard-select-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
2
+ --ard-select-height: ;
3
+ --ard-select-height-compact: ;
4
4
  --ard-select-gap: 0.625rem;
5
5
  --ard-select-gap-compact: 0.5rem;
6
6
  --ard-select-controls-gap: 0.625rem;
7
7
  --ard-select-controls-gap-compact: 0.5rem;
8
8
  --ard-select-padding: 0 1em 0 0.375em;
9
9
  --ard-select-padding-compact: 0 0.625em 0 0.375em;
10
- --ard-select-font-size: var(--ard-form-field-font-size, 1rem);
11
- --ard-select-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
12
- --ard-select-text-color: var(--ard-text, rgba(0, 0, 0, 100%));
13
- --ard-select-placeholder-color: var(--ard-text3, rgba(0, 0, 0, 75%));
10
+ --ard-select-font-size: ;
11
+ --ard-select-font-size-compact: ;
12
+ --ard-select-text-color: ;
13
+ --ard-select-placeholder-color: ;
14
14
  --ard-select-search-min-width: 10ch;
15
- --ard-select-dropdown-arrow-color: var(--ard-detail, rgba(0, 0, 0, 60%));
15
+ --ard-select-dropdown-arrow-color: ;
16
16
  --ard-select-dropdown-arrow-active-transform: rotate(180deg);
17
17
  --ard-select-dropdown-arrow-transition: 0.2s ease-in-out;
18
18
  --ard-select-multiselect-padding: 0.25em 0;
@@ -21,8 +21,8 @@
21
21
  --ard-select-dropdown-max-width: max(25em, 100%);
22
22
  --ard-select-dropdown-min-width: 100%;
23
23
  --ard-select-dropdown-max-height: 15em;
24
- --ard-select-dropdown-font-size: var(--ard-select-font-size, var(--ard-form-field-font-size, 1rem));
25
- --ard-select-dropdown-font-size-compact: var(--ard-select-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
24
+ --ard-select-dropdown-font-size: ;
25
+ --ard-select-dropdown-font-size-compact: ;
26
26
  --ard-select-dropdown-padding: 0.375em 0.625em;
27
27
  --ard-select-dropdown-gap: 0;
28
28
  --ard-select-dropdown-optgroup-label-font-size: 0.875em;
@@ -30,11 +30,11 @@
30
30
  --ard-select-dropdown-optgroup-label-letter-spacing: 0.25px;
31
31
  --ard-select-dropdown-optgroup-label-padding: 0.375em 0.625em 0.0625em 0.625em;
32
32
  --ard-select-dropdown-option-padding: 0.375em 0.625em;
33
- --ard-select-dropdown-option-text-color: var(--ard-text2, rgba(0, 0, 0, 87%));
34
- --ard-select-dropdown-option-highlighted-bg: var(--ard-darken-overlay-light, rgba(0, 0, 0, 5%));
33
+ --ard-select-dropdown-option-text-color: ;
34
+ --ard-select-dropdown-option-highlighted-bg: ;
35
35
  --ard-select-dropdown-option-selected-font-weight: 500;
36
- --ard-select-dropdown-option-selected-bg: var(--ard-darken-overlay-medium, rgba(0, 0, 0, 10%));
37
- --ard-select-dropdown-option-selected-highlighted-bg: var(--ard-darken-overlay-medium-strong, rgba(0, 0, 0, 13%));
36
+ --ard-select-dropdown-option-selected-bg: ;
37
+ --ard-select-dropdown-option-selected-highlighted-bg: ;
38
38
  --ard-select-dropdown-option-disabled-opacity: 50%;
39
39
  --ard-select-dropdown-add-custom-gap: 0.375rem;
40
40
  --ard-select-dropdown-add-custom-label-font-size: 85%;
package/prebuilt-themes/default/slider.css CHANGED
@@ -1,20 +1,20 @@
1
1
  :root {
2
- --ard-slider-font-size: var(--ard-form-field-font-size, 1rem);
3
- --ard-slider-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
2
+ --ard-slider-font-size: ;
3
+ --ard-slider-font-size-compact: ;
4
4
  --ard-slider-width: 100%;
5
5
  --ard-slider-padding: 0 calc(var(--ard-slider-handle-size, 1.25em) / 2);
6
6
  --ard-slider-track-height: 0.25em;
7
- --ard-slider-track-color: var(--ard-cmpcl--bg-colored);
7
+ --ard-slider-track-color: ;
8
8
  --ard-slider-track-opacity: 20%;
9
9
  --ard-slider-track-border-radius: 9999px;
10
10
  --ard-slider-active-track-height: calc(100% + 0.125em);
11
- --ard-slider-active-color: var(--ard-cmpcl--bg-colored);
11
+ --ard-slider-active-color: ;
12
12
  --ard-slider-active-track-opacity: 100%;
13
13
  --ard-slider-value-tick-size: 0.125em;
14
14
  --ard-slider-value-tick-opacity: 30%;
15
15
  --ard-slider-track-hitbox-size: calc(var(--ard-slider-handle-size, 1.25em) / 2);
16
16
  --ard-slider-handle-size: 1.25em;
17
- --ard-slider-handle-bg: var(--ard-cmpcl--bg-colored);
17
+ --ard-slider-handle-bg: ;
18
18
  --ard-slider-handle-border: none;
19
19
  --ard-slider-handle-border-radius: 9999px;
20
20
  --ard-slider-handle-hitbox-size: 0.375em;
@@ -24,8 +24,8 @@
24
24
  --ard-slider-handle-overlay-active-opacity: 25%;
25
25
  --ard-slider-label-font-size: 0.875rem;
26
26
  --ard-slider-label-padding-top: 0.2em;
27
- --ard-slider-label-bg: var(--ard-text3);
28
- --ard-slider-label-color: var(--ard-text2-alt);
27
+ --ard-slider-label-bg: ;
28
+ --ard-slider-label-color: ;
29
29
  --ard-slider-label-height: 2em;
30
30
  --ard-slider-label-border: none;
31
31
  --ard-slider-label-border-radius: 0.375em;
package/prebuilt-themes/default/tabber.css CHANGED
@@ -8,7 +8,7 @@
8
8
  --ard-tabber-tab-gap: 0;
9
9
  --ard-tabber-tab-content-gap: 0.375rem;
10
10
  --ard-tabber-separator-border: 1px solid var(--ard-detail-ultralight, rgba(0, 0, 0, 12%));
11
- --ard-tabber-tab-overlay-color: var(--ard-bg-alt, black);
11
+ --ard-tabber-tab-overlay-color: ;
12
12
  --ard-tabber-tab-hover-opacity: 4%;
13
13
  --ard-tabber-tab-active-opacity: 12%;
14
14
  --ard-tabber-tab-focus-visible-opacity: 18%;
package/prebuilt-themes/default/table.css CHANGED
@@ -1,15 +1,15 @@
1
1
  .ard-table {
2
2
  border-collapse: collapse;
3
3
  background: var(--ard-bg);
4
- --ard-_table-header-border: var(--ard-cmpcl--border);
5
- --ard-_table-header-border-light: var(--ard-cmpcl--border-light);
4
+ --ard-_table-header-border: ;
5
+ --ard-_table-header-border-light: ;
6
6
  --ard-_table-border: ARD.$border;
7
- --ard-_table-header-background: var(--ard-cmpcl--bg);
8
- --ard-_table-header-background-light: var(--ard-cmpcl--bg-header);
9
- --ard-_table-header-color: var(--ard-cmpcl--content);
10
- --ard-_table-header-color-on-bg: var(--ard-cmpcl--on-bg);
11
- --ard-_table-overlay: var(--ard-cmpcl--overlay-rgb);
12
- --ard-_table-overlay-colorless: var(--ard-overlay-rgb);
7
+ --ard-_table-header-background: ;
8
+ --ard-_table-header-background-light: ;
9
+ --ard-_table-header-color: ;
10
+ --ard-_table-header-color-on-bg: ;
11
+ --ard-_table-overlay: ;
12
+ --ard-_table-overlay-colorless: ;
13
13
  }
14
14
  .ard-table.ard-color-none {
15
15
  --ard-cmpcl--bg: var(--ard-bg);
package/themes/default/buttons/button.scss CHANGED
@@ -17,7 +17,7 @@
17
17
  --ard-button-overlay-active-opacity: 0.18;
18
18
  --ard-button-overlay-focus-visible-opacity: 0.24;
19
19
  --ard-button-overlay-disabled-opacity: 0.2;
20
- --ard-button-rounded-corner-radius: var(--ard-rounded-corner-radius, 0.375rem);
20
+ --ard-button-rounded-corner-radius: ;
21
21
  --ard-button-disabled-opacity: 0.6;
22
22
  }
23
23
 
package/themes/default/buttons/fab.scss CHANGED
@@ -14,7 +14,7 @@
14
14
  --ard-fab-overlay-active-opacity: 0.18;
15
15
  --ard-fab-overlay-focus-visible-opacity: 0.24;
16
16
  --ard-fab-overlay-disabled-opacity: 0.2;
17
- --ard-fab-rounded-corner-radius: var(--ard-rounded-corner-radius, 0.375rem);
17
+ --ard-fab-rounded-corner-radius: ;
18
18
  --ard-fab-disabled-opacity: 0.6;
19
19
  }
20
20
 
package/themes/default/buttons/icon-button.scss CHANGED
@@ -8,12 +8,12 @@
8
8
  --ard-icon-button-icon-font-size: 1.5em;
9
9
  --ard-icon-button-font-size-compact: 0.75rem;
10
10
  --ard-icon-button-font-weight: 600;
11
- --ard-icon-button-overlay-hover-opacity: var(--ard-button-overlay-hover-opacity, 0.04);
12
- --ard-icon-button-overlay-focus-opacity: var(--ard-button-overlay-focus-opacity, 0.12);
13
- --ard-icon-button-overlay-active-opacity: var(--ard-button-overlay-active-opacity, 0.18);
14
- --ard-icon-button-overlay-focus-visible-opacity: var(--ard-button-overlay-focus-visible-opacity, 0.24);
15
- --ard-icon-button-overlay-disabled-opacity: var(--ard-button-overlay-disabled-opacity, 0.2);
16
- --ard-icon-button-disabled-opacity: var(--ard-button-disabled-opacity, 0.6);
11
+ --ard-icon-button-overlay-hover-opacity: ;
12
+ --ard-icon-button-overlay-focus-opacity: ;
13
+ --ard-icon-button-overlay-active-opacity: ;
14
+ --ard-icon-button-overlay-focus-visible-opacity: ;
15
+ --ard-icon-button-overlay-disabled-opacity: ;
16
+ --ard-icon-button-disabled-opacity: ;
17
17
  }
18
18
 
19
19
  ard-icon-button {
package/themes/default/calendar.scss CHANGED
@@ -11,19 +11,19 @@
11
11
  --ard-calendar-weekday-padding: 0 0 0.5rem 0;
12
12
  --ard-calendar-weekday-font-size: 0.875rem;
13
13
  --ard-calendar-weekday-font-weight: 500;
14
- --ard-calendar-weekday-color: #{ARD.$text};
14
+ --ard-calendar-weekday-color: ;
15
15
  --ard-calendar-floating-month-transform: none;
16
16
  --ard-calendar-floating-month-padding: 0 0 0 1rem;
17
17
  --ard-calendar-floating-month-font-size: 0.875rem;
18
18
  --ard-calendar-floating-month-font-weight: 500;
19
- --ard-calendar-floating-month-color: #{ARD.$text3};
19
+ --ard-calendar-floating-month-color: ;
20
20
  --ard-calendar-entry-padding: 0;
21
21
  --ard-calendar-entry-font-size: 0.875rem;
22
22
  --ard-calendar-entry-font-weight: 400;
23
23
  --ard-calendar-entry-border-radius: 9999px;
24
24
  --ard-calendar-entry-range-overlay-border-width: 1px;
25
25
  --ard-calendar-entry-range-overlay-border-style: dashed;
26
- --ard-calendar-entry-today-border-color: #{ARD.$detail};
26
+ --ard-calendar-entry-today-border-color: ;
27
27
  --ard-calendar-entry-today-selected-border: 2px solid #{ARD.$bg};
28
28
  --ard-calendar-entry-highlighted-overlay-opacity: 20%;
29
29
  --ard-calendar-entry-selected-overlay-opacity: 100%;
package/themes/default/inputs/autocomplete-input.scss CHANGED
@@ -4,18 +4,18 @@
4
4
  @use '../../variables' as ARD;
5
5
 
6
6
  :root {
7
- --ard-autocomplete-input-height: var(--ard-form-field-height, 2.3125rem);
8
- --ard-autocomplete-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
7
+ --ard-autocomplete-input-height: ;
8
+ --ard-autocomplete-input-height-compact: ;
9
9
  --ard-autocomplete-input-gap: 0.625rem;
10
- --ard-autocomplete-input-font-size: var(--ard-form-field-font-size, 1rem);
11
- --ard-autocomplete-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
10
+ --ard-autocomplete-input-font-size: ;
11
+ --ard-autocomplete-input-font-size-compact: ;
12
12
  --ard-autocomplete-input-line-height: 1.25;
13
13
  --ard-autocomplete-input-line-height-compact: 1;
14
14
  --ard-autocomplete-input-font-weight: 400;
15
- --ard-autocomplete-input-padding: var(--ard-form-field-padding, 0 0.375rem);
16
- --ard-autocomplete-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
17
- --ard-autocomplete-input-color: #{ARD.$text};
18
- --ard-autocomplete-input-placeholder-color: #{ARD.$text};
15
+ --ard-autocomplete-input-padding: ;
16
+ --ard-autocomplete-input-padding-compact: ;
17
+ --ard-autocomplete-input-color: ;
18
+ --ard-autocomplete-input-placeholder-color: ;
19
19
  --ard-autocomplete-input-placeholder-opacity: 60%;
20
20
 
21
21
  --ard-autocomplete-input-min-width: 10rem;
@@ -28,10 +28,10 @@
28
28
  --ard-autocomplete-input-option-padding-compact: 0.25rem 0.5rem;
29
29
  --ard-autocomplete-input-font-size: 1rem;
30
30
  --ard-autocomplete-input-font-size-compact: 0.875rem;
31
- --ard-autocomplete-input-color: #{ARD.$text2};
32
- --ard-autocomplete-input-highlighted-background: #{ARD.$darken-overlay-light};
31
+ --ard-autocomplete-input-color: ;
32
+ --ard-autocomplete-input-highlighted-background: ;
33
33
  --ard-autocomplete-input-highlighted-font-weight: 400;
34
- --ard-autocomplete-input-selected-background: #{ARD.$darken-overlay-medium};
34
+ --ard-autocomplete-input-selected-background: ;
35
35
  --ard-autocomplete-input-selected-font-weight: 500;
36
36
  --ard-autocomplete-input-disabled-opacity: 50%;
37
37
  }
package/themes/default/inputs/date-input.scss CHANGED
@@ -2,18 +2,18 @@
2
2
  @use '../../variables' as ARD;
3
3
 
4
4
  :root {
5
- --ard-date-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-date-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-date-input-height: ;
6
+ --ard-date-input-height-compact: ;
7
7
  --ard-date-input-gap: 0.625rem;
8
- --ard-date-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-date-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-date-input-font-size: ;
9
+ --ard-date-input-font-size-compact: ;
10
10
  --ard-date-input-line-height: 1.25;
11
11
  --ard-date-input-line-height-compact: 1;
12
12
  --ard-date-input-font-weight: 400;
13
- --ard-date-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-date-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-date-input-color: #{ARD.$text};
16
- --ard-date-input-placeholder-color: #{ARD.$text};
13
+ --ard-date-input-padding: ;
14
+ --ard-date-input-padding-compact: ;
15
+ --ard-date-input-color: ;
16
+ --ard-date-input-placeholder-color: ;
17
17
  --ard-date-input-placeholder-opacity: 60%;
18
18
 
19
19
  --ard-date-input-padding: 0 0 0 0.375rem;
package/themes/default/inputs/file-input.scss CHANGED
@@ -5,18 +5,18 @@
5
5
  @use '../../variables' as ARD;
6
6
 
7
7
  :root {
8
- --ard-file-input-height: var(--ard-form-field-height, 2.3125rem);
9
- --ard-file-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
8
+ --ard-file-input-height: ;
9
+ --ard-file-input-height-compact: ;
10
10
  --ard-file-input-gap: 0.625rem;
11
- --ard-file-input-font-size: var(--ard-form-field-font-size, 1rem);
12
- --ard-file-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
11
+ --ard-file-input-font-size: ;
12
+ --ard-file-input-font-size-compact: ;
13
13
  --ard-file-input-line-height: 1.25;
14
14
  --ard-file-input-line-height-compact: 1;
15
15
  --ard-file-input-font-weight: 400;
16
- --ard-file-input-padding: var(--ard-form-field-padding, 0 0.375rem);
17
- --ard-file-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
18
- --ard-file-input-color: #{ARD.$text};
19
- --ard-file-input-placeholder-color: #{ARD.$text};
16
+ --ard-file-input-padding: ;
17
+ --ard-file-input-padding-compact: ;
18
+ --ard-file-input-color: ;
19
+ --ard-file-input-placeholder-color: ;
20
20
  --ard-file-input-placeholder-opacity: 60%;
21
21
 
22
22
  --ard-file-input-min-width: 10rem;
@@ -32,10 +32,10 @@
32
32
  --ard-file-input-browse-button-border-radius: 9999px;
33
33
  --ard-file-input-browse-button-background: none;
34
34
  --ard-file-input-browse-button-padding: 0;
35
- --ard-file-input-browse-button-color: #{ARD.$text2};
36
- --ard-file-input-browse-button-color-error: #{ARD.$danger700};
35
+ --ard-file-input-browse-button-color: ;
36
+ --ard-file-input-browse-button-color-error: ;
37
37
  --ard-file-input-browse-button-overlay-offset: 0rem;
38
- --ard-file-input-browse-button-overlay-color: #{ARD.$overlay};
38
+ --ard-file-input-browse-button-overlay-color: ;
39
39
  --ard-file-input-browse-button-overlay-hover-opacity: 4%;
40
40
  --ard-file-input-browse-button-overlay-focus-opacity: 0;
41
41
  --ard-file-input-browse-button-overlay-active-opacity: 12%;
package/themes/default/inputs/hex-input.scss CHANGED
@@ -4,24 +4,24 @@
4
4
  @use '../../variables' as ARD;
5
5
 
6
6
  :root {
7
- --ard-hex-input-height: var(--ard-form-field-height, 2.3125rem);
8
- --ard-hex-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
7
+ --ard-hex-input-height: ;
8
+ --ard-hex-input-height-compact: ;
9
9
  --ard-hex-input-gap: 0.625rem;
10
- --ard-hex-input-font-size: var(--ard-form-field-font-size, 1rem);
11
- --ard-hex-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
10
+ --ard-hex-input-font-size: ;
11
+ --ard-hex-input-font-size-compact: ;
12
12
  --ard-hex-input-line-height: 1.25;
13
13
  --ard-hex-input-line-height-compact: 1;
14
14
  --ard-hex-input-font-weight: 400;
15
- --ard-hex-input-padding: var(--ard-form-field-padding, 0 0.375rem);
16
- --ard-hex-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
17
- --ard-hex-input-color: #{ARD.$text};
18
- --ard-hex-input-placeholder-color: #{ARD.$text};
15
+ --ard-hex-input-padding: ;
16
+ --ard-hex-input-padding-compact: ;
17
+ --ard-hex-input-color: ;
18
+ --ard-hex-input-placeholder-color: ;
19
19
  --ard-hex-input-placeholder-opacity: 60%;
20
20
 
21
21
  --ard-hex-input-min-width: 10rem;
22
22
  --ard-hex-input-max-width: 100%;
23
23
  --ard-hex-input-hash-margin: 0 0 -0.5rem 0;
24
- --ard-hex-input-hash-color: #{ARD.$text};
24
+ --ard-hex-input-hash-color: ;
25
25
  --ard-hex-input-hash-opacity: 70%;
26
26
  }
27
27
 
package/themes/default/inputs/input.scss CHANGED
@@ -4,18 +4,18 @@
4
4
  @use '../../variables' as ARD;
5
5
 
6
6
  :root {
7
- --ard-input-height: var(--ard-form-field-height, 2.3125rem);
8
- --ard-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
7
+ --ard-input-height: ;
8
+ --ard-input-height-compact: ;
9
9
  --ard-input-gap: 0.625rem;
10
- --ard-input-font-size: var(--ard-form-field-font-size, 1rem);
11
- --ard-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
10
+ --ard-input-font-size: ;
11
+ --ard-input-font-size-compact: ;
12
12
  --ard-input-line-height: 1.25;
13
13
  --ard-input-line-height-compact: 1;
14
14
  --ard-input-font-weight: 400;
15
- --ard-input-padding: var(--ard-form-field-padding, 0 0.375rem);
16
- --ard-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
17
- --ard-input-color: #{ARD.$text};
18
- --ard-input-placeholder-color: #{ARD.$text};
15
+ --ard-input-padding: ;
16
+ --ard-input-padding-compact: ;
17
+ --ard-input-color: ;
18
+ --ard-input-placeholder-color: ;
19
19
  --ard-input-placeholder-opacity: 60%;
20
20
 
21
21
  --ard-input-min-width: 10rem;
package/themes/default/inputs/number-input.scss CHANGED
@@ -3,18 +3,18 @@
3
3
  @use '../../variables' as ARD;
4
4
 
5
5
  :root {
6
- --ard-number-input-height: var(--ard-form-field-height, 2.3125rem);
7
- --ard-number-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
6
+ --ard-number-input-height: ;
7
+ --ard-number-input-height-compact: ;
8
8
  --ard-number-input-gap: 0.625rem;
9
- --ard-number-input-font-size: var(--ard-form-field-font-size, 1rem);
10
- --ard-number-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
9
+ --ard-number-input-font-size: ;
10
+ --ard-number-input-font-size-compact: ;
11
11
  --ard-number-input-line-height: 1.25;
12
12
  --ard-number-input-line-height-compact: 1;
13
13
  --ard-number-input-font-weight: 400;
14
- --ard-number-input-padding: var(--ard-form-field-padding, 0 0.375rem);
15
- --ard-number-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
16
- --ard-number-input-color: #{ARD.$text};
17
- --ard-number-input-placeholder-color: #{ARD.$text};
14
+ --ard-number-input-padding: ;
15
+ --ard-number-input-padding-compact: ;
16
+ --ard-number-input-color: ;
17
+ --ard-number-input-placeholder-color: ;
18
18
  --ard-number-input-placeholder-opacity: 60%;
19
19
 
20
20
  --ard-number-input-width: 9.5rem;
package/themes/default/inputs/password-input.scss CHANGED
@@ -4,18 +4,18 @@
4
4
  @use '../../variables' as ARD;
5
5
 
6
6
  :root {
7
- --ard-password-input-height: var(--ard-form-field-height, 2.3125rem);
8
- --ard-password-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
7
+ --ard-password-input-height: ;
8
+ --ard-password-input-height-compact: ;
9
9
  --ard-password-input-gap: 0.625rem;
10
- --ard-password-input-font-size: var(--ard-form-field-font-size, 1rem);
11
- --ard-password-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
10
+ --ard-password-input-font-size: ;
11
+ --ard-password-input-font-size-compact: ;
12
12
  --ard-password-input-line-height: 1.25;
13
13
  --ard-password-input-line-height-compact: 1;
14
14
  --ard-password-input-font-weight: 400;
15
- --ard-password-input-padding: var(--ard-form-field-padding, 0 0.375rem);
16
- --ard-password-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
17
- --ard-password-input-color: #{ARD.$text};
18
- --ard-password-input-placeholder-color: #{ARD.$text};
15
+ --ard-password-input-padding: ;
16
+ --ard-password-input-padding-compact: ;
17
+ --ard-password-input-color: ;
18
+ --ard-password-input-placeholder-color: ;
19
19
  --ard-password-input-placeholder-opacity: 60%;
20
20
 
21
21
  --ard-password-input-min-width: 10rem;
@@ -27,7 +27,7 @@
27
27
  --ard-password-input-reveal-button-width: unset;
28
28
  --ard-password-input-reveal-button-aspect-ratio: 1;
29
29
  --ard-password-input-reveal-button-padding: 0;
30
- --ard-password-input-reveal-button-color: #{ARD.$text};
30
+ --ard-password-input-reveal-button-color: ;
31
31
  --ard-password-input-reveal-button-border-radius: 9999px;
32
32
  --ard-password-input-reveal-button-border: none;
33
33
  --ard-password-input-reveal-button-background: transparent;
package/themes/default/inputs/search-bar.scss CHANGED
@@ -4,18 +4,18 @@
4
4
  @use '../../variables' as ARD;
5
5
 
6
6
  :root {
7
- --ard-search-bar-height: var(--ard-form-field-height, 2.3125rem);
8
- --ard-search-bar-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
7
+ --ard-search-bar-height: ;
8
+ --ard-search-bar-height-compact: ;
9
9
  --ard-search-bar-gap: 0.625rem;
10
- --ard-search-bar-font-size: var(--ard-form-field-font-size, 1rem);
11
- --ard-search-bar-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
10
+ --ard-search-bar-font-size: ;
11
+ --ard-search-bar-font-size-compact: ;
12
12
  --ard-search-bar-line-height: 1.25;
13
13
  --ard-search-bar-line-height-compact: 1;
14
14
  --ard-search-bar-font-weight: 400;
15
- --ard-search-bar-padding: var(--ard-form-field-padding, 0 0.375rem);
16
- --ard-search-bar-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
17
- --ard-search-bar-color: #{ARD.$text};
18
- --ard-search-bar-placeholder-color: #{ARD.$text};
15
+ --ard-search-bar-padding: ;
16
+ --ard-search-bar-padding-compact: ;
17
+ --ard-search-bar-color: ;
18
+ --ard-search-bar-placeholder-color: ;
19
19
  --ard-search-bar-placeholder-opacity: 60%;
20
20
 
21
21
  --ard-search-bar-min-width: 10rem;
package/themes/default/segment.scss CHANGED
@@ -5,8 +5,8 @@
5
5
  :root {
6
6
  --ard-segment-margin: 0;
7
7
  --ard-segment-padding: 0.15rem;
8
- --ard-segment-option-gap: var(--ard-segment-padding, 0.15rem);
9
- --ard-segment-font-family: var(--ard-font-family);
8
+ --ard-segment-option-gap: ;
9
+ --ard-segment-font-family: ;
10
10
  --ard-segment-font-size: 0.875rem;
11
11
  --ard-segment-font-size-compact: 0.75rem;
12
12
  --ard-segment-rounded-border-radius: 0.5rem;
@@ -21,7 +21,7 @@
21
21
  --ard-segment-option-active-bg-opacity: 12%;
22
22
  --ard-segment-option-active-keyboard-bg-opacity: 34%;
23
23
  --ard-segment-option-selected-bg-opacity: 16%;
24
- --ard-segment-border-color: #{ARD.$border-light};
24
+ --ard-segment-border-color: ;
25
25
  }
26
26
 
27
27
  .ard-segment-container {
package/themes/default/select.scss CHANGED
@@ -3,8 +3,8 @@
3
3
  @use '../variables' as ARD;
4
4
 
5
5
  :root {
6
- --ard-select-height: var(--ard-form-field-height, 2.3125rem);
7
- --ard-select-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
6
+ --ard-select-height: ;
7
+ --ard-select-height-compact: ;
8
8
  --ard-select-gap: 0.625rem;
9
9
  --ard-select-gap-compact: 0.5rem;
10
10
  --ard-select-controls-gap: 0.625rem;
@@ -12,12 +12,12 @@
12
12
  --ard-select-padding: 0 1em 0 0.375em;
13
13
  --ard-select-padding-compact: 0 0.625em 0 0.375em;
14
14
 
15
- --ard-select-font-size: var(--ard-form-field-font-size, 1rem);
16
- --ard-select-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
17
- --ard-select-text-color: var(--ard-text, rgba(0, 0, 0, 100%));
18
- --ard-select-placeholder-color: var(--ard-text3, rgba(0, 0, 0, 75%));
15
+ --ard-select-font-size: ;
16
+ --ard-select-font-size-compact: ;
17
+ --ard-select-text-color: ;
18
+ --ard-select-placeholder-color: ;
19
19
  --ard-select-search-min-width: 10ch;
20
- --ard-select-dropdown-arrow-color: var(--ard-detail, rgba(0, 0, 0, 60%));
20
+ --ard-select-dropdown-arrow-color: ;
21
21
  --ard-select-dropdown-arrow-active-transform: rotate(180deg);
22
22
  --ard-select-dropdown-arrow-transition: 0.2s ease-in-out;
23
23
 
@@ -28,8 +28,8 @@
28
28
  --ard-select-dropdown-max-width: max(25em, 100%);
29
29
  --ard-select-dropdown-min-width: 100%;
30
30
  --ard-select-dropdown-max-height: 15em;
31
- --ard-select-dropdown-font-size: var(--ard-select-font-size, var(--ard-form-field-font-size, 1rem));
32
- --ard-select-dropdown-font-size-compact: var(--ard-select-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
31
+ --ard-select-dropdown-font-size: ;
32
+ --ard-select-dropdown-font-size-compact: ;
33
33
  --ard-select-dropdown-padding: 0.375em 0.625em;
34
34
  --ard-select-dropdown-gap: 0;
35
35
 
@@ -39,11 +39,11 @@
39
39
  --ard-select-dropdown-optgroup-label-padding: 0.375em 0.625em 0.0625em 0.625em;
40
40
 
41
41
  --ard-select-dropdown-option-padding: 0.375em 0.625em;
42
- --ard-select-dropdown-option-text-color: var(--ard-text2, rgba(0, 0, 0, 87%));
43
- --ard-select-dropdown-option-highlighted-bg: var(--ard-darken-overlay-light, rgba(0, 0, 0, 5%));
42
+ --ard-select-dropdown-option-text-color: ;
43
+ --ard-select-dropdown-option-highlighted-bg: ;
44
44
  --ard-select-dropdown-option-selected-font-weight: 500;
45
- --ard-select-dropdown-option-selected-bg: var(--ard-darken-overlay-medium, rgba(0, 0, 0, 10%));
46
- --ard-select-dropdown-option-selected-highlighted-bg: var(--ard-darken-overlay-medium-strong, rgba(0, 0, 0, 13%));
45
+ --ard-select-dropdown-option-selected-bg: ;
46
+ --ard-select-dropdown-option-selected-highlighted-bg: ;
47
47
  --ard-select-dropdown-option-disabled-opacity: 50%;
48
48
 
49
49
  --ard-select-dropdown-add-custom-gap: 0.375rem;
package/themes/default/slider.scss CHANGED
@@ -4,22 +4,22 @@
4
4
  @use '../variables' as ARD;
5
5
 
6
6
  :root {
7
- --ard-slider-font-size: var(--ard-form-field-font-size, 1rem);
8
- --ard-slider-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
7
+ --ard-slider-font-size: ;
8
+ --ard-slider-font-size-compact: ;
9
9
  --ard-slider-width: 100%;
10
10
  --ard-slider-padding: 0 calc(var(--ard-slider-handle-size, 1.25em) / 2);
11
11
  --ard-slider-track-height: 0.25em;
12
- --ard-slider-track-color: var(--ard-cmpcl--bg-colored);
12
+ --ard-slider-track-color: ;
13
13
  --ard-slider-track-opacity: 20%;
14
14
  --ard-slider-track-border-radius: 9999px;
15
15
  --ard-slider-active-track-height: calc(100% + 0.125em);
16
- --ard-slider-active-color: var(--ard-cmpcl--bg-colored);
16
+ --ard-slider-active-color: ;
17
17
  --ard-slider-active-track-opacity: 100%;
18
18
  --ard-slider-value-tick-size: 0.125em;
19
19
  --ard-slider-value-tick-opacity: 30%;
20
20
  --ard-slider-track-hitbox-size: calc(var(--ard-slider-handle-size, 1.25em) / 2);
21
21
  --ard-slider-handle-size: 1.25em;
22
- --ard-slider-handle-bg: var(--ard-cmpcl--bg-colored);
22
+ --ard-slider-handle-bg: ;
23
23
  --ard-slider-handle-border: none;
24
24
  --ard-slider-handle-border-radius: 9999px;
25
25
  --ard-slider-handle-hitbox-size: 0.375em;
@@ -29,8 +29,8 @@
29
29
  --ard-slider-handle-overlay-active-opacity: 25%;
30
30
  --ard-slider-label-font-size: 0.875rem;
31
31
  --ard-slider-label-padding-top: 0.2em;
32
- --ard-slider-label-bg: #{ARD.$text3};
33
- --ard-slider-label-color: #{ARD.$text2-alt};
32
+ --ard-slider-label-bg: ;
33
+ --ard-slider-label-color: ;
34
34
  --ard-slider-label-height: 2em;
35
35
  --ard-slider-label-border: none;
36
36
  --ard-slider-label-border-radius: 0.375em;
package/themes/default/tabber.scss CHANGED
@@ -11,7 +11,7 @@
11
11
  --ard-tabber-tab-gap: 0;
12
12
  --ard-tabber-tab-content-gap: 0.375rem;
13
13
  --ard-tabber-separator-border: 1px solid var(--ard-detail-ultralight, rgba(0, 0, 0, 12%));
14
- --ard-tabber-tab-overlay-color: var(--ard-bg-alt, black);
14
+ --ard-tabber-tab-overlay-color: ;
15
15
  --ard-tabber-tab-hover-opacity: 4%;
16
16
  --ard-tabber-tab-active-opacity: 12%;
17
17
  --ard-tabber-tab-focus-visible-opacity: 18%;
package/themes/default/table.scss CHANGED
@@ -161,15 +161,15 @@
161
161
  }
162
162
 
163
163
  //! color
164
- --ard-_table-header-border: var(--ard-cmpcl--border);
165
- --ard-_table-header-border-light: var(--ard-cmpcl--border-light);
164
+ --ard-_table-header-border: ;
165
+ --ard-_table-header-border-light: ;
166
166
  --ard-_table-border: ARD.$border;
167
- --ard-_table-header-background: var(--ard-cmpcl--bg);
168
- --ard-_table-header-background-light: var(--ard-cmpcl--bg-header);
169
- --ard-_table-header-color: var(--ard-cmpcl--content);
170
- --ard-_table-header-color-on-bg: var(--ard-cmpcl--on-bg);
171
- --ard-_table-overlay: var(--ard-cmpcl--overlay-rgb);
172
- --ard-_table-overlay-colorless: var(--ard-overlay-rgb);
167
+ --ard-_table-header-background: ;
168
+ --ard-_table-header-background-light: ;
169
+ --ard-_table-header-color: ;
170
+ --ard-_table-header-color-on-bg: ;
171
+ --ard-_table-overlay: ;
172
+ --ard-_table-overlay-colorless: ;
173
173
 
174
174
  //! appearances
175
175
  &.ard-appearance-strong {