@vector-im/compound-design-tokens 1.8.0 → 1.9.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.
- package/assets/web/css/compound-design-tokens.css +1 -0
- package/assets/web/css/cpd-common-base.css +77 -77
- package/assets/web/css/cpd-common-semantic.css +67 -67
- package/assets/web/css/cpd-font-fallbacks.css +427 -0
- package/assets/web/css/cpd-theme-dark-base-mq.css +308 -308
- package/assets/web/css/cpd-theme-dark-base.css +308 -308
- package/assets/web/css/cpd-theme-dark-hc-base-mq.css +308 -308
- package/assets/web/css/cpd-theme-dark-hc-base.css +308 -308
- package/assets/web/css/cpd-theme-dark-hc-semantic-mq.css +1 -1
- package/assets/web/css/cpd-theme-dark-hc-semantic.css +1 -1
- package/assets/web/css/cpd-theme-dark-semantic-mq.css +1 -1
- package/assets/web/css/cpd-theme-dark-semantic.css +1 -1
- package/assets/web/css/cpd-theme-light-base-mq.css +308 -308
- package/assets/web/css/cpd-theme-light-base.css +308 -308
- package/assets/web/css/cpd-theme-light-hc-base-mq.css +308 -308
- package/assets/web/css/cpd-theme-light-hc-base.css +308 -308
- package/assets/web/css/cpd-theme-light-hc-semantic-mq.css +1 -1
- package/assets/web/css/cpd-theme-light-hc-semantic.css +1 -1
- package/assets/web/css/cpd-theme-light-semantic-mq.css +1 -1
- package/assets/web/css/cpd-theme-light-semantic.css +1 -1
- package/assets/web/icons/index.cjs +1 -0
- package/assets/web/icons/index.d.ts +1 -0
- package/assets/web/icons/index.js +1 -0
- package/assets/web/icons/mark-threads-as-read.cjs +19 -0
- package/assets/web/icons/mark-threads-as-read.d.ts +11 -0
- package/assets/web/icons/mark-threads-as-read.js +19 -0
- package/assets/web/js/cpdDark.d.ts +1 -0
- package/assets/web/js/cpdDark.js +24 -23
- package/assets/web/js/cpdDarkHc.d.ts +1 -0
- package/assets/web/js/cpdDarkHc.js +24 -23
- package/assets/web/js/cpdLight.d.ts +1 -0
- package/assets/web/js/cpdLight.js +24 -23
- package/assets/web/js/cpdLightHc.d.ts +1 -0
- package/assets/web/js/cpdLightHc.js +24 -23
- package/icons/$icons.json +1 -1
- package/icons/mark-threads-as-read.svg +3 -0
- package/package.json +5 -11
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
@layer cpd-semantic, custom, cpd-base;
|
|
5
5
|
|
|
6
|
+
@import url("./cpd-font-fallbacks.css");
|
|
6
7
|
@import url("./cpd-common-base.css") layer(cpd-base) screen;
|
|
7
8
|
@import url("./cpd-common-semantic.css") layer(cpd-semantic) screen;
|
|
8
9
|
@import url("./cpd-theme-light-base.css") layer(cpd-base) screen;
|
|
@@ -1,81 +1,81 @@
|
|
|
1
1
|
:root, [class*="cpd-theme-"] {
|
|
2
|
-
--cpd-font-letter-spacing-heading-xl: -0.0216em;
|
|
3
|
-
--cpd-font-letter-spacing-heading-lg: -0.0209em;
|
|
4
|
-
--cpd-font-letter-spacing-heading-md: -0.0195em;
|
|
5
|
-
--cpd-font-letter-spacing-heading-sm: -0.0166em;
|
|
6
|
-
--cpd-font-letter-spacing-body-lg: -0.0128em;
|
|
7
|
-
--cpd-font-letter-spacing-body-md: -0.0088em;
|
|
8
|
-
--cpd-font-letter-spacing-body-sm: -0.0031em;
|
|
9
|
-
--cpd-font-letter-spacing-body-xs: 0.0048em;
|
|
10
|
-
--cpd-font-size-root: 1rem;
|
|
11
|
-
--cpd-font-size-heading-xl: 2rem;
|
|
12
|
-
--cpd-font-size-heading-lg: 1.75rem;
|
|
13
|
-
--cpd-font-size-heading-md: 1.5rem;
|
|
14
|
-
--cpd-font-size-heading-sm: 1.25rem;
|
|
15
|
-
--cpd-font-size-body-lg: 1.0625rem;
|
|
16
|
-
--cpd-font-size-body-md: 0.9375rem;
|
|
17
|
-
--cpd-font-size-body-sm: 0.8125rem;
|
|
18
|
-
--cpd-font-size-body-xs: 0.6875rem;
|
|
19
|
-
--cpd-font-line-height-regular: 1.5;
|
|
20
|
-
--cpd-font-line-height-tight: 1.25;
|
|
21
|
-
--cpd-font-line-height-minimum: 1;
|
|
22
|
-
--cpd-font-weight-semibold: 600;
|
|
23
|
-
--cpd-font-weight-medium: 500;
|
|
24
|
-
--cpd-font-weight-regular: 400;
|
|
25
|
-
--cpd-font-family-mono: Inconsolata;
|
|
26
|
-
--cpd-font-family-sans: Inter;
|
|
27
|
-
--cpd-border-width-0-5: 0.5px;
|
|
28
|
-
--cpd-border-width-4: 4px;
|
|
29
|
-
--cpd-border-width-2: 2px;
|
|
30
|
-
--cpd-border-width-1: 1px;
|
|
31
|
-
--cpd-space-56x: 224px;
|
|
32
|
-
--cpd-space-36x: 144px;
|
|
33
|
-
--cpd-space-16x: 64px;
|
|
34
|
-
--cpd-space-12x: 48px;
|
|
35
|
-
--cpd-space-11x: 44px;
|
|
36
|
-
--cpd-space-10x: 40px;
|
|
37
|
-
--cpd-space-6x: 24px;
|
|
38
|
-
--cpd-space-0x: 0;
|
|
39
2
|
--cpd-space-scale: 4px;
|
|
40
|
-
--cpd-
|
|
41
|
-
--cpd-
|
|
42
|
-
--cpd-
|
|
43
|
-
--cpd-
|
|
44
|
-
--cpd-
|
|
45
|
-
--cpd-
|
|
46
|
-
--cpd-
|
|
47
|
-
--cpd-
|
|
48
|
-
--cpd-
|
|
49
|
-
--cpd-
|
|
50
|
-
--cpd-
|
|
51
|
-
--cpd-
|
|
52
|
-
--cpd-font-
|
|
53
|
-
--cpd-font-
|
|
54
|
-
--cpd-font-
|
|
55
|
-
--cpd-font-
|
|
56
|
-
--cpd-font-
|
|
57
|
-
--cpd-font-
|
|
58
|
-
--cpd-font-
|
|
59
|
-
--cpd-font-
|
|
60
|
-
--cpd-font-
|
|
61
|
-
--cpd-
|
|
62
|
-
--cpd-
|
|
63
|
-
--cpd-
|
|
64
|
-
--cpd-
|
|
65
|
-
--cpd-
|
|
66
|
-
--cpd-
|
|
67
|
-
--cpd-
|
|
68
|
-
--cpd-
|
|
69
|
-
--cpd-
|
|
70
|
-
--cpd-
|
|
71
|
-
--cpd-
|
|
72
|
-
--cpd-
|
|
73
|
-
--cpd-
|
|
74
|
-
--cpd-
|
|
75
|
-
--cpd-
|
|
76
|
-
--cpd-
|
|
77
|
-
--cpd-space-2x: 8px;
|
|
78
|
-
--cpd-space-1-5x: 6px;
|
|
79
|
-
--cpd-space-1x: var(--cpd-space-scale);
|
|
3
|
+
--cpd-space-0x: 0;
|
|
4
|
+
--cpd-space-6x: 24px;
|
|
5
|
+
--cpd-space-10x: 40px;
|
|
6
|
+
--cpd-space-11x: 44px;
|
|
7
|
+
--cpd-space-12x: 48px;
|
|
8
|
+
--cpd-space-16x: 64px;
|
|
9
|
+
--cpd-space-36x: 144px;
|
|
10
|
+
--cpd-space-56x: 224px;
|
|
11
|
+
--cpd-border-width-1: 1px;
|
|
12
|
+
--cpd-border-width-2: 2px;
|
|
13
|
+
--cpd-border-width-4: 4px;
|
|
14
|
+
--cpd-border-width-0-5: 0.5px;
|
|
15
|
+
--cpd-font-family-sans: Inter, "Inter Fallback: Helvetica Neue", "Inter Fallback: Segoe UI", "Inter Fallback: Roboto", "Inter Fallback: Ubuntu", "Inter Fallback: Fira Sans", "Inter Fallback: Noto Sans", "Inter Fallback: Arial", "Helvetica Neue", "Segoe UI", Roboto, Ubuntu, "Fira Sans", "Noto Sans", Arial, sans-serif;
|
|
16
|
+
--cpd-font-family-mono: Inconsolata, ui-monospace, monospace;
|
|
17
|
+
--cpd-font-weight-regular: 400;
|
|
18
|
+
--cpd-font-weight-medium: 500;
|
|
19
|
+
--cpd-font-weight-semibold: 600;
|
|
20
|
+
--cpd-font-line-height-minimum: 1;
|
|
21
|
+
--cpd-font-line-height-tight: 1.25;
|
|
22
|
+
--cpd-font-line-height-regular: 1.5;
|
|
23
|
+
--cpd-font-size-body-xs: 0.6875rem;
|
|
24
|
+
--cpd-font-size-body-sm: 0.8125rem;
|
|
25
|
+
--cpd-font-size-body-md: 0.9375rem;
|
|
26
|
+
--cpd-font-size-body-lg: 1.0625rem;
|
|
27
|
+
--cpd-font-size-heading-sm: 1.25rem;
|
|
28
|
+
--cpd-font-size-heading-md: 1.5rem;
|
|
29
|
+
--cpd-font-size-heading-lg: 1.75rem;
|
|
30
|
+
--cpd-font-size-heading-xl: 2rem;
|
|
31
|
+
--cpd-font-size-root: 1rem;
|
|
32
|
+
--cpd-font-letter-spacing-body-xs: 0.0048em;
|
|
33
|
+
--cpd-font-letter-spacing-body-sm: -0.0031em;
|
|
34
|
+
--cpd-font-letter-spacing-body-md: -0.0088em;
|
|
35
|
+
--cpd-font-letter-spacing-body-lg: -0.0128em;
|
|
36
|
+
--cpd-font-letter-spacing-heading-sm: -0.0166em;
|
|
37
|
+
--cpd-font-letter-spacing-heading-md: -0.0195em;
|
|
38
|
+
--cpd-font-letter-spacing-heading-lg: -0.0209em;
|
|
39
|
+
--cpd-font-letter-spacing-heading-xl: -0.0216em;
|
|
80
40
|
--cpd-space-0-5x: 2px;
|
|
41
|
+
--cpd-space-1x: var(--cpd-space-scale);
|
|
42
|
+
--cpd-space-1-5x: 6px;
|
|
43
|
+
--cpd-space-2x: 8px;
|
|
44
|
+
--cpd-space-3x: 12px;
|
|
45
|
+
--cpd-space-4x: 16px;
|
|
46
|
+
--cpd-space-5x: 20px;
|
|
47
|
+
--cpd-space-7x: 28px;
|
|
48
|
+
--cpd-space-8x: 32px;
|
|
49
|
+
--cpd-space-9x: 36px;
|
|
50
|
+
--cpd-space-13x: 52px;
|
|
51
|
+
--cpd-space-14x: 56px;
|
|
52
|
+
--cpd-space-15x: 60px;
|
|
53
|
+
--cpd-space-20x: 80px;
|
|
54
|
+
--cpd-space-24x: 96px;
|
|
55
|
+
--cpd-space-28x: 112px;
|
|
56
|
+
--cpd-space-32x: 128px;
|
|
57
|
+
--cpd-space-40x: 160px;
|
|
58
|
+
--cpd-space-48x: 192px;
|
|
59
|
+
--cpd-space-64x: 256px;
|
|
60
|
+
--cpd-font-body-xs-regular: var(--cpd-font-weight-regular) var(--cpd-font-size-body-xs)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
61
|
+
--cpd-font-body-xs-medium: var(--cpd-font-weight-medium) var(--cpd-font-size-body-xs)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
62
|
+
--cpd-font-body-xs-semibold: var(--cpd-font-weight-semibold) var(--cpd-font-size-body-xs)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
63
|
+
--cpd-font-body-sm-regular: var(--cpd-font-weight-regular) var(--cpd-font-size-body-sm)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
64
|
+
--cpd-font-body-sm-medium: var(--cpd-font-weight-medium) var(--cpd-font-size-body-sm)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
65
|
+
--cpd-font-body-sm-semibold: var(--cpd-font-weight-semibold) var(--cpd-font-size-body-sm)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
66
|
+
--cpd-font-body-md-regular: var(--cpd-font-weight-regular) var(--cpd-font-size-body-md)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
67
|
+
--cpd-font-body-md-medium: var(--cpd-font-weight-medium) var(--cpd-font-size-body-md)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
68
|
+
--cpd-font-body-md-semibold: var(--cpd-font-weight-semibold) var(--cpd-font-size-body-md)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
69
|
+
--cpd-font-body-lg-regular: var(--cpd-font-weight-regular) var(--cpd-font-size-body-lg)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
70
|
+
--cpd-font-body-lg-medium: var(--cpd-font-weight-medium) var(--cpd-font-size-body-lg)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
71
|
+
--cpd-font-body-lg-semibold: var(--cpd-font-weight-semibold) var(--cpd-font-size-body-lg)/var(--cpd-font-line-height-regular) var(--cpd-font-family-sans);
|
|
72
|
+
--cpd-font-heading-sm-regular: var(--cpd-font-weight-regular) var(--cpd-font-size-heading-sm)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
73
|
+
--cpd-font-heading-sm-medium: var(--cpd-font-weight-medium) var(--cpd-font-size-heading-sm)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
74
|
+
--cpd-font-heading-sm-semibold: var(--cpd-font-weight-semibold) var(--cpd-font-size-heading-sm)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
75
|
+
--cpd-font-heading-md-regular: var(--cpd-font-weight-regular) var(--cpd-font-size-heading-md)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
76
|
+
--cpd-font-heading-md-semibold: var(--cpd-font-weight-semibold) var(--cpd-font-size-heading-md)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
77
|
+
--cpd-font-heading-lg-regular: var(--cpd-font-weight-regular) var(--cpd-font-size-heading-lg)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
78
|
+
--cpd-font-heading-lg-semibold: var(--cpd-font-weight-semibold) var(--cpd-font-size-heading-lg)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
79
|
+
--cpd-font-heading-xl-regular: var(--cpd-font-weight-regular) var(--cpd-font-size-heading-xl)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
80
|
+
--cpd-font-heading-xl-semibold: var(--cpd-font-weight-semibold) var(--cpd-font-size-heading-xl)/var(--cpd-font-line-height-tight) var(--cpd-font-family-sans);
|
|
81
81
|
}
|
|
@@ -1,70 +1,70 @@
|
|
|
1
1
|
:root, [class*="cpd-theme-"] {
|
|
2
|
-
--cpd-color-icon-on-solid-primary: var(--cpd-color-theme-bg);
|
|
3
|
-
--cpd-color-icon-info-primary: var(--cpd-color-blue-900);
|
|
4
|
-
--cpd-color-icon-success-primary: var(--cpd-color-green-900);
|
|
5
|
-
--cpd-color-icon-critical-primary: var(--cpd-color-red-900);
|
|
6
|
-
--cpd-color-icon-accent-primary: var(--cpd-color-green-900);
|
|
7
|
-
--cpd-color-icon-accent-tertiary: var(--cpd-color-green-800);
|
|
8
|
-
--cpd-color-icon-quaternary-alpha: var(--cpd-color-alpha-gray-700);
|
|
9
|
-
--cpd-color-icon-tertiary-alpha: var(--cpd-color-alpha-gray-800);
|
|
10
|
-
--cpd-color-icon-secondary-alpha: var(--cpd-color-alpha-gray-900);
|
|
11
|
-
--cpd-color-icon-primary-alpha: var(--cpd-color-alpha-gray-1400);
|
|
12
|
-
--cpd-color-icon-disabled: var(--cpd-color-gray-700);
|
|
13
|
-
--cpd-color-icon-quaternary: var(--cpd-color-gray-700);
|
|
14
|
-
--cpd-color-icon-tertiary: var(--cpd-color-gray-800);
|
|
15
|
-
--cpd-color-icon-secondary: var(--cpd-color-gray-900);
|
|
16
|
-
--cpd-color-icon-primary: var(--cpd-color-gray-1400);
|
|
17
|
-
--cpd-color-border-info-subtle: var(--cpd-color-blue-500);
|
|
18
|
-
--cpd-color-border-success-subtle: var(--cpd-color-green-500);
|
|
19
|
-
--cpd-color-border-critical-subtle: var(--cpd-color-red-500);
|
|
20
|
-
--cpd-color-border-critical-hovered: var(--cpd-color-red-1000);
|
|
21
|
-
--cpd-color-border-critical-primary: var(--cpd-color-red-900);
|
|
22
|
-
--cpd-color-border-interactive-hovered: var(--cpd-color-gray-1100);
|
|
23
|
-
--cpd-color-border-interactive-secondary: var(--cpd-color-gray-600);
|
|
24
|
-
--cpd-color-border-interactive-primary: var(--cpd-color-gray-800);
|
|
25
|
-
--cpd-color-border-focused: var(--cpd-color-blue-900);
|
|
26
|
-
--cpd-color-border-disabled: var(--cpd-color-gray-500);
|
|
27
|
-
--cpd-color-bg-accent-pressed: var(--cpd-color-green-1100);
|
|
28
|
-
--cpd-color-bg-accent-hovered: var(--cpd-color-green-1000);
|
|
29
|
-
--cpd-color-bg-accent-rest: var(--cpd-color-green-900);
|
|
30
|
-
--cpd-color-bg-decorative-6: var(--cpd-color-orange-300);
|
|
31
|
-
--cpd-color-bg-decorative-5: var(--cpd-color-pink-300);
|
|
32
|
-
--cpd-color-bg-decorative-4: var(--cpd-color-purple-300);
|
|
33
|
-
--cpd-color-bg-decorative-3: var(--cpd-color-fuchsia-300);
|
|
34
|
-
--cpd-color-bg-decorative-2: var(--cpd-color-cyan-300);
|
|
35
|
-
--cpd-color-bg-decorative-1: var(--cpd-color-lime-300);
|
|
36
|
-
--cpd-color-bg-info-subtle: var(--cpd-color-blue-200);
|
|
37
|
-
--cpd-color-bg-success-subtle: var(--cpd-color-green-200);
|
|
38
|
-
--cpd-color-bg-critical-subtle-hovered: var(--cpd-color-red-300);
|
|
39
|
-
--cpd-color-bg-critical-subtle: var(--cpd-color-red-200);
|
|
40
|
-
--cpd-color-bg-critical-hovered: var(--cpd-color-red-1000);
|
|
41
|
-
--cpd-color-bg-critical-primary: var(--cpd-color-red-900);
|
|
42
|
-
--cpd-color-bg-action-secondary-pressed: var(--cpd-color-alpha-gray-300);
|
|
43
|
-
--cpd-color-bg-action-secondary-hovered: var(--cpd-color-alpha-gray-200);
|
|
44
|
-
--cpd-color-bg-action-secondary-rest: var(--cpd-color-theme-bg);
|
|
45
|
-
--cpd-color-bg-action-primary-disabled: var(--cpd-color-gray-700);
|
|
46
|
-
--cpd-color-bg-action-primary-pressed: var(--cpd-color-gray-1100);
|
|
47
|
-
--cpd-color-bg-action-primary-hovered: var(--cpd-color-gray-1200);
|
|
48
|
-
--cpd-color-bg-action-primary-rest: var(--cpd-color-gray-1400);
|
|
49
|
-
--cpd-color-bg-canvas-disabled: var(--cpd-color-gray-200);
|
|
50
|
-
--cpd-color-bg-canvas-default: var(--cpd-color-theme-bg);
|
|
51
|
-
--cpd-color-bg-subtle-secondary: var(--cpd-color-gray-300);
|
|
52
|
-
--cpd-color-bg-subtle-primary: var(--cpd-color-gray-400);
|
|
53
|
-
--cpd-color-text-decorative-6: var(--cpd-color-orange-1100);
|
|
54
|
-
--cpd-color-text-decorative-5: var(--cpd-color-pink-1100);
|
|
55
|
-
--cpd-color-text-decorative-4: var(--cpd-color-purple-1100);
|
|
56
|
-
--cpd-color-text-decorative-3: var(--cpd-color-fuchsia-1100);
|
|
57
|
-
--cpd-color-text-decorative-2: var(--cpd-color-cyan-1100);
|
|
58
|
-
--cpd-color-text-decorative-1: var(--cpd-color-lime-1100);
|
|
59
|
-
--cpd-color-text-on-solid-primary: var(--cpd-color-theme-bg);
|
|
60
|
-
--cpd-color-text-info-primary: var(--cpd-color-blue-900);
|
|
61
|
-
--cpd-color-text-success-primary: var(--cpd-color-green-900);
|
|
62
|
-
--cpd-color-text-critical-primary: var(--cpd-color-red-900);
|
|
63
|
-
--cpd-color-text-link-external: var(--cpd-color-blue-900);
|
|
64
|
-
--cpd-color-text-action-accent: var(--cpd-color-green-900);
|
|
65
|
-
--cpd-color-text-action-primary: var(--cpd-color-gray-1400);
|
|
66
|
-
--cpd-color-text-disabled: var(--cpd-color-gray-800);
|
|
67
|
-
--cpd-color-text-placeholder: var(--cpd-color-gray-800);
|
|
68
|
-
--cpd-color-text-secondary: var(--cpd-color-gray-900);
|
|
69
2
|
--cpd-color-text-primary: var(--cpd-color-gray-1400);
|
|
3
|
+
--cpd-color-text-secondary: var(--cpd-color-gray-900);
|
|
4
|
+
--cpd-color-text-placeholder: var(--cpd-color-gray-800);
|
|
5
|
+
--cpd-color-text-disabled: var(--cpd-color-gray-800);
|
|
6
|
+
--cpd-color-text-action-primary: var(--cpd-color-gray-1400);
|
|
7
|
+
--cpd-color-text-action-accent: var(--cpd-color-green-900);
|
|
8
|
+
--cpd-color-text-link-external: var(--cpd-color-blue-900);
|
|
9
|
+
--cpd-color-text-critical-primary: var(--cpd-color-red-900);
|
|
10
|
+
--cpd-color-text-success-primary: var(--cpd-color-green-900);
|
|
11
|
+
--cpd-color-text-info-primary: var(--cpd-color-blue-900);
|
|
12
|
+
--cpd-color-text-on-solid-primary: var(--cpd-color-theme-bg);
|
|
13
|
+
--cpd-color-text-decorative-1: var(--cpd-color-lime-1100);
|
|
14
|
+
--cpd-color-text-decorative-2: var(--cpd-color-cyan-1100);
|
|
15
|
+
--cpd-color-text-decorative-3: var(--cpd-color-fuchsia-1100);
|
|
16
|
+
--cpd-color-text-decorative-4: var(--cpd-color-purple-1100);
|
|
17
|
+
--cpd-color-text-decorative-5: var(--cpd-color-pink-1100);
|
|
18
|
+
--cpd-color-text-decorative-6: var(--cpd-color-orange-1100);
|
|
19
|
+
--cpd-color-bg-subtle-primary: var(--cpd-color-gray-400);
|
|
20
|
+
--cpd-color-bg-subtle-secondary: var(--cpd-color-gray-300);
|
|
21
|
+
--cpd-color-bg-canvas-default: var(--cpd-color-theme-bg);
|
|
22
|
+
--cpd-color-bg-canvas-disabled: var(--cpd-color-gray-200);
|
|
23
|
+
--cpd-color-bg-action-primary-rest: var(--cpd-color-gray-1400);
|
|
24
|
+
--cpd-color-bg-action-primary-hovered: var(--cpd-color-gray-1200);
|
|
25
|
+
--cpd-color-bg-action-primary-pressed: var(--cpd-color-gray-1100);
|
|
26
|
+
--cpd-color-bg-action-primary-disabled: var(--cpd-color-gray-700);
|
|
27
|
+
--cpd-color-bg-action-secondary-rest: var(--cpd-color-theme-bg);
|
|
28
|
+
--cpd-color-bg-action-secondary-hovered: var(--cpd-color-alpha-gray-200);
|
|
29
|
+
--cpd-color-bg-action-secondary-pressed: var(--cpd-color-alpha-gray-300);
|
|
30
|
+
--cpd-color-bg-critical-primary: var(--cpd-color-red-900);
|
|
31
|
+
--cpd-color-bg-critical-hovered: var(--cpd-color-red-1000);
|
|
32
|
+
--cpd-color-bg-critical-subtle: var(--cpd-color-red-200);
|
|
33
|
+
--cpd-color-bg-critical-subtle-hovered: var(--cpd-color-red-300);
|
|
34
|
+
--cpd-color-bg-success-subtle: var(--cpd-color-green-200);
|
|
35
|
+
--cpd-color-bg-info-subtle: var(--cpd-color-blue-200);
|
|
36
|
+
--cpd-color-bg-decorative-1: var(--cpd-color-lime-300);
|
|
37
|
+
--cpd-color-bg-decorative-2: var(--cpd-color-cyan-300);
|
|
38
|
+
--cpd-color-bg-decorative-3: var(--cpd-color-fuchsia-300);
|
|
39
|
+
--cpd-color-bg-decorative-4: var(--cpd-color-purple-300);
|
|
40
|
+
--cpd-color-bg-decorative-5: var(--cpd-color-pink-300);
|
|
41
|
+
--cpd-color-bg-decorative-6: var(--cpd-color-orange-300);
|
|
42
|
+
--cpd-color-bg-accent-rest: var(--cpd-color-green-900);
|
|
43
|
+
--cpd-color-bg-accent-hovered: var(--cpd-color-green-1000);
|
|
44
|
+
--cpd-color-bg-accent-pressed: var(--cpd-color-green-1100);
|
|
45
|
+
--cpd-color-border-disabled: var(--cpd-color-gray-500);
|
|
46
|
+
--cpd-color-border-focused: var(--cpd-color-blue-900);
|
|
47
|
+
--cpd-color-border-interactive-primary: var(--cpd-color-gray-800);
|
|
48
|
+
--cpd-color-border-interactive-secondary: var(--cpd-color-gray-600);
|
|
49
|
+
--cpd-color-border-interactive-hovered: var(--cpd-color-gray-1100);
|
|
50
|
+
--cpd-color-border-critical-primary: var(--cpd-color-red-900);
|
|
51
|
+
--cpd-color-border-critical-hovered: var(--cpd-color-red-1000);
|
|
52
|
+
--cpd-color-border-critical-subtle: var(--cpd-color-red-500);
|
|
53
|
+
--cpd-color-border-success-subtle: var(--cpd-color-green-500);
|
|
54
|
+
--cpd-color-border-info-subtle: var(--cpd-color-blue-500);
|
|
55
|
+
--cpd-color-icon-primary: var(--cpd-color-gray-1400);
|
|
56
|
+
--cpd-color-icon-secondary: var(--cpd-color-gray-900);
|
|
57
|
+
--cpd-color-icon-tertiary: var(--cpd-color-gray-800);
|
|
58
|
+
--cpd-color-icon-quaternary: var(--cpd-color-gray-700);
|
|
59
|
+
--cpd-color-icon-disabled: var(--cpd-color-gray-700);
|
|
60
|
+
--cpd-color-icon-primary-alpha: var(--cpd-color-alpha-gray-1400);
|
|
61
|
+
--cpd-color-icon-secondary-alpha: var(--cpd-color-alpha-gray-900);
|
|
62
|
+
--cpd-color-icon-tertiary-alpha: var(--cpd-color-alpha-gray-800);
|
|
63
|
+
--cpd-color-icon-quaternary-alpha: var(--cpd-color-alpha-gray-700);
|
|
64
|
+
--cpd-color-icon-accent-tertiary: var(--cpd-color-green-800);
|
|
65
|
+
--cpd-color-icon-accent-primary: var(--cpd-color-green-900);
|
|
66
|
+
--cpd-color-icon-critical-primary: var(--cpd-color-red-900);
|
|
67
|
+
--cpd-color-icon-success-primary: var(--cpd-color-green-900);
|
|
68
|
+
--cpd-color-icon-info-primary: var(--cpd-color-blue-900);
|
|
69
|
+
--cpd-color-icon-on-solid-primary: var(--cpd-color-theme-bg);
|
|
70
70
|
}
|