@dialpad/dialtone-tokens 1.6.5 → 1.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.
@@ -2,60 +2,73 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Tue, 31 Jan 2023 17:55:46 GMT
5
+ Generated on Fri, 14 Apr 2023 23:49:08 GMT
6
6
  -->
7
7
  <resources>
8
- <dimen name="dt_button_border_radius_extra_small">7px</dimen>
9
- <dimen name="dt_button_border_radius_small">7.5px</dimen>
10
- <dimen name="dt_button_border_radius_medium">8px</dimen>
11
- <dimen name="dt_button_border_radius_large">9px</dimen>
12
- <dimen name="dt_button_border_radius_extra_large">10px</dimen>
13
- <dimen name="dt_button_space_gap">16px</dimen>
14
- <dimen name="dt_button_padding_horizontal_extra_small">15px</dimen>
15
- <dimen name="dt_button_padding_horizontal_small">15px</dimen>
16
- <dimen name="dt_button_padding_horizontal_medium">15px</dimen>
17
- <dimen name="dt_button_padding_horizontal_large">63px</dimen>
18
- <dimen name="dt_button_padding_horizontal_extra_large">15px</dimen>
19
- <dimen name="dt_button_padding_vertical_extra_small">13px</dimen>
20
- <dimen name="dt_button_padding_vertical_small">13px</dimen>
21
- <dimen name="dt_button_padding_vertical_medium">15px</dimen>
22
- <dimen name="dt_button_padding_vertical_large">31px</dimen>
23
- <dimen name="dt_button_padding_vertical_extra_large">31px</dimen>
24
- <dimen name="dt_button_font_size_extra_small">12px</dimen>
25
- <dimen name="dt_button_font_size_small">12px</dimen>
26
- <dimen name="dt_button_font_size_medium">15px</dimen>
27
- <dimen name="dt_button_font_size_large">19px</dimen>
28
- <dimen name="dt_button_font_size_extra_large">27px</dimen>
8
+ <dimen name="dt_typography_body_small_font_size">12px</dimen>
9
+ <dimen name="dt_typography_body_base_font_size">15px</dimen>
10
+ <dimen name="dt_typography_body_compact_small_font_size">12px</dimen>
11
+ <dimen name="dt_typography_body_compact_base_font_size">15px</dimen>
12
+ <dimen name="dt_typography_headline_eyebrow_font_size">12px</dimen>
13
+ <dimen name="dt_typography_headline_small_font_size">12px</dimen>
14
+ <dimen name="dt_typography_headline_medium_font_size">15px</dimen>
15
+ <dimen name="dt_typography_headline_large_font_size">19px</dimen>
16
+ <dimen name="dt_typography_headline_extra_large_font_size">27px</dimen>
17
+ <dimen name="dt_typography_headline_extra_extra_large_font_size">38px</dimen>
18
+ <dimen name="dt_typography_headline_soft_small_font_size">12px</dimen>
19
+ <dimen name="dt_typography_headline_compact_small_font_size">12px</dimen>
20
+ <dimen name="dt_typography_headline_compact_medium_font_size">15px</dimen>
21
+ <dimen name="dt_typography_headline_compact_large_font_size">19px</dimen>
22
+ <dimen name="dt_typography_headline_compact_soft_small_font_size">12px</dimen>
23
+ <dimen name="dt_typography_label_small_font_size">12px</dimen>
24
+ <dimen name="dt_typography_label_base_font_size">15px</dimen>
25
+ <dimen name="dt_typography_label_compact_small_font_size">12px</dimen>
26
+ <dimen name="dt_typography_label_compact_base_font_size">15px</dimen>
27
+ <dimen name="dt_typography_label_compact_plain_small_font_size">12px</dimen>
28
+ <dimen name="dt_typography_label_compact_plain_base_font_size">15px</dimen>
29
+ <dimen name="dt_typography_label_plain_small_font_size">12px</dimen>
30
+ <dimen name="dt_typography_label_plain_base_font_size">15px</dimen>
31
+ <dimen name="dt_typography_helper_small_font_size">12px</dimen>
32
+ <dimen name="dt_typography_helper_base_font_size">15px</dimen>
33
+ <dimen name="dt_typography_code_small_font_size">12px</dimen>
34
+ <dimen name="dt_typography_code_base_font_size">15px</dimen>
29
35
  <dimen name="dt_size_0">0.00dp</dimen>
36
+ <dimen name="dt_size_50">8.00dp</dimen>
30
37
  <dimen name="dt_size_100">16.00dp</dimen>
31
38
  <dimen name="dt_size_200">32.00dp</dimen>
32
39
  <dimen name="dt_size_300">64.00dp</dimen>
40
+ <dimen name="dt_size_350">96.00dp</dimen>
33
41
  <dimen name="dt_size_400">128.00dp</dimen>
42
+ <dimen name="dt_size_450">192.00dp</dimen>
34
43
  <dimen name="dt_size_500">256.00dp</dimen>
44
+ <dimen name="dt_size_550">384.00dp</dimen>
35
45
  <dimen name="dt_size_600">512.00dp</dimen>
46
+ <dimen name="dt_size_650">768.00dp</dimen>
36
47
  <dimen name="dt_size_700">1024.00dp</dimen>
48
+ <dimen name="dt_size_750">1536.00dp</dimen>
37
49
  <dimen name="dt_size_800">2048.00dp</dimen>
38
- <dimen name="dt_size_icon_100">192.00sp</dimen>
39
- <dimen name="dt_size_icon_200">224.00sp</dimen>
40
- <dimen name="dt_size_icon_300">288.00sp</dimen>
41
- <dimen name="dt_size_icon_400">320.00sp</dimen>
42
- <dimen name="dt_size_icon_500">384.00sp</dimen>
43
- <dimen name="dt_size_icon_600">512.00sp</dimen>
44
- <dimen name="dt_size_icon_700">608.00sp</dimen>
45
- <dimen name="dt_size_icon_800">768.00sp</dimen>
46
50
  <dimen name="dt_size_border_0">0.00dp</dimen>
51
+ <dimen name="dt_size_border_50">8.00dp</dimen>
47
52
  <dimen name="dt_size_border_100">16.00dp</dimen>
53
+ <dimen name="dt_size_border_150">24.00dp</dimen>
48
54
  <dimen name="dt_size_border_200">32.00dp</dimen>
49
55
  <dimen name="dt_size_border_300">64.00dp</dimen>
50
56
  <dimen name="dt_size_border_400">128.00dp</dimen>
51
- <dimen name="dt_size_border_icon_100">16.00dp</dimen>
52
- <dimen name="dt_size_border_icon_200">20.00dp</dimen>
53
- <dimen name="dt_size_border_icon_300">24.00dp</dimen>
54
- <dimen name="dt_size_border_icon_400">28.00dp</dimen>
55
- <dimen name="dt_size_border_icon_500">28.00dp</dimen>
56
- <dimen name="dt_size_border_icon_600">40.00dp</dimen>
57
- <dimen name="dt_size_border_icon_700">44.00dp</dimen>
58
- <dimen name="dt_size_border_icon_800">56.00dp</dimen>
57
+ <dimen name="dt_size_border_focus">48.00dp</dimen>
58
+ <dimen name="dt_size_50_negative">-8.00dp</dimen>
59
+ <dimen name="dt_size_100_negative">-16.00dp</dimen>
60
+ <dimen name="dt_size_200_negative">-32.00dp</dimen>
61
+ <dimen name="dt_size_300_negative">-64.00dp</dimen>
62
+ <dimen name="dt_size_350_negative">-96.00dp</dimen>
63
+ <dimen name="dt_size_400_negative">-128.00dp</dimen>
64
+ <dimen name="dt_size_450_negative">-192.00dp</dimen>
65
+ <dimen name="dt_size_500_negative">-256.00dp</dimen>
66
+ <dimen name="dt_size_550_negative">-384.00dp</dimen>
67
+ <dimen name="dt_size_600_negative">-512.00dp</dimen>
68
+ <dimen name="dt_size_650_negative">-768.00dp</dimen>
69
+ <dimen name="dt_size_700_negative">-1024.00dp</dimen>
70
+ <dimen name="dt_size_750_negative">-1536.00dp</dimen>
71
+ <dimen name="dt_size_800_negative">-2048.00dp</dimen>
59
72
  <dimen name="dt_size_base">128.00dp</dimen>
60
73
  <dimen name="dt_size_radius_0">0.00dp</dimen>
61
74
  <dimen name="dt_size_radius_100">16.00dp</dimen>
@@ -64,6 +77,20 @@
64
77
  <dimen name="dt_size_radius_400">128.00dp</dimen>
65
78
  <dimen name="dt_size_radius_500">256.00dp</dimen>
66
79
  <dimen name="dt_size_radius_600">512.00dp</dimen>
80
+ <dimen name="dt_size_radius_pill">1600.00dp</dimen>
81
+ <dimen name="dt_size_radius_circle">800.00dp</dimen>
82
+ <dimen name="dt_inputs_size_border_default">1.5px</dimen>
83
+ <dimen name="dt_inputs_size_border_status">2px</dimen>
84
+ <dimen name="dt_inputs_size_radius_xs">4px</dimen>
85
+ <dimen name="dt_inputs_size_radius_sm">8px</dimen>
86
+ <dimen name="dt_inputs_size_radius_md">8px</dimen>
87
+ <dimen name="dt_inputs_size_radius_lg">12px</dimen>
88
+ <dimen name="dt_inputs_size_radius_xl">16px</dimen>
89
+ <dimen name="dt_inputs_font_size_xs">12px</dimen>
90
+ <dimen name="dt_inputs_font_size_sm">12px</dimen>
91
+ <dimen name="dt_inputs_font_size_md">15px</dimen>
92
+ <dimen name="dt_inputs_font_size_lg">19px</dimen>
93
+ <dimen name="dt_inputs_font_size_xl">27px</dimen>
67
94
  <dimen name="dt_font_size_100">12px</dimen>
68
95
  <dimen name="dt_font_size_200">15px</dimen>
69
96
  <dimen name="dt_font_size_300">19px</dimen>
@@ -71,14 +98,34 @@
71
98
  <dimen name="dt_font_size_500">38px</dimen>
72
99
  <dimen name="dt_font_size_root">10px</dimen>
73
100
  <dimen name="dt_space_0">0px</dimen>
101
+ <dimen name="dt_space_50">0.5px</dimen>
74
102
  <dimen name="dt_space_100">1px</dimen>
75
103
  <dimen name="dt_space_200">2px</dimen>
76
104
  <dimen name="dt_space_300">4px</dimen>
105
+ <dimen name="dt_space_350">6px</dimen>
77
106
  <dimen name="dt_space_400">8px</dimen>
107
+ <dimen name="dt_space_450">12px</dimen>
78
108
  <dimen name="dt_space_500">16px</dimen>
109
+ <dimen name="dt_space_550">24px</dimen>
79
110
  <dimen name="dt_space_600">32px</dimen>
111
+ <dimen name="dt_space_650">48px</dimen>
80
112
  <dimen name="dt_space_700">64px</dimen>
113
+ <dimen name="dt_space_750">96px</dimen>
81
114
  <dimen name="dt_space_800">128px</dimen>
115
+ <dimen name="dt_space_50_negative">-0.5px</dimen>
116
+ <dimen name="dt_space_100_negative">-1px</dimen>
117
+ <dimen name="dt_space_200_negative">-2px</dimen>
118
+ <dimen name="dt_space_300_negative">-4px</dimen>
119
+ <dimen name="dt_space_350_negative">-6px</dimen>
120
+ <dimen name="dt_space_400_negative">-8px</dimen>
121
+ <dimen name="dt_space_450_negative">-12px</dimen>
122
+ <dimen name="dt_space_500_negative">-16px</dimen>
123
+ <dimen name="dt_space_550_negative">-24px</dimen>
124
+ <dimen name="dt_space_600_negative">-32px</dimen>
125
+ <dimen name="dt_space_650_negative">-48px</dimen>
126
+ <dimen name="dt_space_700_negative">-64px</dimen>
127
+ <dimen name="dt_space_750_negative">-96px</dimen>
128
+ <dimen name="dt_space_800_negative">-128px</dimen>
82
129
  <dimen name="dt_space_base">8px</dimen>
83
130
 
84
131
  </resources>
@@ -1,57 +1,68 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Jan 2023 17:55:46 GMT
3
+ * Generated on Fri, 14 Apr 2023 23:49:08 GMT
4
4
  */
5
5
 
6
6
  :root {
7
- --dt-token-set-order-0: base;
8
- --dt-token-set-order-1: semantic;
9
- --dt-token-set-order-2: components/foo;
10
- --dt-token-set-order-3: components/bar;
11
- --dt-button-color-background-default: transparent;
12
- --dt-button-color-background-primary: #7C52FF;
13
- --dt-button-color-background-danger: #EC0E0E;
14
- --dt-button-color-text-default: #7C52FF;
15
- --dt-button-color-text-primary: #fff;
16
- --dt-button-color-text-danger: #fff;
17
- --dt-button-border-radius-extra-small: 0.7rem;
18
- --dt-button-border-radius-small: 0.75rem;
19
- --dt-button-border-radius-medium: 0.8rem;
20
- --dt-button-border-radius-large: 0.9rem;
21
- --dt-button-border-radius-extra-large: 1rem;
22
- --dt-button-space-gap: 16px;
23
- --dt-button-padding-horizontal-extra-small: 15px;
24
- --dt-button-padding-horizontal-small: 15px;
25
- --dt-button-padding-horizontal-medium: 15px;
26
- --dt-button-padding-horizontal-large: 63px;
27
- --dt-button-padding-horizontal-extra-large: 15px;
28
- --dt-button-padding-vertical-extra-small: 13px;
29
- --dt-button-padding-vertical-small: 13px;
30
- --dt-button-padding-vertical-medium: 15px;
31
- --dt-button-padding-vertical-large: 31px;
32
- --dt-button-padding-vertical-extra-large: 31px;
33
- --dt-button-font-size-extra-small: 1.2rem;
34
- --dt-button-font-size-small: 1.2rem;
35
- --dt-button-font-size-medium: 1.5rem;
36
- --dt-button-font-size-large: 1.9rem;
37
- --dt-button-font-size-extra-large: 2.7rem;
38
- --dt-button-line-height-size-extra-small: 120%;
39
- --dt-button-line-height-size-small: 140%;
40
- --dt-button-line-height-size-medium: 140%;
41
- --dt-button-line-height-size-large: 160%;
42
- --dt-button-line-height-size-extra-large: 160%;
43
- --dt-color-text-primary: #000000;
44
- --dt-color-text-secondary: #3a3a3a;
45
- --dt-color-text-tertiary: #555555;
46
- --dt-color-text-muted: rgba(34, 34, 34, 0.5);
47
- --dt-color-text-placeholder: #808080;
48
- --dt-color-text-disabled: #808080;
49
- --dt-color-text-critical: #ec0e0e;
50
- --dt-color-text-success: #1aa340;
51
- --dt-color-text-warning: #815008;
52
- --dt-color-text-inverted-primary: #ffffff;
53
- --dt-color-text-inverted-secondary: #e9e9e9;
54
- --dt-color-text-link-primary: #7c52ff;
7
+ --dt-color-foreground-primary: #000000;
8
+ --dt-color-foreground-secondary: #3a3a3a;
9
+ --dt-color-foreground-tertiary: #555555;
10
+ --dt-color-foreground-muted: rgba(34, 34, 34, 0.5);
11
+ --dt-color-foreground-placeholder: #808080;
12
+ --dt-color-foreground-disabled: #808080;
13
+ --dt-color-foreground-critical: #ec0e0e;
14
+ --dt-color-foreground-critical-strong: #b70b0b;
15
+ --dt-color-foreground-success: #1aa340;
16
+ --dt-color-foreground-success-strong: #124620;
17
+ --dt-color-foreground-warning: #815008;
18
+ --dt-color-foreground-primary-inverted: #ffffff;
19
+ --dt-color-foreground-secondary-inverted: #e9e9e9;
20
+ --dt-color-foreground-tertiary-inverted: #d2d2d2;
21
+ --dt-color-foreground-muted-inverted: rgba(233, 233, 233, 0.6);
22
+ --dt-color-foreground-placeholder-inverted: #808080;
23
+ --dt-color-foreground-disabled-inverted: #808080;
24
+ --dt-color-foreground-critical-inverted: #ff8585;
25
+ --dt-color-foreground-critical-strong-inverted: #ffa4a4;
26
+ --dt-color-foreground-success-inverted: #b0ffa3;
27
+ --dt-color-foreground-success-strong-inverted: #d3ffcd;
28
+ --dt-color-foreground-warning-inverted: #fff4cc;
29
+ --dt-color-link-primary: #7c52ff;
30
+ --dt-color-link-critical: #ec0e0e;
31
+ --dt-color-link-success: #1aa340;
32
+ --dt-color-link-warning: #815008;
33
+ --dt-color-link-muted: rgba(34, 34, 34, 0.5);
34
+ --dt-color-link-disabled: #808080;
35
+ --dt-color-link-primary-inverted: #ab7eff;
36
+ --dt-color-link-critical-inverted: #ff8585;
37
+ --dt-color-link-success-inverted: #b0ffa3;
38
+ --dt-color-link-warning-inverted: #fff4cc;
39
+ --dt-color-link-muted-inverted: rgba(233, 233, 233, 0.6);
40
+ --dt-color-link-disabled-inverted: #808080;
41
+ --dt-color-link-primary-hover: #3a1d95;
42
+ --dt-color-link-critical-hover: #b70b0b;
43
+ --dt-color-link-success-hover: #124620;
44
+ --dt-color-link-warning-hover: #555555;
45
+ --dt-color-link-muted-hover: #000000;
46
+ --dt-color-link-disabled-hover: #808080;
47
+ --dt-color-link-primary-inverted-hover: #dac7ff;
48
+ --dt-color-link-critical-inverted-hover: #ffa4a4;
49
+ --dt-color-link-success-inverted-hover: #d3ffcd;
50
+ --dt-color-link-warning-inverted-hover: #f9f9f9;
51
+ --dt-color-link-muted-inverted-hover: #f9f9f9;
52
+ --dt-color-link-disabled-inverted-hover: #808080;
53
+ --dt-color-surface-secondary-opaque: rgba(0, 0, 0, 0.02);
54
+ --dt-color-surface-moderate-opaque: rgba(0, 0, 0, 0.09);
55
+ --dt-color-surface-bold-opaque: rgba(0, 0, 0, 0.18);
56
+ --dt-color-surface-strong-opaque: rgba(0, 0, 0, 0.67);
57
+ --dt-color-surface-contrast-opaque: rgba(0, 0, 0, 0.87);
58
+ --dt-color-surface-critical-opaque: rgba(236, 14, 14, 0.11);
59
+ --dt-color-surface-critical-subtle-opaque: rgba(236, 14, 14, 0.05);
60
+ --dt-color-surface-warning-opaque: rgba(255, 219, 128, 0.38);
61
+ --dt-color-surface-warning-subtle-opaque: rgba(255, 219, 128, 0.18);
62
+ --dt-color-surface-success-opaque: rgba(26, 163, 65, 0.08);
63
+ --dt-color-surface-success-subtle-opaque: rgba(26, 163, 65, 0.03);
64
+ --dt-color-surface-info-opaque: rgba(23, 105, 198, 0.09);
65
+ --dt-color-surface-info-subtle-opaque: rgba(23, 105, 198, 0.04);
55
66
  --dt-color-surface-primary: #ffffff;
56
67
  --dt-color-surface-secondary: #f9f9f9;
57
68
  --dt-color-surface-moderate: #e9e9e9;
@@ -59,11 +70,55 @@
59
70
  --dt-color-surface-strong: #555555;
60
71
  --dt-color-surface-contrast: #222222;
61
72
  --dt-color-surface-critical: #ffe5e6;
73
+ --dt-color-surface-critical-subtle: #fff2f3;
74
+ --dt-color-surface-critical-strong: #b70b0b;
62
75
  --dt-color-surface-warning: #fff4cc;
76
+ --dt-color-surface-warning-subtle: #fffae5;
77
+ --dt-color-surface-warning-strong: #ffdb80;
63
78
  --dt-color-surface-success: #edf9eb;
79
+ --dt-color-surface-success-subtle: #f8fdf7;
80
+ --dt-color-surface-success-strong: #1aa340;
64
81
  --dt-color-surface-info: #eaf2fa;
82
+ --dt-color-surface-info-subtle: #f5f9fd;
83
+ --dt-color-surface-info-strong: #1768c6;
84
+ --dt-color-border-subtle: rgba(0, 0, 0, 0.1);
85
+ --dt-color-border-default: rgba(0, 0, 0, 0.18);
86
+ --dt-color-border-moderate: rgba(0, 0, 0, 0.34);
87
+ --dt-color-border-bold: rgba(0, 0, 0, 0.5);
88
+ --dt-color-border-subtle-inverted: rgba(255, 255, 255, 0.14);
89
+ --dt-color-border-default-inverted: rgba(255, 255, 255, 0.22);
90
+ --dt-color-border-moderate-inverted: rgba(255, 255, 255, 0.38);
91
+ --dt-color-border-bold-inverted: rgba(255, 255, 255, 0.5);
92
+ --dt-color-border-focus: #51a0fe;
93
+ --dt-color-border-critical: #ec0e0e;
94
+ --dt-color-border-success: #1aa340;
95
+ --dt-color-border-warning: #d28f2b;
96
+ --dt-color-border-brand: #7c52ff;
97
+ --dt-color-border-ai: #000000;
98
+ --dt-color-border-accent: #f9008e;
99
+ --dt-color-border-critical-subtle: #ff8585;
100
+ --dt-color-border-critical-strong: #b70b0b;
101
+ --dt-color-border-success-subtle: #b0ffa3;
102
+ --dt-color-border-success-strong: #124620;
103
+ --dt-color-border-warning-subtle: #ffdb80;
104
+ --dt-color-border-warning-strong: #674006;
105
+ --dt-color-border-brand-subtle: #dac7ff;
106
+ --dt-color-border-brand-strong: #3a1d95;
107
+ --dt-color-border-critical-inverted: #ff8585;
108
+ --dt-color-border-success-inverted: #b0ffa3;
109
+ --dt-color-border-warning-inverted: #ffdb80;
110
+ --dt-color-border-brand-inverted: #7c52ff;
111
+ --dt-color-border-critical-subtle-inverted: #b70b0b;
112
+ --dt-color-border-critical-strong-inverted: #ffe5e6;
113
+ --dt-color-border-success-subtle-inverted: #1aa340;
114
+ --dt-color-border-success-strong-inverted: #edf9eb;
115
+ --dt-color-border-warning-subtle-inverted: #d28f2b;
116
+ --dt-color-border-warning-strong-inverted: #fff4cc;
117
+ --dt-color-border-brand-subtle-inverted: #3a1d95;
118
+ --dt-color-border-brand-strong-inverted: #dac7ff;
65
119
  --dt-color-neutral-white: #ffffff;
66
120
  --dt-color-neutral-black: #000000;
121
+ --dt-color-neutral-transparent: rgba(0, 0, 0, 0);
67
122
  --dt-color-black-100: #f9f9f9;
68
123
  --dt-color-black-200: #e9e9e9;
69
124
  --dt-color-black-300: #d2d2d2;
@@ -110,6 +165,8 @@
110
165
  --dt-color-tan-400: #3f3d3c;
111
166
  --dt-color-tan-500: #121212;
112
167
  --dt-color-gradient-magenta-purple: #000000;
168
+ --dt-color-brand-purple: #7c52ff;
169
+ --dt-color-brand-magenta: #f9008e;
113
170
  --dt-typography-body-small-font-family: -apple-system,BlinkMacSystemFont,"SF Pro","Segoe UI Adjusted","Segoe UI",SFMono,"Helvetica Neue",Cantarell,Ubuntu,Roboto,Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
114
171
  --dt-typography-body-small-font-weight: 400;
115
172
  --dt-typography-body-small-line-height: 140%;
@@ -246,35 +303,42 @@
246
303
  --dt-typography-code-base-font-size: 1.5rem;
247
304
  --dt-typography-code-base-text-case: none;
248
305
  --dt-size-0: 0rem;
306
+ --dt-size-50: 0.05rem;
249
307
  --dt-size-100: 0.1rem;
250
308
  --dt-size-200: 0.2rem;
251
309
  --dt-size-300: 0.4rem;
310
+ --dt-size-350: 0.6rem;
252
311
  --dt-size-400: 0.8rem;
312
+ --dt-size-450: 1.2rem;
253
313
  --dt-size-500: 1.6rem;
314
+ --dt-size-550: 2.4rem;
254
315
  --dt-size-600: 3.2rem;
316
+ --dt-size-650: 4.8rem;
255
317
  --dt-size-700: 6.4rem;
318
+ --dt-size-750: 9.6rem;
256
319
  --dt-size-800: 12.8rem;
257
- --dt-size-icon-100: 1.2rem;
258
- --dt-size-icon-200: 1.4rem;
259
- --dt-size-icon-300: 1.8rem;
260
- --dt-size-icon-400: 2rem;
261
- --dt-size-icon-500: 2.4rem;
262
- --dt-size-icon-600: 3.2rem;
263
- --dt-size-icon-700: 3.8rem;
264
- --dt-size-icon-800: 4.8rem;
265
320
  --dt-size-border-0: 0rem;
321
+ --dt-size-border-50: 0.05rem;
266
322
  --dt-size-border-100: 0.1rem;
323
+ --dt-size-border-150: 0.15rem;
267
324
  --dt-size-border-200: 0.2rem;
268
325
  --dt-size-border-300: 0.4rem;
269
326
  --dt-size-border-400: 0.8rem;
270
- --dt-size-border-icon-100: 0.1rem;
271
- --dt-size-border-icon-200: 0.125rem;
272
- --dt-size-border-icon-300: 0.15rem;
273
- --dt-size-border-icon-400: 0.175rem;
274
- --dt-size-border-icon-500: 0.175rem;
275
- --dt-size-border-icon-600: 0.25rem;
276
- --dt-size-border-icon-700: 0.275rem;
277
- --dt-size-border-icon-800: 0.35rem;
327
+ --dt-size-border-focus: 0.3rem;
328
+ --dt-size-50-negative: -0.05rem;
329
+ --dt-size-100-negative: -0.1rem;
330
+ --dt-size-200-negative: -0.2rem;
331
+ --dt-size-300-negative: -0.4rem;
332
+ --dt-size-350-negative: -0.6rem;
333
+ --dt-size-400-negative: -0.8rem;
334
+ --dt-size-450-negative: -1.2rem;
335
+ --dt-size-500-negative: -1.6rem;
336
+ --dt-size-550-negative: -2.4rem;
337
+ --dt-size-600-negative: -3.2rem;
338
+ --dt-size-650-negative: -4.8rem;
339
+ --dt-size-700-negative: -6.4rem;
340
+ --dt-size-750-negative: -9.6rem;
341
+ --dt-size-800-negative: -12.8rem;
278
342
  --dt-size-base: 0.8rem;
279
343
  --dt-size-radius-0: 0rem;
280
344
  --dt-size-radius-100: 0.1rem;
@@ -283,6 +347,92 @@
283
347
  --dt-size-radius-400: 0.8rem;
284
348
  --dt-size-radius-500: 1.6rem;
285
349
  --dt-size-radius-600: 3.2rem;
350
+ --dt-size-radius-pill: 10rem;
351
+ --dt-size-radius-circle: 5rem;
352
+ --dt-inputs-size-border-default: 0.15rem;
353
+ --dt-inputs-size-border-status: 0.2rem;
354
+ --dt-inputs-size-radius-xs: 0.4rem;
355
+ --dt-inputs-size-radius-sm: 0.8rem;
356
+ --dt-inputs-size-radius-md: 0.8rem;
357
+ --dt-inputs-size-radius-lg: 1.2rem;
358
+ --dt-inputs-size-radius-xl: 1.6rem;
359
+ --dt-inputs-line-height-default: 120%;
360
+ --dt-inputs-font-size-xs: 1.2rem;
361
+ --dt-inputs-font-size-sm: 1.2rem;
362
+ --dt-inputs-font-size-md: 1.5rem;
363
+ --dt-inputs-font-size-lg: 1.9rem;
364
+ --dt-inputs-font-size-xl: 2.7rem;
365
+ --dt-inputs-color-foreground-default: #3A3A3A;
366
+ --dt-inputs-color-foreground-placeholder: #808080;
367
+ --dt-inputs-color-foreground-disabled: #808080;
368
+ --dt-inputs-color-border-default: #0000001a;
369
+ --dt-inputs-color-border-focus: #51A0FE;
370
+ --dt-inputs-color-border-critical: #EC0E0E;
371
+ --dt-inputs-color-border-success: #1AA340;
372
+ --dt-inputs-color-border-warning: #D28F2B;
373
+ --dt-inputs-color-border-disabled: transparent;
374
+ --dt-inputs-color-background-default: #00000008;
375
+ --dt-inputs-color-background-focus: #00000003;
376
+ --dt-inputs-color-background-disabled: #0000001f;
377
+ --dt-action-color-foreground-base-default: #7C52FF;
378
+ --dt-action-color-foreground-base-hover: #551FFF;
379
+ --dt-action-color-foreground-base-active: #551FFF;
380
+ --dt-action-color-foreground-base-primary-default: #ffffff;
381
+ --dt-action-color-foreground-critical-default: #EC0E0E;
382
+ --dt-action-color-foreground-critical-hover: #D90D0D;
383
+ --dt-action-color-foreground-critical-active: #D90D0D;
384
+ --dt-action-color-foreground-critical-primary-default: #ffffff;
385
+ --dt-action-color-foreground-inverted-default: #ffffff;
386
+ --dt-action-color-foreground-inverted-hover: #ffffff;
387
+ --dt-action-color-foreground-inverted-active: #ffffff;
388
+ --dt-action-color-foreground-inverted-primary-default: #7C52FF;
389
+ --dt-action-color-foreground-inverted-primary-hover: #3A1D95;
390
+ --dt-action-color-foreground-inverted-primary-active: #3A1D95;
391
+ --dt-action-color-foreground-muted-default: #3A3A3A;
392
+ --dt-action-color-foreground-muted-hover: #3A3A3A;
393
+ --dt-action-color-foreground-muted-active: #3A3A3A;
394
+ --dt-action-color-foreground-disabled-default: #808080;
395
+ --dt-action-color-background-base-default: transparent;
396
+ --dt-action-color-background-base-hover: #7c52ff0a;
397
+ --dt-action-color-background-base-active: #7c52ff24;
398
+ --dt-action-color-background-base-primary-default: #7C52FF;
399
+ --dt-action-color-background-base-primary-hover: #6533FF;
400
+ --dt-action-color-background-base-primary-active: #4D14FF;
401
+ --dt-action-color-background-critical-default: transparent;
402
+ --dt-action-color-background-critical-hover: #ec0e0e08;
403
+ --dt-action-color-background-critical-active: #ec0e0e17;
404
+ --dt-action-color-background-critical-primary-default: #EC0E0E;
405
+ --dt-action-color-background-critical-primary-hover: #D90D0D;
406
+ --dt-action-color-background-critical-primary-active: #C50C0C;
407
+ --dt-action-color-background-inverted-default: transparent;
408
+ --dt-action-color-background-inverted-hover: #ffffff26;
409
+ --dt-action-color-background-inverted-active: #ffffff4d;
410
+ --dt-action-color-background-inverted-primary-default: #ffffff;
411
+ --dt-action-color-background-inverted-primary-hover: #F5F0FF;
412
+ --dt-action-color-background-inverted-primary-active: #E1D1FF;
413
+ --dt-action-color-background-muted-default: transparent;
414
+ --dt-action-color-background-muted-hover: #2222220d;
415
+ --dt-action-color-background-muted-active: #2222221a;
416
+ --dt-action-color-background-disabled-default: #D2D2D2;
417
+ --dt-action-color-border-base-outlined-default: #7C52FF;
418
+ --dt-action-color-border-critical-outlined-default: #EC0E0E;
419
+ --dt-action-color-border-inverted-outlined-default: #F9F9F9;
420
+ --dt-action-color-border-muted-outlined-default: #555555;
421
+ --dt-theme-sidebar-color-foreground: #000000;
422
+ --dt-theme-sidebar-color-background: #F9F9F9;
423
+ --dt-theme-sidebar-icon-color-foreground: #3A3A3A;
424
+ --dt-theme-sidebar-status-color-foreground: #555555;
425
+ --dt-theme-sidebar-row-color-background: transparent;
426
+ --dt-theme-sidebar-row-color-background-hover: #0000001a;
427
+ --dt-theme-sidebar-row-color-background-active: #D2D2D2;
428
+ --dt-theme-sidebar-selected-row-color-foreground: #000000;
429
+ --dt-theme-sidebar-selected-row-color-background: #E9E9E9;
430
+ --dt-theme-presence-color-background-available: #1AA340;
431
+ --dt-theme-presence-color-background-busy-unavailable: #EC0E0E;
432
+ --dt-theme-presence-color-background-busy: #F6AB3C;
433
+ --dt-theme-presence-color-background-offline: #ffffff;
434
+ --dt-theme-mention-color-foreground: #ffffff;
435
+ --dt-theme-mention-color-background: #7C52FF;
286
436
  --dt-opacity-0: 0;
287
437
  --dt-opacity-100: 0.05;
288
438
  --dt-opacity-200: 0.1;
@@ -321,14 +471,34 @@
321
471
  --dt-font-text-case-capitalize: capitalize;
322
472
  --dt-font-text-case-none: none;
323
473
  --dt-space-0: 0px;
474
+ --dt-space-50: 0.5px;
324
475
  --dt-space-100: 1px;
325
476
  --dt-space-200: 2px;
326
477
  --dt-space-300: 4px;
478
+ --dt-space-350: 6px;
327
479
  --dt-space-400: 8px;
480
+ --dt-space-450: 12px;
328
481
  --dt-space-500: 16px;
482
+ --dt-space-550: 24px;
329
483
  --dt-space-600: 32px;
484
+ --dt-space-650: 48px;
330
485
  --dt-space-700: 64px;
486
+ --dt-space-750: 96px;
331
487
  --dt-space-800: 128px;
488
+ --dt-space-50-negative: -0.5px;
489
+ --dt-space-100-negative: -1px;
490
+ --dt-space-200-negative: -2px;
491
+ --dt-space-300-negative: -4px;
492
+ --dt-space-350-negative: -6px;
493
+ --dt-space-400-negative: -8px;
494
+ --dt-space-450-negative: -12px;
495
+ --dt-space-500-negative: -16px;
496
+ --dt-space-550-negative: -24px;
497
+ --dt-space-600-negative: -32px;
498
+ --dt-space-650-negative: -48px;
499
+ --dt-space-700-negative: -64px;
500
+ --dt-space-750-negative: -96px;
501
+ --dt-space-800-negative: -128px;
332
502
  --dt-space-base: 8px;
333
503
  --dt-shadow-small-0-x: 0;
334
504
  --dt-shadow-small-0-y: 0.2rem;