@dialpad/dialtone-css 8.42.3 → 8.44.0-beta.1

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 (26) hide show
  1. package/lib/build/less/components/button.less +13 -19
  2. package/lib/build/less/components/emoji-picker.less +34 -29
  3. package/lib/build/less/components/forms.less +3 -5
  4. package/lib/build/less/components/input.less +36 -15
  5. package/lib/build/less/components/radio-checkbox.less +3 -5
  6. package/lib/build/less/components/tabs.less +36 -51
  7. package/lib/build/less/dialtone.less +3 -3
  8. package/lib/build/less/utilities/flex.less +1 -0
  9. package/lib/build/less/utilities/grid.less +1 -0
  10. package/lib/build/less/utilities/spacing.less +10 -0
  11. package/lib/build/less/variables/sizes.less +16 -15
  12. package/lib/dist/dialtone-default-theme.css +14978 -14239
  13. package/lib/dist/dialtone-default-theme.min.css +1 -1
  14. package/lib/dist/dialtone.css +756 -448
  15. package/lib/dist/dialtone.min.css +1 -1
  16. package/lib/dist/tokens/tokens-base-dark.css +898 -894
  17. package/lib/dist/tokens/tokens-base-light.css +673 -669
  18. package/lib/dist/tokens/tokens-dp-dark.css +1831 -1752
  19. package/lib/dist/tokens/tokens-dp-light.css +1832 -1753
  20. package/lib/dist/tokens/tokens-expressive-dark.css +1793 -1759
  21. package/lib/dist/tokens/tokens-expressive-light.css +1793 -1759
  22. package/lib/dist/tokens/tokens-expressive-sm-dark.css +1793 -1759
  23. package/lib/dist/tokens/tokens-expressive-sm-light.css +1793 -1759
  24. package/lib/dist/tokens/tokens-tmo-dark.css +1787 -1753
  25. package/lib/dist/tokens/tokens-tmo-light.css +1787 -1753
  26. package/package.json +2 -2
package/lib/build/less/variables/sizes.less CHANGED
@@ -13,12 +13,12 @@
13
13
  #d-internal__input-and-select-xs() {
14
14
  --input-padding-y: calc(calc(var(--dt-space-400) - var(--dt-space-100)) - var(--input-border-width));
15
15
  --input-padding-x: calc(var(--dt-space-400) - var(--input-border-width));
16
- --input-font-size: var(--dt-font-size-100);
17
- --input-border-radius: var(--dt-size-300);
16
+ --input-border-radius: var(--dt-inputs-size-radius-xs);
17
+ --input-typography: var(--dt-typography-inputs-xs);
18
18
 
19
19
  .d-btn__icon {
20
- width: calc(var(--dt-size-500) - var(--dt-size-200));
21
- height: calc(var(--dt-size-500) - var(--dt-size-200));
20
+ width: var(--dt-icon-size-100);
21
+ height: var(--dt-icon-size-100);
22
22
  }
23
23
  }
24
24
 
@@ -27,11 +27,12 @@
27
27
  #d-internal__input-and-select-sm() {
28
28
  --input-padding-y: calc(var(--dt-space-400) - var(--input-border-width));
29
29
  --input-padding-x: calc((var(--dt-space-500) - var(--dt-space-300)) - var(--input-border-width));
30
- --input-font-size: var(--dt-font-size-100);
30
+ --input-typography: var(--dt-typography-inputs-sm);
31
+ --input-border-radius: var(--dt-inputs-size-radius-sm);
31
32
 
32
33
  .d-btn__icon {
33
- width: var(--dt-size-500);
34
- height: var(--dt-size-500);
34
+ width: var(--dt-icon-size-200);
35
+ height: var(--dt-icon-size-200);
35
36
  }
36
37
  }
37
38
 
@@ -40,12 +41,12 @@
40
41
  #d-internal__input-and-select-lg() {
41
42
  --input-padding-y: calc((var(--dt-space-400) + var(--dt-space-200)) - var(--input-border-width));
42
43
  --input-padding-x: calc(var(--dt-space-500) - var(--input-border-width));
43
- --input-font-size: var(--dt-font-size-300);
44
- --input-border-radius: var(--dt-size-450);
44
+ --input-border-radius: var(--dt-inputs-size-radius-lg);
45
+ --input-typography: var(--dt-typography-inputs-lg);
45
46
 
46
47
  .d-btn__icon {
47
- width: calc(var(--dt-size-300) * 5);
48
- height: calc(var(--dt-size-300) * 5);
48
+ width: var(--dt-icon-size-400);
49
+ height: var(--dt-icon-size-400);
49
50
  }
50
51
  }
51
52
 
@@ -54,11 +55,11 @@
54
55
  #d-internal__input-and-select-xl() {
55
56
  --input-padding-y: calc((var(--dt-space-500) - var(--dt-space-300)) - var(--input-border-width));
56
57
  --input-padding-x: calc(var(--dt-space-500) - var(--input-border-width));
57
- --input-font-size: var(--dt-font-size-400);
58
- --input-border-radius: var(--dt-size-500);
58
+ --input-border-radius: var(--dt-inputs-size-radius-xl);
59
+ --input-typography: var(--dt-typography-inputs-xl);
59
60
 
60
61
  .d-btn__icon {
61
- width: var(--dt-size-550);
62
- height: var(--dt-size-550);
62
+ width: var(--dt-icon-size-500);
63
+ height: var(--dt-icon-size-500);
63
64
  }
64
65
  }