@bspk/ui 1.3.30 → 1.4.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.
- package/build.ts +1 -2
- package/dist/components/StylesProviderAgentWorkplace/StylesProviderAgentWorkplace.d.ts +11 -0
- package/dist/components/StylesProviderAgentWorkplace/StylesProviderAgentWorkplace.js +14 -0
- package/dist/components/StylesProviderAgentWorkplace/StylesProviderAgentWorkplace.js.map +1 -0
- package/dist/components/StylesProviderAgentWorkplace/index.d.ts +1 -0
- package/dist/components/StylesProviderAgentWorkplace/index.js +2 -0
- package/dist/components/StylesProviderAgentWorkplace/index.js.map +1 -0
- package/dist/components/StylesProviderBrokerWorkplace/StylesProviderBrokerWorkplace.d.ts +11 -0
- package/dist/components/StylesProviderBrokerWorkplace/StylesProviderBrokerWorkplace.js +14 -0
- package/dist/components/StylesProviderBrokerWorkplace/StylesProviderBrokerWorkplace.js.map +1 -0
- package/dist/components/StylesProviderBrokerWorkplace/index.d.ts +1 -0
- package/dist/components/StylesProviderBrokerWorkplace/index.js +2 -0
- package/dist/components/StylesProviderBrokerWorkplace/index.js.map +1 -0
- package/dist/components/StylesProviderDemo/brandsCss.js +10 -9
- package/dist/components/StylesProviderDemo/brandsCss.js.map +1 -1
- package/dist/components/StylesProviderDemo/exampleCss.js +5 -5
- package/dist/components/StylesProviderDemo/exampleCss.js.map +1 -1
- package/dist/components/Table/Table.js +1 -1
- package/dist/components/Table/Table.js.map +1 -1
- package/dist/styles/agent-workplace.css +1800 -0
- package/dist/styles/{denali-boss.css.js → agent-workplace.css.js} +770 -849
- package/dist/styles/anywhere.css +687 -766
- package/dist/styles/anywhere.css.js +687 -766
- package/dist/styles/better-homes-gardens.css +579 -826
- package/dist/styles/better-homes-gardens.css.js +579 -826
- package/dist/styles/broker-workplace.css +1800 -0
- package/dist/styles/broker-workplace.css.js +1805 -0
- package/dist/styles/cartus.css +674 -765
- package/dist/styles/cartus.css.js +674 -765
- package/dist/styles/century-21.css +679 -766
- package/dist/styles/century-21.css.js +679 -766
- package/dist/styles/coldwell-banker.css +671 -762
- package/dist/styles/coldwell-banker.css.js +671 -762
- package/dist/styles/corcoran.css +663 -758
- package/dist/styles/corcoran.css.js +663 -758
- package/dist/styles/era.css +677 -766
- package/dist/styles/era.css.js +677 -766
- package/dist/styles/example.css +1898 -0
- package/dist/styles/example.css.js +1903 -0
- package/dist/styles/sothebys.css +670 -759
- package/dist/styles/sothebys.css.js +670 -759
- package/dist/types/common.d.ts +2 -1
- package/dist/types/common.js.map +1 -1
- package/package.json +7 -47
- package/src/components/StylesProviderAgentWorkplace/StylesProviderAgentWorkplace.tsx +15 -0
- package/src/components/StylesProviderAgentWorkplace/index.tsx +1 -0
- package/src/components/StylesProviderBrokerWorkplace/StylesProviderBrokerWorkplace.tsx +15 -0
- package/src/components/StylesProviderBrokerWorkplace/index.tsx +1 -0
- package/src/components/StylesProviderDemo/brandsCss.ts +13 -10
- package/src/components/StylesProviderDemo/exampleCss.ts +5 -5
- package/src/components/Table/Table.tsx +1 -1
- package/{dist/styles/denali-boss.css → src/styles/example.css} +401 -384
- package/src/types/common.ts +2 -10
- package/dist/components/StylesProviderDenaliBoss/StylesProviderDenaliBoss.d.ts +0 -11
- package/dist/components/StylesProviderDenaliBoss/StylesProviderDenaliBoss.js +0 -14
- package/dist/components/StylesProviderDenaliBoss/StylesProviderDenaliBoss.js.map +0 -1
- package/dist/components/StylesProviderDenaliBoss/index.d.ts +0 -1
- package/dist/components/StylesProviderDenaliBoss/index.js +0 -2
- package/dist/components/StylesProviderDenaliBoss/index.js.map +0 -1
- package/dist/constants/brands.d.ts +0 -7
- package/dist/constants/brands.js +0 -43
- package/dist/constants/brands.js.map +0 -1
- package/src/components/StylesProviderDenaliBoss/StylesProviderDenaliBoss.tsx +0 -15
- package/src/components/StylesProviderDenaliBoss/index.tsx +0 -1
- package/src/constants/brands.ts +0 -49
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* Generated from figma export:
|
|
1
|
+
/* Generated from figma export: 2026-02-02T17:54:13.533Z */
|
|
2
2
|
|
|
3
3
|
@import url('https://fonts.googleapis.com/css2?family=Work%20Sans:ital,wght@0,100..900;1,100..900&display=swap');
|
|
4
4
|
body {
|
|
@@ -6,182 +6,42 @@ body {
|
|
|
6
6
|
}
|
|
7
7
|
|
|
8
8
|
:root {
|
|
9
|
-
/* Colors/Brands/
|
|
9
|
+
/* Colors/Brands/BRAND/Black - Global (primitives) */
|
|
10
10
|
--black: #000000;
|
|
11
|
-
/* Colors/Brands/
|
|
11
|
+
/* Colors/Brands/BRAND/Blue - Global (primitives) */
|
|
12
12
|
--blue: #256c98;
|
|
13
13
|
/* Body/Base */
|
|
14
|
-
--body-base: 400 16px/
|
|
15
|
-
/* Body/Base -
|
|
16
|
-
--body-base-line-height:
|
|
17
|
-
/* Body/Base -
|
|
14
|
+
--body-base: 400 16px/24px var(--typeface);
|
|
15
|
+
/* Body/Base - line height */
|
|
16
|
+
--body-base-line-height: 24px;
|
|
17
|
+
/* Body/Base - size */
|
|
18
18
|
--body-base-size: 16px;
|
|
19
|
-
/* Body/Base -
|
|
19
|
+
/* Body/Base - style */
|
|
20
20
|
--body-base-style: regular;
|
|
21
21
|
/* Body/Large */
|
|
22
|
-
--body-large: 400 18px/
|
|
23
|
-
/* Body/Large -
|
|
24
|
-
--body-large-line-height:
|
|
25
|
-
/* Body/Large -
|
|
22
|
+
--body-large: 400 18px/28px var(--typeface);
|
|
23
|
+
/* Body/Large - line height */
|
|
24
|
+
--body-large-line-height: 28px;
|
|
25
|
+
/* Body/Large - size */
|
|
26
26
|
--body-large-size: 18px;
|
|
27
|
-
/* Body/Large -
|
|
27
|
+
/* Body/Large - style */
|
|
28
28
|
--body-large-style: regular;
|
|
29
29
|
/* Body/Small */
|
|
30
30
|
--body-small: 400 14px/20px var(--typeface);
|
|
31
|
-
/* Body/Small -
|
|
31
|
+
/* Body/Small - line height */
|
|
32
32
|
--body-small-line-height: 20px;
|
|
33
|
-
/* Body/Small -
|
|
33
|
+
/* Body/Small - size */
|
|
34
34
|
--body-small-size: 14px;
|
|
35
|
-
/* Body/Small -
|
|
35
|
+
/* Body/Small - style */
|
|
36
36
|
--body-small-style: regular;
|
|
37
37
|
/* Body/X-Small */
|
|
38
38
|
--body-x-small: 400 12px/16px var(--typeface);
|
|
39
|
-
/* Body/X-Small -
|
|
39
|
+
/* Body/X-Small - line height */
|
|
40
40
|
--body-x-small-line-height: 16px;
|
|
41
|
-
/* Body/X-Small -
|
|
41
|
+
/* Body/X-Small - size */
|
|
42
42
|
--body-x-small-size: 12px;
|
|
43
|
-
/* Body/X-Small -
|
|
43
|
+
/* Body/X-Small - style */
|
|
44
44
|
--body-x-small-style: regular;
|
|
45
|
-
/* Colors/Brands/Experiment/blue-dark/100 - Global (primitives) */
|
|
46
|
-
--colors-brands-experiment-blue-dark-100: #0a2f85;
|
|
47
|
-
/* Colors/Brands/Experiment/blue-dark/200 - Global (primitives) */
|
|
48
|
-
--colors-brands-experiment-blue-dark-200: #1347cc;
|
|
49
|
-
/* Colors/Brands/Experiment/blue-dark/300 - Global (primitives) */
|
|
50
|
-
--colors-brands-experiment-blue-dark-300: #0f59e2;
|
|
51
|
-
/* Colors/Brands/Experiment/blue-dark/400 - Global (primitives) */
|
|
52
|
-
--colors-brands-experiment-blue-dark-400: #357aea;
|
|
53
|
-
/* Colors/Brands/Experiment/blue-dark/50 - Global (primitives) */
|
|
54
|
-
--colors-brands-experiment-blue-dark-50: #181d34;
|
|
55
|
-
/* Colors/Brands/Experiment/blue-dark/500 - Global (primitives) */
|
|
56
|
-
--colors-brands-experiment-blue-dark-500: #2e88f6;
|
|
57
|
-
/* Colors/Brands/Experiment/blue-dark/600 - Global (primitives) */
|
|
58
|
-
--colors-brands-experiment-blue-dark-600: #50a1ff;
|
|
59
|
-
/* Colors/Brands/Experiment/blue-dark/700 - Global (primitives) */
|
|
60
|
-
--colors-brands-experiment-blue-dark-700: #7ab7ff;
|
|
61
|
-
/* Colors/Brands/Experiment/blue-dark/800 - Global (primitives) */
|
|
62
|
-
--colors-brands-experiment-blue-dark-800: #dcebfe;
|
|
63
|
-
/* Colors/Brands/Experiment/blue-dark/900 - Global (primitives) */
|
|
64
|
-
--colors-brands-experiment-blue-dark-900: #f0f6ff;
|
|
65
|
-
/* Colors/Brands/Experiment/blue-gray-dark/100 - Global (primitives) */
|
|
66
|
-
--colors-brands-experiment-blue-gray-dark-100: #1a2332;
|
|
67
|
-
/* Colors/Brands/Experiment/blue-gray-dark/200 - Global (primitives) */
|
|
68
|
-
--colors-brands-experiment-blue-gray-dark-200: #252e3c;
|
|
69
|
-
/* Colors/Brands/Experiment/blue-gray-dark/300 - Global (primitives) */
|
|
70
|
-
--colors-brands-experiment-blue-gray-dark-300: #323b49;
|
|
71
|
-
/* Colors/Brands/Experiment/blue-gray-dark/400 - Global (primitives) */
|
|
72
|
-
--colors-brands-experiment-blue-gray-dark-400: #5e6d82;
|
|
73
|
-
/* Colors/Brands/Experiment/blue-gray-dark/50 - Global (primitives) */
|
|
74
|
-
--colors-brands-experiment-blue-gray-dark-50: #0c101c;
|
|
75
|
-
/* Colors/Brands/Experiment/blue-gray-dark/500 - Global (primitives) */
|
|
76
|
-
--colors-brands-experiment-blue-gray-dark-500: #8b9bb2;
|
|
77
|
-
/* Colors/Brands/Experiment/blue-gray-dark/600 - Global (primitives) */
|
|
78
|
-
--colors-brands-experiment-blue-gray-dark-600: #b1c0d2;
|
|
79
|
-
/* Colors/Brands/Experiment/blue-gray-dark/700 - Global (primitives) */
|
|
80
|
-
--colors-brands-experiment-blue-gray-dark-700: #d4dce8;
|
|
81
|
-
/* Colors/Brands/Experiment/blue-gray-dark/800 - Global (primitives) */
|
|
82
|
-
--colors-brands-experiment-blue-gray-dark-800: #e2ebf3;
|
|
83
|
-
/* Colors/Brands/Experiment/blue-gray-dark/900 - Global (primitives) */
|
|
84
|
-
--colors-brands-experiment-blue-gray-dark-900: #f8fafc;
|
|
85
|
-
/* Colors/Brands/Experiment/blue-gray-light/100 - Global (primitives) */
|
|
86
|
-
--colors-brands-experiment-blue-gray-light-100: #f1f5f9;
|
|
87
|
-
/* Colors/Brands/Experiment/blue-gray-light/200 - Global (primitives) */
|
|
88
|
-
--colors-brands-experiment-blue-gray-light-200: #e1e7ef;
|
|
89
|
-
/* Colors/Brands/Experiment/blue-gray-light/300 - Global (primitives) */
|
|
90
|
-
--colors-brands-experiment-blue-gray-light-300: #c8d6e5;
|
|
91
|
-
/* Colors/Brands/Experiment/blue-gray-light/400 - Global (primitives) */
|
|
92
|
-
--colors-brands-experiment-blue-gray-light-400: #9eacc0;
|
|
93
|
-
/* Colors/Brands/Experiment/blue-gray-light/50 - Global (primitives) */
|
|
94
|
-
--colors-brands-experiment-blue-gray-light-50: #f8fafc;
|
|
95
|
-
/* Colors/Brands/Experiment/blue-gray-light/500 - Global (primitives) */
|
|
96
|
-
--colors-brands-experiment-blue-gray-light-500: #65758b;
|
|
97
|
-
/* Colors/Brands/Experiment/blue-gray-light/600 - Global (primitives) */
|
|
98
|
-
--colors-brands-experiment-blue-gray-light-600: #48566a;
|
|
99
|
-
/* Colors/Brands/Experiment/blue-gray-light/700 - Global (primitives) */
|
|
100
|
-
--colors-brands-experiment-blue-gray-light-700: #344256;
|
|
101
|
-
/* Colors/Brands/Experiment/blue-gray-light/800 - Global (primitives) */
|
|
102
|
-
--colors-brands-experiment-blue-gray-light-800: #1d283a;
|
|
103
|
-
/* Colors/Brands/Experiment/blue-gray-light/900 - Global (primitives) */
|
|
104
|
-
--colors-brands-experiment-blue-gray-light-900: #0f1729;
|
|
105
|
-
/* Colors/Brands/Experiment/blue-light/100 - Global (primitives) */
|
|
106
|
-
--colors-brands-experiment-blue-light-100: #dcebfe;
|
|
107
|
-
/* Colors/Brands/Experiment/blue-light/200 - Global (primitives) */
|
|
108
|
-
--colors-brands-experiment-blue-light-200: #bedbfe;
|
|
109
|
-
/* Colors/Brands/Experiment/blue-light/300 - Global (primitives) */
|
|
110
|
-
--colors-brands-experiment-blue-light-300: #91c3fd;
|
|
111
|
-
/* Colors/Brands/Experiment/blue-light/400 - Global (primitives) */
|
|
112
|
-
--colors-brands-experiment-blue-light-400: #61a6fa;
|
|
113
|
-
/* Colors/Brands/Experiment/blue-light/50 - Global (primitives) */
|
|
114
|
-
--colors-brands-experiment-blue-light-50: #f2f7ff;
|
|
115
|
-
/* Colors/Brands/Experiment/blue-light/500 - Global (primitives) */
|
|
116
|
-
--colors-brands-experiment-blue-light-500: #3479e9;
|
|
117
|
-
/* Colors/Brands/Experiment/blue-light/600 - Global (primitives) */
|
|
118
|
-
--colors-brands-experiment-blue-light-600: #1559ea;
|
|
119
|
-
/* Colors/Brands/Experiment/blue-light/700 - Global (primitives) */
|
|
120
|
-
--colors-brands-experiment-blue-light-700: #173fab;
|
|
121
|
-
/* Colors/Brands/Experiment/blue-light/800 - Global (primitives) */
|
|
122
|
-
--colors-brands-experiment-blue-light-800: #162f82;
|
|
123
|
-
/* Colors/Brands/Experiment/blue-light/900 - Global (primitives) */
|
|
124
|
-
--colors-brands-experiment-blue-light-900: #0c1736;
|
|
125
|
-
/* Colors/Brands/Experiment/Interactions/primary-dark-opacity-10 - Global (primitives) */
|
|
126
|
-
--colors-brands-experiment-interactions-primary-dark-opacity-10: #50a1ff1a;
|
|
127
|
-
/* Colors/Brands/Experiment/Interactions/primary-dark-opacity-12 - Global (primitives) */
|
|
128
|
-
--colors-brands-experiment-interactions-primary-dark-opacity-12: #50a1ff1f;
|
|
129
|
-
/* Colors/Brands/Experiment/Interactions/primary-dark-opacity-16 - Global (primitives) */
|
|
130
|
-
--colors-brands-experiment-interactions-primary-dark-opacity-16: #50a1ff29;
|
|
131
|
-
/* Colors/Brands/Experiment/Interactions/primary-dark-opacity-20 - Global (primitives) */
|
|
132
|
-
--colors-brands-experiment-interactions-primary-dark-opacity-20: #50a1ff33;
|
|
133
|
-
/* Colors/Brands/Experiment/Interactions/primary-dark-opacity-8 - Global (primitives) */
|
|
134
|
-
--colors-brands-experiment-interactions-primary-dark-opacity-8: #50a1ff14;
|
|
135
|
-
/* Colors/Brands/Experiment/Interactions/primary-light-opacity-10 - Global (primitives) */
|
|
136
|
-
--colors-brands-experiment-interactions-primary-light-opacity-10: #1559ea1a;
|
|
137
|
-
/* Colors/Brands/Experiment/Interactions/primary-light-opacity-12 - Global (primitives) */
|
|
138
|
-
--colors-brands-experiment-interactions-primary-light-opacity-12: #1559ea1f;
|
|
139
|
-
/* Colors/Brands/Experiment/Interactions/primary-light-opacity-16 - Global (primitives) */
|
|
140
|
-
--colors-brands-experiment-interactions-primary-light-opacity-16: #1559ea29;
|
|
141
|
-
/* Colors/Brands/Experiment/Interactions/primary-light-opacity-20 - Global (primitives) */
|
|
142
|
-
--colors-brands-experiment-interactions-primary-light-opacity-20: #1559ea33;
|
|
143
|
-
/* Colors/Brands/Experiment/Interactions/primary-light-opacity-8 - Global (primitives) */
|
|
144
|
-
--colors-brands-experiment-interactions-primary-light-opacity-8: #1559ea14;
|
|
145
|
-
/* Colors/Brands/Experiment/orange-dark/100 - Global (primitives) */
|
|
146
|
-
--colors-brands-experiment-orange-dark-100: #852c0f;
|
|
147
|
-
/* Colors/Brands/Experiment/orange-dark/200 - Global (primitives) */
|
|
148
|
-
--colors-brands-experiment-orange-dark-200: #ab4827;
|
|
149
|
-
/* Colors/Brands/Experiment/orange-dark/300 - Global (primitives) */
|
|
150
|
-
--colors-brands-experiment-orange-dark-300: #ce5a07;
|
|
151
|
-
/* Colors/Brands/Experiment/orange-dark/400 - Global (primitives) */
|
|
152
|
-
--colors-brands-experiment-orange-dark-400: #f27013;
|
|
153
|
-
/* Colors/Brands/Experiment/orange-dark/50 - Global (primitives) */
|
|
154
|
-
--colors-brands-experiment-orange-dark-50: #31160d;
|
|
155
|
-
/* Colors/Brands/Experiment/orange-dark/500 - Global (primitives) */
|
|
156
|
-
--colors-brands-experiment-orange-dark-500: #fb923c;
|
|
157
|
-
/* Colors/Brands/Experiment/orange-dark/600 - Global (primitives) */
|
|
158
|
-
--colors-brands-experiment-orange-dark-600: #fdba72;
|
|
159
|
-
/* Colors/Brands/Experiment/orange-dark/700 - Global (primitives) */
|
|
160
|
-
--colors-brands-experiment-orange-dark-700: #fed6a9;
|
|
161
|
-
/* Colors/Brands/Experiment/orange-dark/800 - Global (primitives) */
|
|
162
|
-
--colors-brands-experiment-orange-dark-800: #ffedd6;
|
|
163
|
-
/* Colors/Brands/Experiment/orange-dark/900 - Global (primitives) */
|
|
164
|
-
--colors-brands-experiment-orange-dark-900: #fff6eb;
|
|
165
|
-
/* Colors/Brands/Experiment/orange-light/100 - Global (primitives) */
|
|
166
|
-
--colors-brands-experiment-orange-light-100: #ffedd6;
|
|
167
|
-
/* Colors/Brands/Experiment/orange-light/200 - Global (primitives) */
|
|
168
|
-
--colors-brands-experiment-orange-light-200: #fed6a9;
|
|
169
|
-
/* Colors/Brands/Experiment/orange-light/300 - Global (primitives) */
|
|
170
|
-
--colors-brands-experiment-orange-light-300: #fdba72;
|
|
171
|
-
/* Colors/Brands/Experiment/orange-light/400 - Global (primitives) */
|
|
172
|
-
--colors-brands-experiment-orange-light-400: #fb923c;
|
|
173
|
-
/* Colors/Brands/Experiment/orange-light/50 - Global (primitives) */
|
|
174
|
-
--colors-brands-experiment-orange-light-50: #fff6eb;
|
|
175
|
-
/* Colors/Brands/Experiment/orange-light/500 - Global (primitives) */
|
|
176
|
-
--colors-brands-experiment-orange-light-500: #f67416;
|
|
177
|
-
/* Colors/Brands/Experiment/orange-light/600 - Global (primitives) */
|
|
178
|
-
--colors-brands-experiment-orange-light-600: #e4570c;
|
|
179
|
-
/* Colors/Brands/Experiment/orange-light/700 - Global (primitives) */
|
|
180
|
-
--colors-brands-experiment-orange-light-700: #b63c0b;
|
|
181
|
-
/* Colors/Brands/Experiment/orange-light/800 - Global (primitives) */
|
|
182
|
-
--colors-brands-experiment-orange-light-800: #80310f;
|
|
183
|
-
/* Colors/Brands/Experiment/orange-light/900 - Global (primitives) */
|
|
184
|
-
--colors-brands-experiment-orange-light-900: #471a0a;
|
|
185
45
|
/* Colors/Internal/pink-00-light - Global (primitives) */
|
|
186
46
|
--colors-internal-pink-00-light: #ff4f8d;
|
|
187
47
|
/* Colors/Internal/pink-50-dark - Global (primitives) */
|
|
@@ -213,7 +73,7 @@ body {
|
|
|
213
73
|
/* Colors/Neutral/22 - Global (primitives) */
|
|
214
74
|
--colors-neutral-22: #383838;
|
|
215
75
|
/* Colors/Neutral/24 - Global (primitives) */
|
|
216
|
-
--colors-neutral-24: #
|
|
76
|
+
--colors-neutral-24: #3d3d3d;
|
|
217
77
|
/* Colors/Neutral/26 - Global (primitives) */
|
|
218
78
|
--colors-neutral-26: #424242;
|
|
219
79
|
/* Colors/Neutral/28 - Global (primitives) */
|
|
@@ -290,6 +150,10 @@ body {
|
|
|
290
150
|
--colors-neutral-98: #fafafa;
|
|
291
151
|
/* Colors/Neutral/transparent - Global (primitives) */
|
|
292
152
|
--colors-neutral-transparent: #ffffff00;
|
|
153
|
+
/* Colors/System/AI-gradient/blue - Global (primitives) */
|
|
154
|
+
--colors-system-ai-gradient-blue: #215ecd;
|
|
155
|
+
/* Colors/System/AI-gradient/pink - Global (primitives) */
|
|
156
|
+
--colors-system-ai-gradient-pink: #c60ede;
|
|
293
157
|
/* Colors/System/blue-dark - Global (primitives) */
|
|
294
158
|
--colors-system-blue-dark: #5d92f5;
|
|
295
159
|
/* Colors/System/blue-dark-bg - Global (primitives) */
|
|
@@ -338,10 +202,10 @@ body {
|
|
|
338
202
|
--colors-system-spectrum-data-visual-azure-400: #7fc4ec;
|
|
339
203
|
/* Colors/System/Spectrum/Data visual/azure-700 - Global (primitives) */
|
|
340
204
|
--colors-system-spectrum-data-visual-azure-700: #299de0;
|
|
341
|
-
/* Colors/System/Spectrum/Data visual/backrose-900 - Global (primitives) */
|
|
342
|
-
--colors-system-spectrum-data-visual-backrose-900: #958ca3;
|
|
343
205
|
/* Colors/System/Spectrum/Data visual/blackrose-1200 - Global (primitives) */
|
|
344
206
|
--colors-system-spectrum-data-visual-blackrose-1200: #130033;
|
|
207
|
+
/* Colors/System/Spectrum/Data visual/blackrose-900 - Global (primitives) */
|
|
208
|
+
--colors-system-spectrum-data-visual-blackrose-900: #958ca3;
|
|
345
209
|
/* Colors/System/Spectrum/Data visual/bronze-1100 - Global (primitives) */
|
|
346
210
|
--colors-system-spectrum-data-visual-bronze-1100: #794b34;
|
|
347
211
|
/* Colors/System/Spectrum/Data visual/bronze-800 - Global (primitives) */
|
|
@@ -370,10 +234,10 @@ body {
|
|
|
370
234
|
--colors-system-spectrum-data-visual-highlight-azure-400-opacity: #7fc4ec4d;
|
|
371
235
|
/* Colors/System/Spectrum/Data visual/Highlight/azure-700-opacity - Global (primitives) */
|
|
372
236
|
--colors-system-spectrum-data-visual-highlight-azure-700-opacity: #299de04d;
|
|
373
|
-
/* Colors/System/Spectrum/Data visual/Highlight/backrose-900-opacity - Global (primitives) */
|
|
374
|
-
--colors-system-spectrum-data-visual-highlight-backrose-900-opacity: #958ca34d;
|
|
375
237
|
/* Colors/System/Spectrum/Data visual/Highlight/blackrose-1200-opacity - Global (primitives) */
|
|
376
238
|
--colors-system-spectrum-data-visual-highlight-blackrose-1200-opacity: #1300334d;
|
|
239
|
+
/* Colors/System/Spectrum/Data visual/Highlight/blackrose-900-opacity - Global (primitives) */
|
|
240
|
+
--colors-system-spectrum-data-visual-highlight-blackrose-900-opacity: #958ca34d;
|
|
377
241
|
/* Colors/System/Spectrum/Data visual/Highlight/bronze-1100-opacity - Global (primitives) */
|
|
378
242
|
--colors-system-spectrum-data-visual-highlight-bronze-1100-opacity: #794b344d;
|
|
379
243
|
/* Colors/System/Spectrum/Data visual/Highlight/bronze-800-opacity - Global (primitives) */
|
|
@@ -582,7 +446,7 @@ body {
|
|
|
582
446
|
--colors-system-yellow-light: #f6bc2f;
|
|
583
447
|
/* Colors/System/yellow-light-bg - Global (primitives) */
|
|
584
448
|
--colors-system-yellow-light-bg: #fef5e0;
|
|
585
|
-
/* Colors/Brands/
|
|
449
|
+
/* Colors/Brands/BRAND/Coral - Global (primitives) */
|
|
586
450
|
--coral: #dd6b47;
|
|
587
451
|
/* Corner radius/120 - Global (primitives) */
|
|
588
452
|
--corner-radius-120: 12px;
|
|
@@ -596,10 +460,8 @@ body {
|
|
|
596
460
|
--corner-radius-circular: 999px;
|
|
597
461
|
/* Corner radius/None - Global (primitives) */
|
|
598
462
|
--corner-radius-none: 0;
|
|
599
|
-
/* Colors/Brands/
|
|
463
|
+
/* Colors/Brands/BRAND/Dark Grey - Global (primitives) */
|
|
600
464
|
--dark-grey: #636466;
|
|
601
|
-
/* Data visual/category-1 - Theme - Better Home & Garden */
|
|
602
|
-
--data-visual-category-1: #0a466c;
|
|
603
465
|
/* East - navigation rails, drawers, sheets */
|
|
604
466
|
--drop-shadow-east: 2px 0px 8px -2px #0000001a, 2px 0px 4px -2px #0000001f;
|
|
605
467
|
/* Float */
|
|
@@ -614,24 +476,10 @@ body {
|
|
|
614
476
|
--drop-shadow-south: 0px 2px 8px -2px #0000001a, 0px 2px 4px -2px #0000001f;
|
|
615
477
|
/* West - side sheets */
|
|
616
478
|
--drop-shadow-west: -8px 0px 8px -2px #0000001a, -5px 4px 4px -6px #00000026;
|
|
617
|
-
/* Foreground/
|
|
618
|
-
--foreground-
|
|
619
|
-
/* Foreground/
|
|
620
|
-
--foreground-
|
|
621
|
-
/* Foreground/Neutral/inverse-on-surface - Theme - Better Home & Garden */
|
|
622
|
-
--foreground-neutral-inverse-on-surface: #fafafa;
|
|
623
|
-
/* Foreground/Neutral/on-color - Theme - Better Home & Garden */
|
|
624
|
-
--foreground-neutral-on-color: #ffffff;
|
|
625
|
-
/* Foreground/Neutral/on-inverse-surface - Theme - Better Home & Garden */
|
|
626
|
-
--foreground-neutral-on-inverse-surface: #fafafa;
|
|
627
|
-
/* Interaction/disabled-opacity - Theme - 3.0 */
|
|
628
|
-
--interaction-disabled-opacity: #0000000f;
|
|
629
|
-
/* Interaction/primary-disabled-opacity - Theme - 3.0 */
|
|
630
|
-
--interaction-primary-disabled-opacity: #1559ea1f;
|
|
631
|
-
/* Interaction/primary-hover-opacity - Theme - 3.0 */
|
|
632
|
-
--interaction-primary-hover-opacity: #1559ea1a;
|
|
633
|
-
/* Interaction/primary-press-opacity - Theme - 3.0 */
|
|
634
|
-
--interaction-primary-press-opacity: #1559ea33;
|
|
479
|
+
/* Foreground/AI-powered/blue - Theme - BRAND */
|
|
480
|
+
--foreground-ai-powered-blue: #000000;
|
|
481
|
+
/* Foreground/AI-powered/pink - Theme - BRAND */
|
|
482
|
+
--foreground-ai-powered-pink: #000000;
|
|
635
483
|
/* Interactions/opacity-black-10 - Global (primitives) */
|
|
636
484
|
--interactions-opacity-black-10: #0000001a;
|
|
637
485
|
/* Interactions/opacity-black-16 - Global (primitives) */
|
|
@@ -656,73 +504,73 @@ body {
|
|
|
656
504
|
--interactions-opacity-white-6: #ffffff0f;
|
|
657
505
|
/* Interactions/opacity-white-8 - Global (primitives) */
|
|
658
506
|
--interactions-opacity-white-8: #ffffff14;
|
|
659
|
-
/* Colors/Brands/
|
|
507
|
+
/* Colors/Brands/BRAND/Interactions/primary-dark-opacity-10 - Global (primitives) */
|
|
660
508
|
--interactions-primary-dark-opacity-10: #7db67c1a;
|
|
661
|
-
/* Colors/Brands/
|
|
509
|
+
/* Colors/Brands/BRAND/Interactions/primary-dark-opacity-12 - Global (primitives) */
|
|
662
510
|
--interactions-primary-dark-opacity-12: #7db67c1f;
|
|
663
|
-
/* Colors/Brands/
|
|
511
|
+
/* Colors/Brands/BRAND/Interactions/primary-dark-opacity-16 - Global (primitives) */
|
|
664
512
|
--interactions-primary-dark-opacity-16: #7db67c29;
|
|
665
|
-
/* Colors/Brands/
|
|
513
|
+
/* Colors/Brands/BRAND/Interactions/primary-dark-opacity-20 - Global (primitives) */
|
|
666
514
|
--interactions-primary-dark-opacity-20: #7db67c33;
|
|
667
|
-
/* Colors/Brands/
|
|
515
|
+
/* Colors/Brands/BRAND/Interactions/primary-dark-opacity-8 - Global (primitives) */
|
|
668
516
|
--interactions-primary-dark-opacity-8: #7db67c14;
|
|
669
|
-
/* Colors/Brands/
|
|
517
|
+
/* Colors/Brands/BRAND/Interactions/primary-light-opacity-10 - Global (primitives) */
|
|
670
518
|
--interactions-primary-light-opacity-10: #2786271a;
|
|
671
|
-
/* Colors/Brands/
|
|
519
|
+
/* Colors/Brands/BRAND/Interactions/primary-light-opacity-12 - Global (primitives) */
|
|
672
520
|
--interactions-primary-light-opacity-12: #2786271f;
|
|
673
|
-
/* Colors/Brands/
|
|
521
|
+
/* Colors/Brands/BRAND/Interactions/primary-light-opacity-16 - Global (primitives) */
|
|
674
522
|
--interactions-primary-light-opacity-16: #27862729;
|
|
675
|
-
/* Colors/Brands/
|
|
523
|
+
/* Colors/Brands/BRAND/Interactions/primary-light-opacity-20 - Global (primitives) */
|
|
676
524
|
--interactions-primary-light-opacity-20: #27862733;
|
|
677
|
-
/* Colors/Brands/
|
|
525
|
+
/* Colors/Brands/BRAND/Interactions/primary-light-opacity-8 - Global (primitives) */
|
|
678
526
|
--interactions-primary-light-opacity-8: #27862714;
|
|
679
527
|
/* Labels/Base */
|
|
680
|
-
--labels-base: 500 16px/
|
|
681
|
-
/* Labels/Base -
|
|
682
|
-
--labels-base-line-height:
|
|
683
|
-
/* Labels/Base -
|
|
528
|
+
--labels-base: 500 16px/24px var(--typeface);
|
|
529
|
+
/* Labels/Base - line height */
|
|
530
|
+
--labels-base-line-height: 24px;
|
|
531
|
+
/* Labels/Base - size */
|
|
684
532
|
--labels-base-size: 16px;
|
|
685
|
-
/* Labels/Base -
|
|
533
|
+
/* Labels/Base - style */
|
|
686
534
|
--labels-base-style: medium;
|
|
687
535
|
/* Labels/Large */
|
|
688
|
-
--labels-large: 500 18px/
|
|
689
|
-
/* Labels/Large -
|
|
690
|
-
--labels-large-line-height:
|
|
691
|
-
/* Labels/Large -
|
|
536
|
+
--labels-large: 500 18px/28px var(--typeface);
|
|
537
|
+
/* Labels/Large - line height */
|
|
538
|
+
--labels-large-line-height: 28px;
|
|
539
|
+
/* Labels/Large - size */
|
|
692
540
|
--labels-large-size: 18px;
|
|
693
|
-
/* Labels/Large -
|
|
541
|
+
/* Labels/Large - style */
|
|
694
542
|
--labels-large-style: medium;
|
|
695
543
|
/* Labels/Small */
|
|
696
544
|
--labels-small: 500 14px/20px var(--typeface);
|
|
697
|
-
/* Labels/Small -
|
|
545
|
+
/* Labels/Small - line height */
|
|
698
546
|
--labels-small-line-height: 20px;
|
|
699
|
-
/* Labels/Small -
|
|
547
|
+
/* Labels/Small - size */
|
|
700
548
|
--labels-small-size: 14px;
|
|
701
|
-
/* Labels/Small -
|
|
549
|
+
/* Labels/Small - style */
|
|
702
550
|
--labels-small-style: medium;
|
|
703
551
|
/* Labels/X-Small */
|
|
704
552
|
--labels-x-small: 500 12px/16px var(--typeface);
|
|
705
|
-
/* Labels/X-Small -
|
|
553
|
+
/* Labels/X-Small - line height */
|
|
706
554
|
--labels-x-small-line-height: 16px;
|
|
707
|
-
/* Labels/X-Small -
|
|
555
|
+
/* Labels/X-Small - size */
|
|
708
556
|
--labels-x-small-size: 12px;
|
|
709
|
-
/* Labels/X-Small -
|
|
557
|
+
/* Labels/X-Small - style */
|
|
710
558
|
--labels-x-small-style: medium;
|
|
711
|
-
/* Colors/Brands/
|
|
559
|
+
/* Colors/Brands/BRAND/Light Blue - Global (primitives) */
|
|
712
560
|
--light-blue: #a4c5d6;
|
|
713
|
-
/* Colors/Brands/
|
|
561
|
+
/* Colors/Brands/BRAND/Light Green - Global (primitives) */
|
|
714
562
|
--light-green: #a4cd55;
|
|
715
|
-
/* Colors/Brands/
|
|
563
|
+
/* Colors/Brands/BRAND/Primary/00-base - Global (primitives) */
|
|
716
564
|
--primary-00-base: #278627;
|
|
717
|
-
/* Colors/Brands/
|
|
565
|
+
/* Colors/Brands/BRAND/Primary/15-dark - Global (primitives) */
|
|
718
566
|
--primary-15-dark: #217221;
|
|
719
|
-
/* Colors/Brands/
|
|
567
|
+
/* Colors/Brands/BRAND/Primary/40-light - Global (primitives) */
|
|
720
568
|
--primary-40-light: #7db67c;
|
|
721
|
-
/* Colors/Brands/
|
|
569
|
+
/* Colors/Brands/BRAND/Primary/55-light - Global (primitives) */
|
|
722
570
|
--primary-55-light: #88bc88;
|
|
723
|
-
/* Colors/Brands/
|
|
571
|
+
/* Colors/Brands/BRAND/Primary/75-dark - Global (primitives) */
|
|
724
572
|
--primary-75-dark: #0a220a;
|
|
725
|
-
/* Colors/Brands/
|
|
573
|
+
/* Colors/Brands/BRAND/Primary/85-light - Global (primitives) */
|
|
726
574
|
--primary-85-light: #dfeddf;
|
|
727
575
|
/* Radius/full - Borders */
|
|
728
576
|
--radius-full: 999px;
|
|
@@ -736,17 +584,17 @@ body {
|
|
|
736
584
|
--radius-sm: 4px;
|
|
737
585
|
/* Radius/xlg - Borders */
|
|
738
586
|
--radius-xlg: 16px;
|
|
739
|
-
/* Colors/Brands/
|
|
587
|
+
/* Colors/Brands/BRAND/Secondary/00-base - Global (primitives) */
|
|
740
588
|
--secondary-00-base: #dd6b47;
|
|
741
|
-
/* Colors/Brands/
|
|
589
|
+
/* Colors/Brands/BRAND/Secondary/15-dark - Global (primitives) */
|
|
742
590
|
--secondary-15-dark: #bc5b3c;
|
|
743
|
-
/* Colors/Brands/
|
|
591
|
+
/* Colors/Brands/BRAND/Secondary/40-light - Global (primitives) */
|
|
744
592
|
--secondary-40-light: #eba691;
|
|
745
|
-
/* Colors/Brands/
|
|
593
|
+
/* Colors/Brands/BRAND/Secondary/55-light - Global (primitives) */
|
|
746
594
|
--secondary-55-light: #f0bcac;
|
|
747
|
-
/* Colors/Brands/
|
|
595
|
+
/* Colors/Brands/BRAND/Secondary/75-dark - Global (primitives) */
|
|
748
596
|
--secondary-75-dark: #371b12;
|
|
749
|
-
/* Colors/Brands/
|
|
597
|
+
/* Colors/Brands/BRAND/Secondary/85-light - Global (primitives) */
|
|
750
598
|
--secondary-85-light: #fae9e3;
|
|
751
599
|
/* Shadows/Inner-Shadow-black-100 - Global (primitives) */
|
|
752
600
|
--shadows-inner-shadow-black-100: #000000;
|
|
@@ -880,20 +728,10 @@ body {
|
|
|
880
728
|
--spacings-960: 96px;
|
|
881
729
|
/* Spacings/None - Global (primitives) */
|
|
882
730
|
--spacings-none: 0;
|
|
883
|
-
/*
|
|
884
|
-
--
|
|
885
|
-
/*
|
|
886
|
-
--
|
|
887
|
-
/* Status/on-informational - Theme - Better Home & Garden */
|
|
888
|
-
--status-on-informational: #ffffff;
|
|
889
|
-
/* Status/on-warning - Theme - Better Home & Garden */
|
|
890
|
-
--status-on-warning: #141414;
|
|
891
|
-
/* Stroke/Neutral/focus-on-inverse - Theme - Better Home & Garden */
|
|
892
|
-
--stroke-neutral-focus-on-inverse: #ffffff;
|
|
893
|
-
/* Stroke/Neutral/Interaction/inverse-focus - Theme - 3.0 */
|
|
894
|
-
--stroke-neutral-interaction-inverse-focus: #ffffff;
|
|
895
|
-
/* Stroke/Neutral/Interactions/inverse-focus - Theme - Better Home & Garden */
|
|
896
|
-
--stroke-neutral-interactions-inverse-focus: #ffffff;
|
|
731
|
+
/* Stroke/AI-powered/blue - Theme - BRAND */
|
|
732
|
+
--stroke-ai-powered-blue: #000000;
|
|
733
|
+
/* Stroke/AI-powered/pink - Theme - BRAND */
|
|
734
|
+
--stroke-ai-powered-pink: #000000;
|
|
897
735
|
/* Stroke/none - Borders */
|
|
898
736
|
--stroke-none: 0;
|
|
899
737
|
/* Stroke/thick - Borders */
|
|
@@ -902,8 +740,10 @@ body {
|
|
|
902
740
|
--stroke-thicker: 4px;
|
|
903
741
|
/* Stroke/thin - Borders */
|
|
904
742
|
--stroke-thin: 1px;
|
|
905
|
-
/* Surface/
|
|
906
|
-
--surface-
|
|
743
|
+
/* Surface/AI-powered/blue - Theme - BRAND */
|
|
744
|
+
--surface-ai-powered-blue: #000000;
|
|
745
|
+
/* Surface/AI-powered/pink - Theme - BRAND */
|
|
746
|
+
--surface-ai-powered-pink: #000000;
|
|
907
747
|
/* Typeface - Brand */
|
|
908
748
|
--typeface: 'Work Sans', sans-serif;
|
|
909
749
|
/* Typography/Line-height/lh-1 - Global (primitives) */
|
|
@@ -969,29 +809,29 @@ body {
|
|
|
969
809
|
/* Typography/Size/xxxlg - Global (primitives) */
|
|
970
810
|
--typography-size-xxxlg: 40px;
|
|
971
811
|
/* Typography/Typeface/Arial - Global (primitives) */
|
|
972
|
-
--typography-typeface-arial: 'Arial'
|
|
812
|
+
--typography-typeface-arial: 'Arial';
|
|
973
813
|
/* Typography/Typeface/Geist - Global (primitives) */
|
|
974
|
-
--typography-typeface-geist: 'Geist'
|
|
814
|
+
--typography-typeface-geist: 'Geist';
|
|
975
815
|
/* Typography/Typeface/Helvetica - Global (primitives) */
|
|
976
|
-
--typography-typeface-helvetica: 'Helvetica'
|
|
816
|
+
--typography-typeface-helvetica: 'Helvetica';
|
|
977
817
|
/* Typography/Typeface/Inter - Global (primitives) */
|
|
978
|
-
--typography-typeface-inter: 'Inter'
|
|
818
|
+
--typography-typeface-inter: 'Inter';
|
|
979
819
|
/* Typography/Typeface/Lato - Global (primitives) */
|
|
980
|
-
--typography-typeface-lato: 'Lato'
|
|
820
|
+
--typography-typeface-lato: 'Lato';
|
|
981
821
|
/* Typography/Typeface/Manrope - Global (primitives) */
|
|
982
|
-
--typography-typeface-manrope: 'Manrope'
|
|
822
|
+
--typography-typeface-manrope: 'Manrope';
|
|
983
823
|
/* Typography/Typeface/Open Sans - Global (primitives) */
|
|
984
|
-
--typography-typeface-open-sans: 'Open Sans'
|
|
824
|
+
--typography-typeface-open-sans: 'Open Sans';
|
|
985
825
|
/* Typography/Typeface/Red Hat Text - Global (primitives) */
|
|
986
|
-
--typography-typeface-red-hat-text: 'Red Hat Text'
|
|
826
|
+
--typography-typeface-red-hat-text: 'Red Hat Text';
|
|
987
827
|
/* Typography/Typeface/Roboto - Global (primitives) */
|
|
988
|
-
--typography-typeface-roboto: 'Roboto'
|
|
828
|
+
--typography-typeface-roboto: 'Roboto';
|
|
989
829
|
/* Typography/Typeface/SF Pro - Global (primitives) */
|
|
990
|
-
--typography-typeface-sf-pro: 'SF Pro'
|
|
830
|
+
--typography-typeface-sf-pro: 'SF Pro';
|
|
991
831
|
/* Typography/Typeface/Typold - Global (primitives) */
|
|
992
|
-
--typography-typeface-typold: 'Typold'
|
|
832
|
+
--typography-typeface-typold: 'Typold';
|
|
993
833
|
/* Typography/Typeface/Work Sans - Global (primitives) */
|
|
994
|
-
--typography-typeface-work-sans: 'Work Sans'
|
|
834
|
+
--typography-typeface-work-sans: 'Work Sans';
|
|
995
835
|
/* Typography/Weight/300 - Global (primitives) */
|
|
996
836
|
--typography-weight-300: 300;
|
|
997
837
|
/* Typography/Weight/400 - Global (primitives) */
|
|
@@ -1000,56 +840,56 @@ body {
|
|
|
1000
840
|
--typography-weight-500: 500;
|
|
1001
841
|
/* Typography/Weight/600 - Global (primitives) */
|
|
1002
842
|
--typography-weight-600: 600;
|
|
1003
|
-
/* Colors/Brands/
|
|
843
|
+
/* Colors/Brands/BRAND/Yellow - Global (primitives) */
|
|
1004
844
|
--yellow: #fab840;
|
|
1005
845
|
/* Mobile/Display/Regular/Large */
|
|
1006
846
|
--display-regular-large: 400 56px/72px var(--typeface);
|
|
1007
|
-
/* Mobile/Display/Regular/Large -
|
|
847
|
+
/* Mobile/Display/Regular/Large - line height */
|
|
1008
848
|
--display-regular-large-line-height: 72px;
|
|
1009
|
-
/* Mobile/Display/Regular/Large -
|
|
849
|
+
/* Mobile/Display/Regular/Large - size */
|
|
1010
850
|
--display-regular-large-size: 56px;
|
|
1011
|
-
/* Mobile/Display/Regular/Large -
|
|
851
|
+
/* Mobile/Display/Regular/Large - style */
|
|
1012
852
|
--display-regular-large-style: regular;
|
|
1013
853
|
/* Mobile/Display/Regular/Medium */
|
|
1014
854
|
--display-regular-medium: 400 48px/60px var(--typeface);
|
|
1015
|
-
/* Mobile/Display/Regular/Medium -
|
|
855
|
+
/* Mobile/Display/Regular/Medium - line height */
|
|
1016
856
|
--display-regular-medium-line-height: 60px;
|
|
1017
|
-
/* Mobile/Display/Regular/Medium -
|
|
857
|
+
/* Mobile/Display/Regular/Medium - size */
|
|
1018
858
|
--display-regular-medium-size: 48px;
|
|
1019
|
-
/* Mobile/Display/Regular/Medium -
|
|
859
|
+
/* Mobile/Display/Regular/Medium - style */
|
|
1020
860
|
--display-regular-medium-style: regular;
|
|
1021
861
|
/* Mobile/Display/Regular/Small */
|
|
1022
862
|
--display-regular-small: 400 40px/48px var(--typeface);
|
|
1023
|
-
/* Mobile/Display/Regular/Small -
|
|
863
|
+
/* Mobile/Display/Regular/Small - line height */
|
|
1024
864
|
--display-regular-small-line-height: 48px;
|
|
1025
|
-
/* Mobile/Display/Regular/Small -
|
|
865
|
+
/* Mobile/Display/Regular/Small - size */
|
|
1026
866
|
--display-regular-small-size: 40px;
|
|
1027
|
-
/* Mobile/Display/Regular/Small -
|
|
867
|
+
/* Mobile/Display/Regular/Small - style */
|
|
1028
868
|
--display-regular-small-style: regular;
|
|
1029
869
|
/* Mobile/Display/Semibold/Large */
|
|
1030
870
|
--display-semibold-large: 600 56px/72px var(--typeface);
|
|
1031
|
-
/* Mobile/Display/Semibold/Large -
|
|
871
|
+
/* Mobile/Display/Semibold/Large - line height */
|
|
1032
872
|
--display-semibold-large-line-height: 72px;
|
|
1033
|
-
/* Mobile/Display/Semibold/Large -
|
|
873
|
+
/* Mobile/Display/Semibold/Large - size */
|
|
1034
874
|
--display-semibold-large-size: 56px;
|
|
1035
|
-
/* Mobile/Display/Semibold/Large -
|
|
1036
|
-
--display-semibold-large-style:
|
|
875
|
+
/* Mobile/Display/Semibold/Large - style */
|
|
876
|
+
--display-semibold-large-style: 600;
|
|
1037
877
|
/* Mobile/Display/Semibold/Medium */
|
|
1038
878
|
--display-semibold-medium: 600 48px/60px var(--typeface);
|
|
1039
|
-
/* Mobile/Display/Semibold/Medium -
|
|
879
|
+
/* Mobile/Display/Semibold/Medium - line height */
|
|
1040
880
|
--display-semibold-medium-line-height: 60px;
|
|
1041
|
-
/* Mobile/Display/Semibold/Medium -
|
|
881
|
+
/* Mobile/Display/Semibold/Medium - size */
|
|
1042
882
|
--display-semibold-medium-size: 48px;
|
|
1043
|
-
/* Mobile/Display/Semibold/Medium -
|
|
1044
|
-
--display-semibold-medium-style:
|
|
883
|
+
/* Mobile/Display/Semibold/Medium - style */
|
|
884
|
+
--display-semibold-medium-style: 600;
|
|
1045
885
|
/* Mobile/Display/Semibold/Small */
|
|
1046
886
|
--display-semibold-small: 600 40px/48px var(--typeface);
|
|
1047
|
-
/* Mobile/Display/Semibold/Small -
|
|
887
|
+
/* Mobile/Display/Semibold/Small - line height */
|
|
1048
888
|
--display-semibold-small-line-height: 48px;
|
|
1049
|
-
/* Mobile/Display/Semibold/Small -
|
|
889
|
+
/* Mobile/Display/Semibold/Small - size */
|
|
1050
890
|
--display-semibold-small-size: 40px;
|
|
1051
|
-
/* Mobile/Display/Semibold/Small -
|
|
1052
|
-
--display-semibold-small-style:
|
|
891
|
+
/* Mobile/Display/Semibold/Small - style */
|
|
892
|
+
--display-semibold-small-style: 600;
|
|
1053
893
|
/* Mobile/Heading/H1 - Large Headline */
|
|
1054
894
|
--heading-h1: 600 32px/40px var(--typeface);
|
|
1055
895
|
/* Mobile/Heading/H1 - Large Headline line height */
|
|
@@ -1057,7 +897,7 @@ body {
|
|
|
1057
897
|
/* Mobile/Heading/H1 - Large Headline size */
|
|
1058
898
|
--heading-h1-size: 32px;
|
|
1059
899
|
/* Mobile/Heading/H1 - Large Headline style */
|
|
1060
|
-
--heading-h1-style:
|
|
900
|
+
--heading-h1-style: 600;
|
|
1061
901
|
/* Mobile/Heading/H2 - Headline */
|
|
1062
902
|
--heading-h2: 600 28px/36px var(--typeface);
|
|
1063
903
|
/* Mobile/Heading/H2 - Headline line height */
|
|
@@ -1065,7 +905,7 @@ body {
|
|
|
1065
905
|
/* Mobile/Heading/H2 - Headline size */
|
|
1066
906
|
--heading-h2-size: 28px;
|
|
1067
907
|
/* Mobile/Heading/H2 - Headline style */
|
|
1068
|
-
--heading-h2-style:
|
|
908
|
+
--heading-h2-style: 600;
|
|
1069
909
|
/* Mobile/Heading/H3 - Headline */
|
|
1070
910
|
--heading-h3: 600 24px/32px var(--typeface);
|
|
1071
911
|
/* Mobile/Heading/H3 - Headline line height */
|
|
@@ -1073,7 +913,7 @@ body {
|
|
|
1073
913
|
/* Mobile/Heading/H3 - Headline size */
|
|
1074
914
|
--heading-h3-size: 24px;
|
|
1075
915
|
/* Mobile/Heading/H3 - Headline style */
|
|
1076
|
-
--heading-h3-style:
|
|
916
|
+
--heading-h3-style: 600;
|
|
1077
917
|
/* Mobile/Heading/H4 - Headline */
|
|
1078
918
|
--heading-h4: 600 20px/28px var(--typeface);
|
|
1079
919
|
/* Mobile/Heading/H4 - Headline line height */
|
|
@@ -1081,22 +921,22 @@ body {
|
|
|
1081
921
|
/* Mobile/Heading/H4 - Headline size */
|
|
1082
922
|
--heading-h4-size: 20px;
|
|
1083
923
|
/* Mobile/Heading/H4 - Headline style */
|
|
1084
|
-
--heading-h4-style:
|
|
924
|
+
--heading-h4-style: 600;
|
|
1085
925
|
/* Mobile/Heading/H5 */
|
|
1086
926
|
--heading-h5: 600 18px/24px var(--typeface);
|
|
1087
|
-
/* Mobile/Heading/H5 -
|
|
927
|
+
/* Mobile/Heading/H5 - line height */
|
|
1088
928
|
--heading-h5-line-height: 24px;
|
|
1089
|
-
/* Mobile/Heading/H5 -
|
|
929
|
+
/* Mobile/Heading/H5 - size */
|
|
1090
930
|
--heading-h5-size: 18px;
|
|
1091
|
-
/* Mobile/Heading/H5 -
|
|
1092
|
-
--heading-h5-style:
|
|
931
|
+
/* Mobile/Heading/H5 - style */
|
|
932
|
+
--heading-h5-style: 600;
|
|
1093
933
|
/* Mobile/Heading/H6 */
|
|
1094
934
|
--heading-h6: 500 16px/20px var(--typeface);
|
|
1095
|
-
/* Mobile/Heading/H6 -
|
|
935
|
+
/* Mobile/Heading/H6 - line height */
|
|
1096
936
|
--heading-h6-line-height: 20px;
|
|
1097
|
-
/* Mobile/Heading/H6 -
|
|
937
|
+
/* Mobile/Heading/H6 - size */
|
|
1098
938
|
--heading-h6-size: 16px;
|
|
1099
|
-
/* Mobile/Heading/H6 -
|
|
939
|
+
/* Mobile/Heading/H6 - style */
|
|
1100
940
|
--heading-h6-style: medium;
|
|
1101
941
|
/* Mobile/Subheader/Large - Headline */
|
|
1102
942
|
--subheader-large: 400 20px/28px var(--typeface);
|
|
@@ -1138,6 +978,268 @@ body {
|
|
|
1138
978
|
--subheader-xxx-large-size: 32px;
|
|
1139
979
|
/* Mobile/Subheader/XXX-Large - Large Headline style */
|
|
1140
980
|
--subheader-xxx-large-style: regular;
|
|
981
|
+
/* light theme (default) */
|
|
982
|
+
/* Background/base - Theme - BRAND */
|
|
983
|
+
--background-base: #ffffff;
|
|
984
|
+
/* Background/scrim - Theme - BRAND */
|
|
985
|
+
--background-scrim: #00000040;
|
|
986
|
+
/* Background/shade - Theme - BRAND */
|
|
987
|
+
--background-shade: #f5f5f5;
|
|
988
|
+
/* Data visual/category-01 - Brand */
|
|
989
|
+
--data-visual-category-01: #389e7a;
|
|
990
|
+
/* Data visual/category-01-highlight - Brand */
|
|
991
|
+
--data-visual-category-01-highlight: #389e7a4d;
|
|
992
|
+
/* Data visual/category-02 - Brand */
|
|
993
|
+
--data-visual-category-02: #0a466c;
|
|
994
|
+
/* Data visual/category-02-highlight - Brand */
|
|
995
|
+
--data-visual-category-02-highlight: #0a466c4d;
|
|
996
|
+
/* Data visual/category-03 - Brand */
|
|
997
|
+
--data-visual-category-03: #299de0;
|
|
998
|
+
/* Data visual/category-03-highlight - Brand */
|
|
999
|
+
--data-visual-category-03-highlight: #299de04d;
|
|
1000
|
+
/* Data visual/category-04 - Brand */
|
|
1001
|
+
--data-visual-category-04: #130033;
|
|
1002
|
+
/* Data visual/category-04-highlight - Brand */
|
|
1003
|
+
--data-visual-category-04-highlight: #1300334d;
|
|
1004
|
+
/* Data visual/category-05 - Brand */
|
|
1005
|
+
--data-visual-category-05: #094a53;
|
|
1006
|
+
/* Data visual/category-05-highlight - Brand */
|
|
1007
|
+
--data-visual-category-05-highlight: #094a534d;
|
|
1008
|
+
/* Data visual/category-06 - Brand */
|
|
1009
|
+
--data-visual-category-06: #7f7f7f;
|
|
1010
|
+
/* Data visual/category-06-highlight - Brand */
|
|
1011
|
+
--data-visual-category-06-highlight: #7f7f7f4d;
|
|
1012
|
+
/* Data visual/category-07 - Brand */
|
|
1013
|
+
--data-visual-category-07: #433479;
|
|
1014
|
+
/* Data visual/category-07-highlight - Brand */
|
|
1015
|
+
--data-visual-category-07-highlight: #4334794d;
|
|
1016
|
+
/* Data visual/gradient-end - Theme - BRAND */
|
|
1017
|
+
--data-visual-gradient-end: #ffffff4d;
|
|
1018
|
+
/* Data visual/negative - Brand */
|
|
1019
|
+
--data-visual-negative: #d83a52;
|
|
1020
|
+
/* Data visual/negative-highlight - Brand */
|
|
1021
|
+
--data-visual-negative-highlight: #f9e1e5;
|
|
1022
|
+
/* Data visual/positive - Brand */
|
|
1023
|
+
--data-visual-positive: #258750;
|
|
1024
|
+
/* Data visual/positive-highlight - Brand */
|
|
1025
|
+
--data-visual-positive-highlight: #deede5;
|
|
1026
|
+
/* Foreground/Brand/on-inverse-primary - Theme - BRAND */
|
|
1027
|
+
--foreground-brand-on-inverse-primary: #7db67c;
|
|
1028
|
+
/* Foreground/Brand/on-inverse-secondary - Theme - BRAND */
|
|
1029
|
+
--foreground-brand-on-inverse-secondary: #eba691;
|
|
1030
|
+
/* Foreground/Brand/on-brand-primary - Theme - BRAND */
|
|
1031
|
+
/* Foreground color used on Brand's primary color (non neutral color) */
|
|
1032
|
+
--foreground-brand-on-primary: #ffffff;
|
|
1033
|
+
/* Foreground/Brand/on-brand-secondary - Theme - BRAND */
|
|
1034
|
+
/* Foreground color used on Brand's primary color (non neutral color) */
|
|
1035
|
+
--foreground-brand-on-secondary: #ffffff;
|
|
1036
|
+
/* Foreground/Brand/brand-primary - Theme - BRAND */
|
|
1037
|
+
/* Foreground text and icons that match the brand's primary color */
|
|
1038
|
+
--foreground-brand-primary: #278627;
|
|
1039
|
+
/* Foreground/Brand/brand-primary-depth - Theme - BRAND */
|
|
1040
|
+
--foreground-brand-primary-depth: #217221;
|
|
1041
|
+
/* Foreground/Brand/brand-secondary - Theme - BRAND */
|
|
1042
|
+
/* Foreground text and icons that match the brand's secondary color */
|
|
1043
|
+
--foreground-brand-secondary: #dd6b47;
|
|
1044
|
+
/* Foreground/Brand/brand-secondary-depth - Theme - BRAND */
|
|
1045
|
+
--foreground-brand-secondary-depth: #bc5b3c;
|
|
1046
|
+
/* Foreground/Link text/default - Theme - BRAND */
|
|
1047
|
+
--foreground-link-text-default: #215ecd;
|
|
1048
|
+
/* Foreground/Link text/default-disabled - Theme - BRAND */
|
|
1049
|
+
--foreground-link-text-default-disabled: #7a9ee1;
|
|
1050
|
+
/* Foreground/Link text/default-hovered - Theme - BRAND */
|
|
1051
|
+
--foreground-link-text-default-hovered: #1e55b9;
|
|
1052
|
+
/* Foreground/Link text/default-pressed - Theme - BRAND */
|
|
1053
|
+
--foreground-link-text-default-pressed: #1a4ba4;
|
|
1054
|
+
/* Foreground/Link text/default-visited - Theme - BRAND */
|
|
1055
|
+
--foreground-link-text-default-visited: #7a3e7a;
|
|
1056
|
+
/* Foreground/Link text/subtle-disabled - Brand */
|
|
1057
|
+
--foreground-link-text-subtle-disabled: #bdbdbd;
|
|
1058
|
+
/* Foreground/Link text/subtle-hovered - Theme - BRAND */
|
|
1059
|
+
--foreground-link-text-subtle-hovered: #292929;
|
|
1060
|
+
/* Foreground/Link text/subtle-inverse-hovered - Theme - BRAND */
|
|
1061
|
+
--foreground-link-text-subtle-inverse-hovered: #e6e6e6;
|
|
1062
|
+
/* Foreground/Link text/subtle-inverse-pressed - Theme - BRAND */
|
|
1063
|
+
--foreground-link-text-subtle-inverse-pressed: #d1d1d1;
|
|
1064
|
+
/* Foreground/Link text/subtle-inversed-disabled - Brand */
|
|
1065
|
+
--foreground-link-text-subtle-inversed-disabled: #757575;
|
|
1066
|
+
/* Foreground/Link text/subtle-pressed - Theme - BRAND */
|
|
1067
|
+
--foreground-link-text-subtle-pressed: #3d3d3d;
|
|
1068
|
+
/* Foreground/Neutral/disabled-on-color-surface - Theme - BRAND */
|
|
1069
|
+
--foreground-neutral-disabled-on-color-surface: #757575;
|
|
1070
|
+
/* Foreground/Neutral/disabled-on-surface - Theme - BRAND */
|
|
1071
|
+
--foreground-neutral-disabled-on-surface: #bdbdbd;
|
|
1072
|
+
/* Foreground/Neutral/on-color - Theme - BRAND */
|
|
1073
|
+
/* Interactive controls */
|
|
1074
|
+
--foreground-neutral-on-color: #ffffff;
|
|
1075
|
+
/* Foreground/Neutral/on-inverse-surface - Brand */
|
|
1076
|
+
/* Text and icons against inverse surface */
|
|
1077
|
+
--foreground-neutral-on-inverse-surface: #fafafa;
|
|
1078
|
+
/* Foreground/Neutral/on-surface - Theme - BRAND */
|
|
1079
|
+
/* Default foreground text and icons against any surface color */
|
|
1080
|
+
--foreground-neutral-on-surface: #141414;
|
|
1081
|
+
/* Foreground/Neutral/on-surface-variant-01 - Theme - BRAND */
|
|
1082
|
+
/* Secondary foreground color for icons and text */
|
|
1083
|
+
--foreground-neutral-on-surface-variant-01: #707070;
|
|
1084
|
+
/* Foreground/Neutral/on-surface-variant-02 - Theme - BRAND */
|
|
1085
|
+
/* Tertiary foreground color for icons and text */
|
|
1086
|
+
--foreground-neutral-on-surface-variant-02: #757575;
|
|
1087
|
+
/* Foreground/Neutral/on-surface-variant-03 - Theme - BRAND */
|
|
1088
|
+
/* Quaternary foreground color for icons and text. Only for placeholder text */
|
|
1089
|
+
--foreground-neutral-on-surface-variant-03: #8a8a8a;
|
|
1090
|
+
/* Foreground/Neutral/skeleton-element - Theme - BRAND */
|
|
1091
|
+
--foreground-neutral-skeleton-element: #e0e0e0;
|
|
1092
|
+
/* Foreground/Spectrum/blue - Theme - BRAND */
|
|
1093
|
+
--foreground-spectrum-blue: #143778;
|
|
1094
|
+
/* Foreground/Spectrum/green - Theme - BRAND */
|
|
1095
|
+
--foreground-spectrum-green: #134428;
|
|
1096
|
+
/* Foreground/Spectrum/lime - Theme - BRAND */
|
|
1097
|
+
--foreground-spectrum-lime: #60651a;
|
|
1098
|
+
/* Foreground/Spectrum/magenta - Theme - BRAND */
|
|
1099
|
+
--foreground-spectrum-magenta: #63076f;
|
|
1100
|
+
/* Foreground/Spectrum/orange - Theme - BRAND */
|
|
1101
|
+
--foreground-spectrum-orange: #773001;
|
|
1102
|
+
/* Foreground/Spectrum/pink - Theme - BRAND */
|
|
1103
|
+
--foreground-spectrum-pink: #6c1240;
|
|
1104
|
+
/* Foreground/Spectrum/purple - Theme - BRAND */
|
|
1105
|
+
--foreground-spectrum-purple: #310077;
|
|
1106
|
+
/* Foreground/Spectrum/red - Theme - BRAND */
|
|
1107
|
+
--foreground-spectrum-red: #6c1d29;
|
|
1108
|
+
/* Foreground/Spectrum/teal - Theme - BRAND */
|
|
1109
|
+
--foreground-spectrum-teal: #01413c;
|
|
1110
|
+
/* Foreground/Spectrum/yellow - Theme - BRAND */
|
|
1111
|
+
--foreground-spectrum-yellow: #7b5e18;
|
|
1112
|
+
/* Interactions/brand-hover-opacity - Theme - BRAND */
|
|
1113
|
+
--interactions-brand-hover-opacity: #0000001a;
|
|
1114
|
+
/* Interactions/brand-press-opacity - Theme - BRAND */
|
|
1115
|
+
--interactions-brand-press-opacity: #00000033;
|
|
1116
|
+
/* Interactions/disabled-opacity - Theme - BRAND */
|
|
1117
|
+
--interactions-disabled-opacity: #0000000f;
|
|
1118
|
+
/* Interactions/link-active-opacity - Theme - BRAND */
|
|
1119
|
+
--interactions-link-active-opacity: #0000004d;
|
|
1120
|
+
/* Interactions/neutral-hover-opacity - Brand */
|
|
1121
|
+
/* surfaces using neutral tones */
|
|
1122
|
+
--interactions-neutral-hover-opacity: #00000014;
|
|
1123
|
+
/* Interactions/neutral-press-opacity - Brand */
|
|
1124
|
+
/* surfaces using neutral tones */
|
|
1125
|
+
--interactions-neutral-press-opacity: #00000029;
|
|
1126
|
+
/* Interactions/primary-disabled-opacity - Theme - BRAND */
|
|
1127
|
+
--interactions-primary-disabled-opacity: #2786271f;
|
|
1128
|
+
/* Interactions/primary-hover-opacity - Theme - BRAND */
|
|
1129
|
+
--interactions-primary-hover-opacity: #2786271a;
|
|
1130
|
+
/* Interactions/primary-press-opacity - Theme - BRAND */
|
|
1131
|
+
--interactions-primary-press-opacity: #27862733;
|
|
1132
|
+
/* Shadow/inner-shadow - Brand */
|
|
1133
|
+
--shadow-inner: #ffffff;
|
|
1134
|
+
/* Shadow/variant-01 - Brand */
|
|
1135
|
+
--shadow-variant-01: #0000001a;
|
|
1136
|
+
/* Shadow/variant-02 - Brand */
|
|
1137
|
+
--shadow-variant-02: #0000001f;
|
|
1138
|
+
/* Shadow/variant-03 - Brand */
|
|
1139
|
+
--shadow-variant-03: #00000026;
|
|
1140
|
+
/* Shadow/variant-04 - Brand */
|
|
1141
|
+
--shadow-variant-04: #00000040;
|
|
1142
|
+
/* Shadow/variant-05 - Brand */
|
|
1143
|
+
--shadow-variant-05: #00000052;
|
|
1144
|
+
/* Status/error - Theme - BRAND */
|
|
1145
|
+
/* Foreground error text and icons */
|
|
1146
|
+
--status-error: #d83a52;
|
|
1147
|
+
/* Status/informational - Brand */
|
|
1148
|
+
/* Foreground informational text and icons */
|
|
1149
|
+
--status-informational: #276ef1;
|
|
1150
|
+
/* Status/on-error - Theme - BRAND */
|
|
1151
|
+
/* Foreground error text and icons */
|
|
1152
|
+
--status-on-error: #ffffff;
|
|
1153
|
+
/* Status/on-informational - Brand */
|
|
1154
|
+
/* Foreground informational text and icons */
|
|
1155
|
+
--status-on-informational: #ffffff;
|
|
1156
|
+
/* Status/on-success - Theme - BRAND */
|
|
1157
|
+
/* Foreground success icons and text */
|
|
1158
|
+
--status-on-success: #ffffff;
|
|
1159
|
+
/* Status/on-warning - Theme - BRAND */
|
|
1160
|
+
/* Foreground warning icons */
|
|
1161
|
+
--status-on-warning: #141414;
|
|
1162
|
+
/* Status/success - Theme - BRAND */
|
|
1163
|
+
/* Foreground success icons and text */
|
|
1164
|
+
--status-success: #258750;
|
|
1165
|
+
/* Status/warning - Theme - BRAND */
|
|
1166
|
+
/* Foreground warning icons */
|
|
1167
|
+
--status-warning: #f6bc2f;
|
|
1168
|
+
/* Stroke/Brand/brand-primary - Theme - BRAND */
|
|
1169
|
+
/* Outline variant - decorative elements such as dividers */
|
|
1170
|
+
--stroke-brand-primary: #278627;
|
|
1171
|
+
/* Stroke/Brand/brand-primary-depth - Theme - BRAND */
|
|
1172
|
+
/* Outline variant - decorative elements such as dividers */
|
|
1173
|
+
--stroke-brand-primary-depth: #217221;
|
|
1174
|
+
/* Stroke/Brand/brand-secondary - Theme - BRAND */
|
|
1175
|
+
--stroke-brand-secondary: #dd6b47;
|
|
1176
|
+
/* Stroke/Brand/brand-secondary-depth - Theme - BRAND */
|
|
1177
|
+
--stroke-brand-secondary-depth: #bc5b3c;
|
|
1178
|
+
/* Stroke/Neutral/neutral-base - Theme - BRAND */
|
|
1179
|
+
/* For control components */
|
|
1180
|
+
--stroke-neutral-base: #949494;
|
|
1181
|
+
/* Stroke/Neutral/disabled-dark - Brand */
|
|
1182
|
+
/* Disabled outline separating the fill and surface background */
|
|
1183
|
+
--stroke-neutral-disabled-dark: #757575;
|
|
1184
|
+
/* Stroke/Neutral/disabled-light - Brand */
|
|
1185
|
+
/* Disabled outline separating the fill and surface background */
|
|
1186
|
+
--stroke-neutral-disabled-light: #bdbdbd;
|
|
1187
|
+
/* Stroke/Neutral/focus - Brand */
|
|
1188
|
+
/* Highlight focus element */
|
|
1189
|
+
--stroke-neutral-focus: #000000;
|
|
1190
|
+
/* Stroke/Neutral/focus-on-inverse - Brand */
|
|
1191
|
+
/* Highlight focus element */
|
|
1192
|
+
--stroke-neutral-focus-on-inverse: #ffffff;
|
|
1193
|
+
/* Stroke/Neutral/neutral-high - Brand */
|
|
1194
|
+
--stroke-neutral-high: #141414;
|
|
1195
|
+
/* Stroke/Neutral/neutral-low - Brand */
|
|
1196
|
+
/* Outline variant - decorative elements such as dividers */
|
|
1197
|
+
--stroke-neutral-low: #e0e0e0;
|
|
1198
|
+
/* Surface/Brand/primary - Theme - BRAND */
|
|
1199
|
+
--surface-brand-primary: #278627;
|
|
1200
|
+
/* Surface/Brand/primary-highlight - Theme - BRAND */
|
|
1201
|
+
--surface-brand-primary-highlight: #dfeddf;
|
|
1202
|
+
/* Surface/Brand/secondary - Theme - BRAND */
|
|
1203
|
+
--surface-brand-secondary: #dd6b47;
|
|
1204
|
+
/* Surface/Brand/secondary-highlight - Theme - BRAND */
|
|
1205
|
+
--surface-brand-secondary-highlight: #fae9e3;
|
|
1206
|
+
/* Surface/Neutral/inverse - Brand */
|
|
1207
|
+
/* Inverted. Use for toasts notification & snackbars */
|
|
1208
|
+
--surface-neutral-inverse: #1f1f1f;
|
|
1209
|
+
/* Surface/Neutral/inverse-light - Theme - BRAND */
|
|
1210
|
+
--surface-neutral-inverse-light: #ffffff;
|
|
1211
|
+
/* Surface/Neutral/T1-base - Theme - BRAND */
|
|
1212
|
+
--surface-neutral-t1-base: #ffffff;
|
|
1213
|
+
/* Surface/Neutral/T2-lowest - Theme - BRAND */
|
|
1214
|
+
--surface-neutral-t2-lowest: #f5f5f5;
|
|
1215
|
+
/* Surface/Neutral/T3-low - Theme - BRAND */
|
|
1216
|
+
/* Navigations, app bar etc */
|
|
1217
|
+
--surface-neutral-t3-low: #dbdbdb;
|
|
1218
|
+
/* Surface/Neutral/T4-high - Theme - BRAND */
|
|
1219
|
+
/* Navigations, app bar etc */
|
|
1220
|
+
--surface-neutral-t4-high: #8a8a8a;
|
|
1221
|
+
/* Surface/Neutral/transparent - Theme - BRAND */
|
|
1222
|
+
--surface-neutral-transparent: #ffffff00;
|
|
1223
|
+
/* Surface/Spectrum/blue - Theme - BRAND */
|
|
1224
|
+
--surface-spectrum-blue: #dfe9fd;
|
|
1225
|
+
/* Surface/Spectrum/green - Theme - BRAND */
|
|
1226
|
+
--surface-spectrum-green: #deede5;
|
|
1227
|
+
/* Surface/Spectrum/lime - Theme - BRAND */
|
|
1228
|
+
--surface-spectrum-lime: #f6f7e0;
|
|
1229
|
+
/* Surface/Spectrum/magenta - Theme - BRAND */
|
|
1230
|
+
--surface-spectrum-magenta: #f6dbfa;
|
|
1231
|
+
/* Surface/Spectrum/orange - Theme - BRAND */
|
|
1232
|
+
--surface-spectrum-orange: #fce7d9;
|
|
1233
|
+
/* Surface/Spectrum/pink - Theme - BRAND */
|
|
1234
|
+
--surface-spectrum-pink: #f9deec;
|
|
1235
|
+
/* Surface/Spectrum/purple - Theme - BRAND */
|
|
1236
|
+
--surface-spectrum-purple: #e7d9fc;
|
|
1237
|
+
/* Surface/Spectrum/red - Theme - BRAND */
|
|
1238
|
+
--surface-spectrum-red: #f9e1e5;
|
|
1239
|
+
/* Surface/Spectrum/teal - Theme - BRAND */
|
|
1240
|
+
--surface-spectrum-teal: #d9eceb;
|
|
1241
|
+
/* Surface/Spectrum/yellow - Theme - BRAND */
|
|
1242
|
+
--surface-spectrum-yellow: #fef5e0;
|
|
1141
1243
|
|
|
1142
1244
|
@media (width >= 640px) {
|
|
1143
1245
|
/* Desktop/Display/Regular/Large - Used in landing hero or marketing sections. */
|
|
@@ -1171,7 +1273,7 @@ body {
|
|
|
1171
1273
|
/* Desktop/Display/SemiBold/Large - Used in landing hero or marketing sections. size */
|
|
1172
1274
|
--display-semibold-large-size: 64px;
|
|
1173
1275
|
/* Desktop/Display/SemiBold/Large - Used in landing hero or marketing sections. style */
|
|
1174
|
-
--display-semibold-large-style:
|
|
1276
|
+
--display-semibold-large-style: 600;
|
|
1175
1277
|
/* Desktop/Display/SemiBold/Medium - Used in landing hero or marketing sections. */
|
|
1176
1278
|
--display-semibold-medium: 600 56px/72px var(--typeface);
|
|
1177
1279
|
/* Desktop/Display/SemiBold/Medium - Used in landing hero or marketing sections. line height */
|
|
@@ -1179,7 +1281,7 @@ body {
|
|
|
1179
1281
|
/* Desktop/Display/SemiBold/Medium - Used in landing hero or marketing sections. size */
|
|
1180
1282
|
--display-semibold-medium-size: 56px;
|
|
1181
1283
|
/* Desktop/Display/SemiBold/Medium - Used in landing hero or marketing sections. style */
|
|
1182
|
-
--display-semibold-medium-style:
|
|
1284
|
+
--display-semibold-medium-style: 600;
|
|
1183
1285
|
/* Desktop/Display/SemiBold/Small - Used in landing hero or marketing sections. */
|
|
1184
1286
|
--display-semibold-small: 600 48px/60px var(--typeface);
|
|
1185
1287
|
/* Desktop/Display/SemiBold/Small - Used in landing hero or marketing sections. line height */
|
|
@@ -1187,54 +1289,54 @@ body {
|
|
|
1187
1289
|
/* Desktop/Display/SemiBold/Small - Used in landing hero or marketing sections. size */
|
|
1188
1290
|
--display-semibold-small-size: 48px;
|
|
1189
1291
|
/* Desktop/Display/SemiBold/Small - Used in landing hero or marketing sections. style */
|
|
1190
|
-
--display-semibold-small-style:
|
|
1292
|
+
--display-semibold-small-style: 600;
|
|
1191
1293
|
/* Desktop/Heading/H1 */
|
|
1192
1294
|
--heading-h1: 600 40px/48px var(--typeface);
|
|
1193
|
-
/* Desktop/Heading/H1 -
|
|
1295
|
+
/* Desktop/Heading/H1 - line height */
|
|
1194
1296
|
--heading-h1-line-height: 48px;
|
|
1195
|
-
/* Desktop/Heading/H1 -
|
|
1297
|
+
/* Desktop/Heading/H1 - size */
|
|
1196
1298
|
--heading-h1-size: 40px;
|
|
1197
|
-
/* Desktop/Heading/H1 -
|
|
1198
|
-
--heading-h1-style:
|
|
1299
|
+
/* Desktop/Heading/H1 - style */
|
|
1300
|
+
--heading-h1-style: 600;
|
|
1199
1301
|
/* Desktop/Heading/H2 */
|
|
1200
1302
|
--heading-h2: 600 32px/40px var(--typeface);
|
|
1201
|
-
/* Desktop/Heading/H2 -
|
|
1303
|
+
/* Desktop/Heading/H2 - line height */
|
|
1202
1304
|
--heading-h2-line-height: 40px;
|
|
1203
|
-
/* Desktop/Heading/H2 -
|
|
1305
|
+
/* Desktop/Heading/H2 - size */
|
|
1204
1306
|
--heading-h2-size: 32px;
|
|
1205
|
-
/* Desktop/Heading/H2 -
|
|
1206
|
-
--heading-h2-style:
|
|
1307
|
+
/* Desktop/Heading/H2 - style */
|
|
1308
|
+
--heading-h2-style: 600;
|
|
1207
1309
|
/* Desktop/Heading/H3 */
|
|
1208
1310
|
--heading-h3: 600 28px/36px var(--typeface);
|
|
1209
|
-
/* Desktop/Heading/H3 -
|
|
1311
|
+
/* Desktop/Heading/H3 - line height */
|
|
1210
1312
|
--heading-h3-line-height: 36px;
|
|
1211
|
-
/* Desktop/Heading/H3 -
|
|
1313
|
+
/* Desktop/Heading/H3 - size */
|
|
1212
1314
|
--heading-h3-size: 28px;
|
|
1213
|
-
/* Desktop/Heading/H3 -
|
|
1214
|
-
--heading-h3-style:
|
|
1315
|
+
/* Desktop/Heading/H3 - style */
|
|
1316
|
+
--heading-h3-style: 600;
|
|
1215
1317
|
/* Desktop/Heading/H4 */
|
|
1216
1318
|
--heading-h4: 600 24px/32px var(--typeface);
|
|
1217
|
-
/* Desktop/Heading/H4 -
|
|
1319
|
+
/* Desktop/Heading/H4 - line height */
|
|
1218
1320
|
--heading-h4-line-height: 32px;
|
|
1219
|
-
/* Desktop/Heading/H4 -
|
|
1321
|
+
/* Desktop/Heading/H4 - size */
|
|
1220
1322
|
--heading-h4-size: 24px;
|
|
1221
|
-
/* Desktop/Heading/H4 -
|
|
1222
|
-
--heading-h4-style:
|
|
1323
|
+
/* Desktop/Heading/H4 - style */
|
|
1324
|
+
--heading-h4-style: 600;
|
|
1223
1325
|
/* Desktop/Heading/H5 */
|
|
1224
1326
|
--heading-h5: 600 20px/28px var(--typeface);
|
|
1225
|
-
/* Desktop/Heading/H5 -
|
|
1327
|
+
/* Desktop/Heading/H5 - line height */
|
|
1226
1328
|
--heading-h5-line-height: 28px;
|
|
1227
|
-
/* Desktop/Heading/H5 -
|
|
1329
|
+
/* Desktop/Heading/H5 - size */
|
|
1228
1330
|
--heading-h5-size: 20px;
|
|
1229
|
-
/* Desktop/Heading/H5 -
|
|
1230
|
-
--heading-h5-style:
|
|
1331
|
+
/* Desktop/Heading/H5 - style */
|
|
1332
|
+
--heading-h5-style: 600;
|
|
1231
1333
|
/* Desktop/Heading/H6 */
|
|
1232
1334
|
--heading-h6: 500 18px/24px var(--typeface);
|
|
1233
|
-
/* Desktop/Heading/H6 -
|
|
1335
|
+
/* Desktop/Heading/H6 - line height */
|
|
1234
1336
|
--heading-h6-line-height: 24px;
|
|
1235
|
-
/* Desktop/Heading/H6 -
|
|
1337
|
+
/* Desktop/Heading/H6 - size */
|
|
1236
1338
|
--heading-h6-size: 18px;
|
|
1237
|
-
/* Desktop/Heading/H6 -
|
|
1339
|
+
/* Desktop/Heading/H6 - style */
|
|
1238
1340
|
--heading-h6-style: medium;
|
|
1239
1341
|
/* Desktop/Subheader/Large - Headline */
|
|
1240
1342
|
--subheader-large: 400 24px/32px var(--typeface);
|
|
@@ -1246,11 +1348,11 @@ body {
|
|
|
1246
1348
|
--subheader-large-style: regular;
|
|
1247
1349
|
/* Desktop/Subheader/Medium */
|
|
1248
1350
|
--subheader-medium: 400 20px/28px var(--typeface);
|
|
1249
|
-
/* Desktop/Subheader/Medium -
|
|
1351
|
+
/* Desktop/Subheader/Medium - line height */
|
|
1250
1352
|
--subheader-medium-line-height: 28px;
|
|
1251
|
-
/* Desktop/Subheader/Medium -
|
|
1353
|
+
/* Desktop/Subheader/Medium - size */
|
|
1252
1354
|
--subheader-medium-size: 20px;
|
|
1253
|
-
/* Desktop/Subheader/Medium -
|
|
1355
|
+
/* Desktop/Subheader/Medium - style */
|
|
1254
1356
|
--subheader-medium-style: regular;
|
|
1255
1357
|
/* Desktop/Subheader/X-Large - Headline */
|
|
1256
1358
|
--subheader-x-large: 400 28px/36px var(--typeface);
|
|
@@ -1277,617 +1379,268 @@ body {
|
|
|
1277
1379
|
/* Desktop/Subheader/XXX-Large - Large Headline style */
|
|
1278
1380
|
--subheader-xxx-large-style: regular;
|
|
1279
1381
|
}
|
|
1280
|
-
|
|
1281
|
-
/** Light theme (default) **/
|
|
1282
|
-
/* Background/base - Theme - Better Home & Garden */
|
|
1283
|
-
--background-base: #ffffff;
|
|
1284
|
-
/* Background/scrim - Theme - Better Home & Garden */
|
|
1285
|
-
--background-scrim: #00000040;
|
|
1286
|
-
/* Background/shade - Theme - Better Home & Garden */
|
|
1287
|
-
--background-shade: #f5f5f5;
|
|
1288
|
-
/* Data visual/category-01 - Theme - Better Home & Garden */
|
|
1289
|
-
--data-visual-category-01: #389e7a;
|
|
1290
|
-
/* Data visual/category-01-highlight - Theme - Better Home & Garden */
|
|
1291
|
-
--data-visual-category-01-highlight: #389e7a4d;
|
|
1292
|
-
/* Data visual/category-02 - Theme - Better Home & Garden */
|
|
1293
|
-
--data-visual-category-02: #0a466c;
|
|
1294
|
-
/* Data visual/category-02-highlight - Theme - Better Home & Garden */
|
|
1295
|
-
--data-visual-category-02-highlight: #0a466c4d;
|
|
1296
|
-
/* Data visual/category-03 - Theme - Better Home & Garden */
|
|
1297
|
-
--data-visual-category-03: #299de0;
|
|
1298
|
-
/* Data visual/category-03-highlight - Theme - Better Home & Garden */
|
|
1299
|
-
--data-visual-category-03-highlight: #299de04d;
|
|
1300
|
-
/* Data visual/category-04 - Theme - Better Home & Garden */
|
|
1301
|
-
--data-visual-category-04: #130033;
|
|
1302
|
-
/* Data visual/category-04-highlight - Theme - Better Home & Garden */
|
|
1303
|
-
--data-visual-category-04-highlight: #1300334d;
|
|
1304
|
-
/* Data visual/category-05 - Theme - Better Home & Garden */
|
|
1305
|
-
--data-visual-category-05: #094a53;
|
|
1306
|
-
/* Data visual/category-05-highlight - Theme - Better Home & Garden */
|
|
1307
|
-
--data-visual-category-05-highlight: #094a534d;
|
|
1308
|
-
/* Data visual/category-06 - Theme - Better Home & Garden */
|
|
1309
|
-
--data-visual-category-06: #7f7f7f;
|
|
1310
|
-
/* Data visual/category-06-highlight - Theme - Better Home & Garden */
|
|
1311
|
-
--data-visual-category-06-highlight: #7f7f7f4d;
|
|
1312
|
-
/* Data visual/category-07 - Theme - Better Home & Garden */
|
|
1313
|
-
--data-visual-category-07: #433479;
|
|
1314
|
-
/* Data visual/category-07-highlight - Theme - Better Home & Garden */
|
|
1315
|
-
--data-visual-category-07-highlight: #4334794d;
|
|
1316
|
-
/* Data visual/category-1-highlight - Theme - Better Home & Garden */
|
|
1317
|
-
--data-visual-category-1-highlight: #0a466c4d;
|
|
1318
|
-
/* Data visual/category-2 - Theme - Better Home & Garden */
|
|
1319
|
-
--data-visual-category-2: #299de0;
|
|
1320
|
-
/* Data visual/category-2-highlight - Theme - Better Home & Garden */
|
|
1321
|
-
--data-visual-category-2-highlight: #299de04d;
|
|
1322
|
-
/* Data visual/category-3 - Theme - Better Home & Garden */
|
|
1323
|
-
--data-visual-category-3: #130033;
|
|
1324
|
-
/* Data visual/category-3-highlight - Theme - Better Home & Garden */
|
|
1325
|
-
--data-visual-category-3-highlight: #1300334d;
|
|
1326
|
-
/* Data visual/category-4 - Theme - Better Home & Garden */
|
|
1327
|
-
--data-visual-category-4: #389e7a;
|
|
1328
|
-
/* Data visual/category-4-highlight - Theme - Better Home & Garden */
|
|
1329
|
-
--data-visual-category-4-highlight: #389e7a4d;
|
|
1330
|
-
/* Data visual/category-5 - Theme - Better Home & Garden */
|
|
1331
|
-
--data-visual-category-5: #094a53;
|
|
1332
|
-
/* Data visual/category-5-highlight - Theme - Better Home & Garden */
|
|
1333
|
-
--data-visual-category-5-highlight: #094a534d;
|
|
1334
|
-
/* Data visual/category-6 - Theme - Better Home & Garden */
|
|
1335
|
-
--data-visual-category-6: #7f7f7f;
|
|
1336
|
-
/* Data visual/category-6-highlight - Theme - Better Home & Garden */
|
|
1337
|
-
--data-visual-category-6-highlight: #7f7f7f4d;
|
|
1338
|
-
/* Data visual/category-7 - Theme - Better Home & Garden */
|
|
1339
|
-
--data-visual-category-7: #433479;
|
|
1340
|
-
/* Data visual/category-7-highlight - Theme - Better Home & Garden */
|
|
1341
|
-
--data-visual-category-7-highlight: #4334794d;
|
|
1342
|
-
/* Data visual/gradient-end - Theme - Better Home & Garden */
|
|
1343
|
-
--data-visual-gradient-end: #ffffff4d;
|
|
1344
|
-
/* Data visual/green - Theme - Better Home & Garden */
|
|
1345
|
-
--data-visual-green: #258750;
|
|
1346
|
-
/* Data visual/green-highlight - Theme - Better Home & Garden */
|
|
1347
|
-
--data-visual-green-highlight: #deede5;
|
|
1348
|
-
/* Data visual/negative - Theme - Better Home & Garden */
|
|
1349
|
-
--data-visual-negative: #d83a52;
|
|
1350
|
-
/* Data visual/negative-highlight - Theme - Better Home & Garden */
|
|
1351
|
-
--data-visual-negative-highlight: #f9e1e5;
|
|
1352
|
-
/* Data visual/positive - Theme - Better Home & Garden */
|
|
1353
|
-
--data-visual-positive: #258750;
|
|
1354
|
-
/* Data visual/positive-highlight - Theme - Better Home & Garden */
|
|
1355
|
-
--data-visual-positive-highlight: #deede5;
|
|
1356
|
-
/* Data visual/red - Theme - Better Home & Garden */
|
|
1357
|
-
--data-visual-red: #d83a52;
|
|
1358
|
-
/* Data visual/red-highlight - Theme - Better Home & Garden */
|
|
1359
|
-
--data-visual-red-highlight: #f9e1e5;
|
|
1360
|
-
/* Foreground/Brand/on-inverse-primary - Theme - Better Home & Garden */
|
|
1361
|
-
--foreground-brand-on-inverse-primary: #7db67c;
|
|
1362
|
-
/* Foreground/Brand/on-inverse-secondary - Theme - Better Home & Garden */
|
|
1363
|
-
--foreground-brand-on-inverse-secondary: #eba691;
|
|
1364
|
-
/* Foreground/Brand/on-brand-primary - Theme - Better Home & Garden */
|
|
1365
|
-
--foreground-brand-on-primary: #ffffff;
|
|
1366
|
-
/* Foreground/Brand/on-brand-secondary - Theme - Better Home & Garden */
|
|
1367
|
-
--foreground-brand-on-secondary: #ffffff;
|
|
1368
|
-
/* Foreground/Brand/brand-primary - Theme - Better Home & Garden */
|
|
1369
|
-
--foreground-brand-primary: #278627;
|
|
1370
|
-
/* Foreground/Brand/brand-primary-depth - Theme - Better Home & Garden */
|
|
1371
|
-
--foreground-brand-primary-depth: #217221;
|
|
1372
|
-
/* Foreground/Brand/brand-secondary - Theme - Better Home & Garden */
|
|
1373
|
-
--foreground-brand-secondary: #dd6b47;
|
|
1374
|
-
/* Foreground/Brand/brand-secondary-depth - Theme - Better Home & Garden */
|
|
1375
|
-
--foreground-brand-secondary-depth: #bc5b3c;
|
|
1376
|
-
/* Foreground/Link text/default - Theme - Better Home & Garden */
|
|
1377
|
-
--foreground-link-text-default: #215ecd;
|
|
1378
|
-
/* Foreground/Link text/default-disabled - Theme - Better Home & Garden */
|
|
1379
|
-
--foreground-link-text-default-disabled: #7a9ee1;
|
|
1380
|
-
/* Foreground/Link text/default-hovered - Theme - Better Home & Garden */
|
|
1381
|
-
--foreground-link-text-default-hovered: #1e55b9;
|
|
1382
|
-
/* Foreground/Link text/default-pressed - Theme - Better Home & Garden */
|
|
1383
|
-
--foreground-link-text-default-pressed: #1a4ba4;
|
|
1384
|
-
/* Foreground/Link text/default-visited - Theme - Better Home & Garden */
|
|
1385
|
-
--foreground-link-text-default-visited: #7a3e7a;
|
|
1386
|
-
/* Foreground/Link text/subtle-disabled - Theme - Better Home & Garden */
|
|
1387
|
-
--foreground-link-text-subtle-disabled: #bdbdbd;
|
|
1388
|
-
/* Foreground/Link text/subtle-hovered - Theme - Better Home & Garden */
|
|
1389
|
-
--foreground-link-text-subtle-hovered: #292929;
|
|
1390
|
-
/* Foreground/Link text/subtle-inversed-disabled - Theme - Better Home & Garden */
|
|
1391
|
-
--foreground-link-text-subtle-inversed-disabled: #757575;
|
|
1392
|
-
/* Foreground/Link text/subtle-pressed - Theme - Better Home & Garden */
|
|
1393
|
-
--foreground-link-text-subtle-pressed: #424242;
|
|
1394
|
-
/* Foreground/Neutral/disabled-on-color-surface - Theme - Better Home & Garden */
|
|
1395
|
-
--foreground-neutral-disabled-on-color-surface: #757575;
|
|
1396
|
-
/* Foreground/Neutral/disabled-on-surface - Theme - Better Home & Garden */
|
|
1397
|
-
--foreground-neutral-disabled-on-surface: #bdbdbd;
|
|
1398
|
-
/* Foreground/Neutral/on-surface - Theme - Better Home & Garden */
|
|
1399
|
-
--foreground-neutral-on-surface: #141414;
|
|
1400
|
-
/* Foreground/Neutral/on-surface-variant-01 - Theme - Better Home & Garden */
|
|
1401
|
-
--foreground-neutral-on-surface-variant-01: #474747;
|
|
1402
|
-
/* Foreground/Neutral/on-surface-variant-02 - Theme - Better Home & Garden */
|
|
1403
|
-
--foreground-neutral-on-surface-variant-02: #757575;
|
|
1404
|
-
/* Foreground/Neutral/on-surface-variant-03 - Theme - Better Home & Garden */
|
|
1405
|
-
--foreground-neutral-on-surface-variant-03: #8a8a8a;
|
|
1406
|
-
/* Foreground/Neutral/skeleton-element - Theme - Better Home & Garden */
|
|
1407
|
-
--foreground-neutral-skeleton-element: #c7c7c7;
|
|
1408
|
-
/* Foreground/Spectrum/blue - Theme - Better Home & Garden */
|
|
1409
|
-
--foreground-spectrum-blue: #143778;
|
|
1410
|
-
/* Foreground/Spectrum/green - Theme - Better Home & Garden */
|
|
1411
|
-
--foreground-spectrum-green: #134428;
|
|
1412
|
-
/* Foreground/Spectrum/lime - Theme - Better Home & Garden */
|
|
1413
|
-
--foreground-spectrum-lime: #60651a;
|
|
1414
|
-
/* Foreground/Spectrum/magenta - Theme - Better Home & Garden */
|
|
1415
|
-
--foreground-spectrum-magenta: #63076f;
|
|
1416
|
-
/* Foreground/Spectrum/orange - Theme - Better Home & Garden */
|
|
1417
|
-
--foreground-spectrum-orange: #773001;
|
|
1418
|
-
/* Foreground/Spectrum/pink - Theme - Better Home & Garden */
|
|
1419
|
-
--foreground-spectrum-pink: #6c1240;
|
|
1420
|
-
/* Foreground/Spectrum/purple - Theme - Better Home & Garden */
|
|
1421
|
-
--foreground-spectrum-purple: #310077;
|
|
1422
|
-
/* Foreground/Spectrum/red - Theme - Better Home & Garden */
|
|
1423
|
-
--foreground-spectrum-red: #6c1d29;
|
|
1424
|
-
/* Foreground/Spectrum/teal - Theme - Better Home & Garden */
|
|
1425
|
-
--foreground-spectrum-teal: #01413c;
|
|
1426
|
-
/* Foreground/Spectrum/yellow - Theme - Better Home & Garden */
|
|
1427
|
-
--foreground-spectrum-yellow: #7b5e18;
|
|
1428
|
-
/* Interaction/brand-disabled-opacity - Theme - 3.0 */
|
|
1429
|
-
--interaction-brand-disabled-opacity: #0000000f;
|
|
1430
|
-
/* Interaction/brand-hover-opacity - Theme - 3.0 */
|
|
1431
|
-
--interaction-brand-hover-opacity: #0000001a;
|
|
1432
|
-
/* Interaction/brand-press-opacity - Theme - 3.0 */
|
|
1433
|
-
--interaction-brand-press-opacity: #00000033;
|
|
1434
|
-
/* Interaction/hover-opacity - Theme - 3.0 */
|
|
1435
|
-
--interaction-hover-opacity: #00000014;
|
|
1436
|
-
/* Interaction/link-active-opacity - Theme - 3.0 */
|
|
1437
|
-
--interaction-link-active-opacity: #0000004d;
|
|
1438
|
-
/* Interaction/press-opacity - Theme - 3.0 */
|
|
1439
|
-
--interaction-press-opacity: #00000029;
|
|
1440
|
-
/* Interactions/brand-disabled-opacity - Theme - Better Home & Garden */
|
|
1441
|
-
--interactions-brand-disabled-opacity: #0000000f;
|
|
1442
|
-
/* Interactions/brand-hover-opacity - Theme - Better Home & Garden */
|
|
1443
|
-
--interactions-brand-hover-opacity: #0000001a;
|
|
1444
|
-
/* Interactions/brand-press-opacity - Theme - Better Home & Garden */
|
|
1445
|
-
--interactions-brand-press-opacity: #00000033;
|
|
1446
|
-
/* Interactions/disabled-opacity - Theme - Better Home & Garden */
|
|
1447
|
-
--interactions-disabled-opacity: #0000000f;
|
|
1448
|
-
/* Interactions/hover-opacity - Theme - Better Home & Garden */
|
|
1449
|
-
--interactions-hover-opacity: #00000014;
|
|
1450
|
-
/* Interactions/link-active-opacity - Theme - Better Home & Garden */
|
|
1451
|
-
--interactions-link-active-opacity: #0000004d;
|
|
1452
|
-
/* Interactions/neutral-hover-opacity - Theme - Better Home & Garden */
|
|
1453
|
-
--interactions-neutral-hover-opacity: #00000014;
|
|
1454
|
-
/* Interactions/neutral-press-opacity - Theme - Better Home & Garden */
|
|
1455
|
-
--interactions-neutral-press-opacity: #00000029;
|
|
1456
|
-
/* Interactions/press-opacity - Theme - Better Home & Garden */
|
|
1457
|
-
--interactions-press-opacity: #00000029;
|
|
1458
|
-
/* Interactions/primary-disabled-opacity - Theme - Better Home & Garden */
|
|
1459
|
-
--interactions-primary-disabled-opacity: #2786271f;
|
|
1460
|
-
/* Interactions/primary-hover-opacity - Theme - Better Home & Garden */
|
|
1461
|
-
--interactions-primary-hover-opacity: #2786271a;
|
|
1462
|
-
/* Interactions/primary-press-opacity - Theme - Better Home & Garden */
|
|
1463
|
-
--interactions-primary-press-opacity: #27862733;
|
|
1464
|
-
/* Shadow/shadow-10 - Theme - Better Home & Garden */
|
|
1465
|
-
--shadow-10: #0000001a;
|
|
1466
|
-
/* Shadow/shadow-12 - Theme - Better Home & Garden */
|
|
1467
|
-
--shadow-12: #0000001f;
|
|
1468
|
-
/* Shadow/shadow-15 - Theme - Better Home & Garden */
|
|
1469
|
-
--shadow-15: #00000026;
|
|
1470
|
-
/* Shadow/shadow-25 - Theme - Better Home & Garden */
|
|
1471
|
-
--shadow-25: #00000040;
|
|
1472
|
-
/* Shadow/shadow-32 - Theme - Better Home & Garden */
|
|
1473
|
-
--shadow-32: #00000052;
|
|
1474
|
-
/* Shadow/inner-shadow - Theme - Better Home & Garden */
|
|
1475
|
-
--shadow-inner: #ffffff;
|
|
1476
|
-
/* Shadow/inner-shadow-100 - Theme - Better Home & Garden */
|
|
1477
|
-
--shadow-inner-100: #ffffff;
|
|
1478
|
-
/* Shadow/variant-01 - Theme - Better Home & Garden */
|
|
1479
|
-
--shadow-variant-01: #0000001a;
|
|
1480
|
-
/* Shadow/variant-02 - Theme - Better Home & Garden */
|
|
1481
|
-
--shadow-variant-02: #0000001f;
|
|
1482
|
-
/* Shadow/variant-03 - Theme - Better Home & Garden */
|
|
1483
|
-
--shadow-variant-03: #00000026;
|
|
1484
|
-
/* Shadow/variant-04 - Theme - Better Home & Garden */
|
|
1485
|
-
--shadow-variant-04: #00000040;
|
|
1486
|
-
/* Shadow/variant-05 - Theme - Better Home & Garden */
|
|
1487
|
-
--shadow-variant-05: #00000052;
|
|
1488
|
-
/* Status/error - Theme - Denali & Boss */
|
|
1489
|
-
--status-error: #d83a52;
|
|
1490
|
-
/* Status/information - Theme - Better Home & Garden */
|
|
1491
|
-
--status-information: #276ef1;
|
|
1492
|
-
/* Status/informational - Theme - Better Home & Garden */
|
|
1493
|
-
--status-informational: #276ef1;
|
|
1494
|
-
/* Status/on-success - Theme - Better Home & Garden */
|
|
1495
|
-
--status-on-success: #ffffff;
|
|
1496
|
-
/* Status/success - Theme - Better Home & Garden */
|
|
1497
|
-
--status-success: #258750;
|
|
1498
|
-
/* Status/warning - Theme - Better Home & Garden */
|
|
1499
|
-
--status-warning: #f6bc2f;
|
|
1500
|
-
/* Stroke/Brand/brand-primary - Theme - Better Home & Garden */
|
|
1501
|
-
--stroke-brand-primary: #278627;
|
|
1502
|
-
/* Stroke/Brand/brand-primary-depth - Theme - Better Home & Garden */
|
|
1503
|
-
--stroke-brand-primary-depth: #217221;
|
|
1504
|
-
/* Stroke/Brand/brand-secondary - Theme - Better Home & Garden */
|
|
1505
|
-
--stroke-brand-secondary: #dd6b47;
|
|
1506
|
-
/* Stroke/Brand/brand-secondary-depth - Theme - Better Home & Garden */
|
|
1507
|
-
--stroke-brand-secondary-depth: #bc5b3c;
|
|
1508
|
-
/* Stroke/Neutral/neutral-base - Theme - Better Home & Garden */
|
|
1509
|
-
--stroke-neutral-base: #949494;
|
|
1510
|
-
/* Stroke/Neutral/disabled-dark - Theme - Better Home & Garden */
|
|
1511
|
-
--stroke-neutral-disabled-dark: #757575;
|
|
1512
|
-
/* Stroke/Neutral/disabled-light - Theme - Better Home & Garden */
|
|
1513
|
-
--stroke-neutral-disabled-light: #bdbdbd;
|
|
1514
|
-
/* Stroke/Neutral/focus - Theme - Better Home & Garden */
|
|
1515
|
-
--stroke-neutral-focus: #000000;
|
|
1516
|
-
/* Stroke/Neutral/neutral-high - Theme - Better Home & Garden */
|
|
1517
|
-
--stroke-neutral-high: #141414;
|
|
1518
|
-
/* Stroke/Neutral/neutral-high-contrast - Theme - Better Home & Garden */
|
|
1519
|
-
--stroke-neutral-high-contrast: #141414;
|
|
1520
|
-
/* Stroke/Neutral/Interaction/disabled-dark - Theme - 3.0 */
|
|
1521
|
-
--stroke-neutral-interaction-disabled-dark: #48566a;
|
|
1522
|
-
/* Stroke/Neutral/Interaction/disabled-light - Theme - 3.0 */
|
|
1523
|
-
--stroke-neutral-interaction-disabled-light: #c8d6e5;
|
|
1524
|
-
/* Stroke/Neutral/Interaction/focus - Theme - 3.0 */
|
|
1525
|
-
--stroke-neutral-interaction-focus: #000000;
|
|
1526
|
-
/* Stroke/Neutral/Interactions/disabled-dark - Theme - Better Home & Garden */
|
|
1527
|
-
--stroke-neutral-interactions-disabled-dark: #757575;
|
|
1528
|
-
/* Stroke/Neutral/Interactions/disabled-light - Theme - Better Home & Garden */
|
|
1529
|
-
--stroke-neutral-interactions-disabled-light: #bdbdbd;
|
|
1530
|
-
/* Stroke/Neutral/Interactions/focus - Theme - Better Home & Garden */
|
|
1531
|
-
--stroke-neutral-interactions-focus: #000000;
|
|
1532
|
-
/* Stroke/Neutral/neutral-low - Theme - Better Home & Garden */
|
|
1533
|
-
--stroke-neutral-low: #e0e0e0;
|
|
1534
|
-
/* Stroke/Neutral/neutral-low-contrast - Theme - Better Home & Garden */
|
|
1535
|
-
--stroke-neutral-low-contrast: #e0e0e0;
|
|
1536
|
-
/* Surface/Brand/primary - Theme - Better Home & Garden */
|
|
1537
|
-
--surface-brand-primary: #278627;
|
|
1538
|
-
/* Surface/Brand/primary-highlight - Theme - Better Home & Garden */
|
|
1539
|
-
--surface-brand-primary-highlight: #dfeddf;
|
|
1540
|
-
/* Surface/Brand/secondary - Theme - Better Home & Garden */
|
|
1541
|
-
--surface-brand-secondary: #dd6b47;
|
|
1542
|
-
/* Surface/Brand/secondary-highlight - Theme - Better Home & Garden */
|
|
1543
|
-
--surface-brand-secondary-highlight: #fae9e3;
|
|
1544
|
-
/* Surface/Neutral/Interactions/dark-disabled - Theme - Better Home & Garden */
|
|
1545
|
-
--surface-neutral-interactions-dark-disabled: #d6d6d6;
|
|
1546
|
-
/* Surface/Neutral/Interactions/light-disabled - Theme - Better Home & Garden */
|
|
1547
|
-
--surface-neutral-interactions-light-disabled: #f5f5f5;
|
|
1548
|
-
/* Surface/Neutral/Interactions/skeleton - Theme - Better Home & Garden */
|
|
1549
|
-
--surface-neutral-interactions-skeleton: #e0e0e0;
|
|
1550
|
-
/* Surface/Neutral/inverse - Theme - Better Home & Garden */
|
|
1551
|
-
--surface-neutral-inverse: #1f1f1f;
|
|
1552
|
-
/* Surface/Neutral/inverse-dark - Theme - Better Home & Garden */
|
|
1553
|
-
--surface-neutral-inverse-dark: #1f1f1f;
|
|
1554
|
-
/* Surface/Neutral/inverse-light - Theme - Better Home & Garden */
|
|
1555
|
-
--surface-neutral-inverse-light: #ffffff;
|
|
1556
|
-
/* Surface/Neutral/skeleton - Theme - Better Home & Garden */
|
|
1557
|
-
--surface-neutral-skeleton: #e0e0e0;
|
|
1558
|
-
/* Surface/Neutral/T1-base - Theme - Better Home & Garden */
|
|
1559
|
-
--surface-neutral-t1-base: #ffffff;
|
|
1560
|
-
/* Surface/Neutral/T2-lowest - Theme - Better Home & Garden */
|
|
1561
|
-
--surface-neutral-t2-lowest: #f5f5f5;
|
|
1562
|
-
/* Surface/Neutral/T3-low - Theme - Better Home & Garden */
|
|
1563
|
-
--surface-neutral-t3-low: #dbdbdb;
|
|
1564
|
-
/* Surface/Neutral/T4-high - Theme - Better Home & Garden */
|
|
1565
|
-
--surface-neutral-t4-high: #949494;
|
|
1566
|
-
/* Surface/Spectrum/blue - Theme - Better Home & Garden */
|
|
1567
|
-
--surface-spectrum-blue: #dfe9fd;
|
|
1568
|
-
/* Surface/Spectrum/green - Theme - Better Home & Garden */
|
|
1569
|
-
--surface-spectrum-green: #deede5;
|
|
1570
|
-
/* Surface/Spectrum/lime - Theme - Better Home & Garden */
|
|
1571
|
-
--surface-spectrum-lime: #f6f7e0;
|
|
1572
|
-
/* Surface/Spectrum/magenta - Theme - Better Home & Garden */
|
|
1573
|
-
--surface-spectrum-magenta: #f6dbfa;
|
|
1574
|
-
/* Surface/Spectrum/orange - Theme - Better Home & Garden */
|
|
1575
|
-
--surface-spectrum-orange: #fce7d9;
|
|
1576
|
-
/* Surface/Spectrum/pink - Theme - Better Home & Garden */
|
|
1577
|
-
--surface-spectrum-pink: #f9deec;
|
|
1578
|
-
/* Surface/Spectrum/purple - Theme - Better Home & Garden */
|
|
1579
|
-
--surface-spectrum-purple: #e7d9fc;
|
|
1580
|
-
/* Surface/Spectrum/red - Theme - Better Home & Garden */
|
|
1581
|
-
--surface-spectrum-red: #f9e1e5;
|
|
1582
|
-
/* Surface/Spectrum/teal - Theme - Better Home & Garden */
|
|
1583
|
-
--surface-spectrum-teal: #d9eceb;
|
|
1584
|
-
/* Surface/Spectrum/yellow - Theme - Better Home & Garden */
|
|
1585
|
-
--surface-spectrum-yellow: #fef5e0;
|
|
1586
1382
|
}
|
|
1587
|
-
|
|
1383
|
+
/* dark theme */
|
|
1588
1384
|
[data-theme='dark'] {
|
|
1589
|
-
/* Background/base - Theme -
|
|
1385
|
+
/* Background/base - Theme - BRAND */
|
|
1590
1386
|
--background-base: #1f1f1f;
|
|
1591
|
-
/* Background/scrim - Theme -
|
|
1387
|
+
/* Background/scrim - Theme - BRAND */
|
|
1592
1388
|
--background-scrim: #61616180;
|
|
1593
|
-
/* Background/shade - Theme -
|
|
1389
|
+
/* Background/shade - Theme - BRAND */
|
|
1594
1390
|
--background-shade: #292929;
|
|
1595
|
-
/* Data visual/category-01 -
|
|
1391
|
+
/* Data visual/category-01 - Brand */
|
|
1596
1392
|
--data-visual-category-01: #88c5af;
|
|
1597
|
-
/* Data visual/category-01-highlight -
|
|
1393
|
+
/* Data visual/category-01-highlight - Brand */
|
|
1598
1394
|
--data-visual-category-01-highlight: #88c5af4d;
|
|
1599
|
-
/* Data visual/category-02 -
|
|
1395
|
+
/* Data visual/category-02 - Brand */
|
|
1600
1396
|
--data-visual-category-02: #0a466c;
|
|
1601
|
-
/* Data visual/category-02-highlight -
|
|
1397
|
+
/* Data visual/category-02-highlight - Brand */
|
|
1602
1398
|
--data-visual-category-02-highlight: #7899ae4d;
|
|
1603
|
-
/* Data visual/category-03 -
|
|
1399
|
+
/* Data visual/category-03 - Brand */
|
|
1604
1400
|
--data-visual-category-03: #7fc4ec;
|
|
1605
|
-
/* Data visual/category-03-highlight -
|
|
1401
|
+
/* Data visual/category-03-highlight - Brand */
|
|
1606
1402
|
--data-visual-category-03-highlight: #7fc4ec4d;
|
|
1607
|
-
/* Data visual/category-04 -
|
|
1403
|
+
/* Data visual/category-04 - Brand */
|
|
1608
1404
|
--data-visual-category-04: #958ca3;
|
|
1609
|
-
/* Data visual/category-04-highlight -
|
|
1405
|
+
/* Data visual/category-04-highlight - Brand */
|
|
1610
1406
|
--data-visual-category-04-highlight: #958ca34d;
|
|
1611
|
-
/* Data visual/category-05 -
|
|
1407
|
+
/* Data visual/category-05 - Brand */
|
|
1612
1408
|
--data-visual-category-05: #789ba0;
|
|
1613
|
-
/* Data visual/category-05-highlight -
|
|
1409
|
+
/* Data visual/category-05-highlight - Brand */
|
|
1614
1410
|
--data-visual-category-05-highlight: #789ba04d;
|
|
1615
|
-
/* Data visual/category-06 -
|
|
1411
|
+
/* Data visual/category-06 - Brand */
|
|
1616
1412
|
--data-visual-category-06: #b2b2b2;
|
|
1617
|
-
/* Data visual/category-06-highlight -
|
|
1413
|
+
/* Data visual/category-06-highlight - Brand */
|
|
1618
1414
|
--data-visual-category-06-highlight: #b2b2b24d;
|
|
1619
|
-
/* Data visual/category-07 -
|
|
1415
|
+
/* Data visual/category-07 - Brand */
|
|
1620
1416
|
--data-visual-category-07: #a19abc;
|
|
1621
|
-
/* Data visual/category-07-highlight -
|
|
1417
|
+
/* Data visual/category-07-highlight - Brand */
|
|
1622
1418
|
--data-visual-category-07-highlight: #a19abc4d;
|
|
1623
|
-
/* Data visual/
|
|
1624
|
-
--data-visual-category-1-highlight: #7899ae4d;
|
|
1625
|
-
/* Data visual/category-2 - Theme - Better Home & Garden */
|
|
1626
|
-
--data-visual-category-2: #7fc4ec;
|
|
1627
|
-
/* Data visual/category-2-highlight - Theme - Better Home & Garden */
|
|
1628
|
-
--data-visual-category-2-highlight: #7fc4ec4d;
|
|
1629
|
-
/* Data visual/category-3 - Theme - Better Home & Garden */
|
|
1630
|
-
--data-visual-category-3: #958ca3;
|
|
1631
|
-
/* Data visual/category-3-highlight - Theme - Better Home & Garden */
|
|
1632
|
-
--data-visual-category-3-highlight: #958ca34d;
|
|
1633
|
-
/* Data visual/category-4 - Theme - Better Home & Garden */
|
|
1634
|
-
--data-visual-category-4: #88c5af;
|
|
1635
|
-
/* Data visual/category-4-highlight - Theme - Better Home & Garden */
|
|
1636
|
-
--data-visual-category-4-highlight: #88c5af4d;
|
|
1637
|
-
/* Data visual/category-5 - Theme - Better Home & Garden */
|
|
1638
|
-
--data-visual-category-5: #789ba0;
|
|
1639
|
-
/* Data visual/category-5-highlight - Theme - Better Home & Garden */
|
|
1640
|
-
--data-visual-category-5-highlight: #789ba04d;
|
|
1641
|
-
/* Data visual/category-6 - Theme - Better Home & Garden */
|
|
1642
|
-
--data-visual-category-6: #b2b2b2;
|
|
1643
|
-
/* Data visual/category-6-highlight - Theme - Better Home & Garden */
|
|
1644
|
-
--data-visual-category-6-highlight: #b2b2b24d;
|
|
1645
|
-
/* Data visual/category-7 - Theme - Better Home & Garden */
|
|
1646
|
-
--data-visual-category-7: #a19abc;
|
|
1647
|
-
/* Data visual/category-7-highlight - Theme - Better Home & Garden */
|
|
1648
|
-
--data-visual-category-7-highlight: #a19abc4d;
|
|
1649
|
-
/* Data visual/gradient-end - Theme - Better Home & Garden */
|
|
1419
|
+
/* Data visual/gradient-end - Theme - BRAND */
|
|
1650
1420
|
--data-visual-gradient-end: #1f1f1f4d;
|
|
1651
|
-
/* Data visual/
|
|
1652
|
-
--data-visual-green: #7cb796;
|
|
1653
|
-
/* Data visual/green-highlight - Theme - Better Home & Garden */
|
|
1654
|
-
--data-visual-green-highlight: #0d2f1c;
|
|
1655
|
-
/* Data visual/negative - Theme - Better Home & Garden */
|
|
1421
|
+
/* Data visual/negative - Brand */
|
|
1656
1422
|
--data-visual-negative: #e88997;
|
|
1657
|
-
/* Data visual/negative-highlight -
|
|
1423
|
+
/* Data visual/negative-highlight - Brand */
|
|
1658
1424
|
--data-visual-negative-highlight: #4c141d;
|
|
1659
|
-
/* Data visual/positive -
|
|
1425
|
+
/* Data visual/positive - Brand */
|
|
1660
1426
|
--data-visual-positive: #7cb796;
|
|
1661
|
-
/* Data visual/positive-highlight -
|
|
1427
|
+
/* Data visual/positive-highlight - Brand */
|
|
1662
1428
|
--data-visual-positive-highlight: #0d2f1c;
|
|
1663
|
-
/*
|
|
1664
|
-
--data-visual-red: #e88997;
|
|
1665
|
-
/* Data visual/red-highlight - Theme - Better Home & Garden */
|
|
1666
|
-
--data-visual-red-highlight: #4c141d;
|
|
1667
|
-
/* Foreground/Brand/on-inverse-primary - Theme - Better Home & Garden */
|
|
1429
|
+
/* Foreground/Brand/on-inverse-primary - Theme - BRAND */
|
|
1668
1430
|
--foreground-brand-on-inverse-primary: #7db67c;
|
|
1669
|
-
/* Foreground/Brand/on-inverse-secondary - Theme -
|
|
1431
|
+
/* Foreground/Brand/on-inverse-secondary - Theme - BRAND */
|
|
1670
1432
|
--foreground-brand-on-inverse-secondary: #eba691;
|
|
1671
|
-
/* Foreground/Brand/on-brand-primary - Theme -
|
|
1433
|
+
/* Foreground/Brand/on-brand-primary - Theme - BRAND */
|
|
1434
|
+
/* Foreground color used on Brand's primary color (non neutral color) */
|
|
1672
1435
|
--foreground-brand-on-primary: #141414;
|
|
1673
|
-
/* Foreground/Brand/on-brand-secondary - Theme -
|
|
1436
|
+
/* Foreground/Brand/on-brand-secondary - Theme - BRAND */
|
|
1437
|
+
/* Foreground color used on Brand's primary color (non neutral color) */
|
|
1674
1438
|
--foreground-brand-on-secondary: #141414;
|
|
1675
|
-
/* Foreground/Brand/brand-primary - Theme -
|
|
1439
|
+
/* Foreground/Brand/brand-primary - Theme - BRAND */
|
|
1440
|
+
/* Foreground text and icons that match the brand's primary color */
|
|
1676
1441
|
--foreground-brand-primary: #7db67c;
|
|
1677
|
-
/* Foreground/Brand/brand-primary-depth - Theme -
|
|
1442
|
+
/* Foreground/Brand/brand-primary-depth - Theme - BRAND */
|
|
1678
1443
|
--foreground-brand-primary-depth: #88bc88;
|
|
1679
|
-
/* Foreground/Brand/brand-secondary - Theme -
|
|
1444
|
+
/* Foreground/Brand/brand-secondary - Theme - BRAND */
|
|
1445
|
+
/* Foreground text and icons that match the brand's secondary color */
|
|
1680
1446
|
--foreground-brand-secondary: #eba691;
|
|
1681
|
-
/* Foreground/Brand/brand-secondary-depth - Theme -
|
|
1447
|
+
/* Foreground/Brand/brand-secondary-depth - Theme - BRAND */
|
|
1682
1448
|
--foreground-brand-secondary-depth: #eba691;
|
|
1683
|
-
/* Foreground/Link text/default - Theme -
|
|
1449
|
+
/* Foreground/Link text/default - Theme - BRAND */
|
|
1684
1450
|
--foreground-link-text-default: #7a9ee1;
|
|
1685
|
-
/* Foreground/Link text/default-disabled - Theme -
|
|
1451
|
+
/* Foreground/Link text/default-disabled - Theme - BRAND */
|
|
1686
1452
|
--foreground-link-text-default-disabled: #14387b;
|
|
1687
|
-
/* Foreground/Link text/default-hovered - Theme -
|
|
1453
|
+
/* Foreground/Link text/default-hovered - Theme - BRAND */
|
|
1688
1454
|
--foreground-link-text-default-hovered: #90afe6;
|
|
1689
|
-
/* Foreground/Link text/default-pressed - Theme -
|
|
1455
|
+
/* Foreground/Link text/default-pressed - Theme - BRAND */
|
|
1690
1456
|
--foreground-link-text-default-pressed: #a6bfeb;
|
|
1691
|
-
/* Foreground/Link text/default-visited - Theme -
|
|
1457
|
+
/* Foreground/Link text/default-visited - Theme - BRAND */
|
|
1692
1458
|
--foreground-link-text-default-visited: #af8baf;
|
|
1693
|
-
/* Foreground/Link text/subtle-disabled -
|
|
1459
|
+
/* Foreground/Link text/subtle-disabled - Brand */
|
|
1694
1460
|
--foreground-link-text-subtle-disabled: #4d4d4d;
|
|
1695
|
-
/* Foreground/Link text/subtle-hovered - Theme -
|
|
1461
|
+
/* Foreground/Link text/subtle-hovered - Theme - BRAND */
|
|
1696
1462
|
--foreground-link-text-subtle-hovered: #e6e6e6;
|
|
1697
|
-
/* Foreground/Link text/subtle-
|
|
1698
|
-
--foreground-link-text-subtle-
|
|
1699
|
-
/* Foreground/Link text/subtle-pressed - Theme -
|
|
1463
|
+
/* Foreground/Link text/subtle-inverse-hovered - Theme - BRAND */
|
|
1464
|
+
--foreground-link-text-subtle-inverse-hovered: #e6e6e6;
|
|
1465
|
+
/* Foreground/Link text/subtle-inverse-pressed - Theme - BRAND */
|
|
1466
|
+
--foreground-link-text-subtle-inverse-pressed: #d1d1d1;
|
|
1467
|
+
/* Foreground/Link text/subtle-inversed-disabled - Brand */
|
|
1468
|
+
--foreground-link-text-subtle-inversed-disabled: #3d3d3d;
|
|
1469
|
+
/* Foreground/Link text/subtle-pressed - Theme - BRAND */
|
|
1700
1470
|
--foreground-link-text-subtle-pressed: #d1d1d1;
|
|
1701
|
-
/* Foreground/Neutral/disabled-on-color-surface - Theme -
|
|
1702
|
-
--foreground-neutral-disabled-on-color-surface: #
|
|
1703
|
-
/* Foreground/Neutral/disabled-on-surface - Theme -
|
|
1471
|
+
/* Foreground/Neutral/disabled-on-color-surface - Theme - BRAND */
|
|
1472
|
+
--foreground-neutral-disabled-on-color-surface: #3d3d3d;
|
|
1473
|
+
/* Foreground/Neutral/disabled-on-surface - Theme - BRAND */
|
|
1704
1474
|
--foreground-neutral-disabled-on-surface: #4d4d4d;
|
|
1705
|
-
/* Foreground/Neutral/on-
|
|
1475
|
+
/* Foreground/Neutral/on-color - Theme - BRAND */
|
|
1476
|
+
/* Interactive controls */
|
|
1477
|
+
--foreground-neutral-on-color: #ffffff;
|
|
1478
|
+
/* Foreground/Neutral/on-inverse-surface - Brand */
|
|
1479
|
+
/* Text and icons against inverse surface */
|
|
1480
|
+
--foreground-neutral-on-inverse-surface: #fafafa;
|
|
1481
|
+
/* Foreground/Neutral/on-surface - Theme - BRAND */
|
|
1482
|
+
/* Default foreground text and icons against any surface color */
|
|
1706
1483
|
--foreground-neutral-on-surface: #fafafa;
|
|
1707
|
-
/* Foreground/Neutral/on-surface-variant-01 - Theme -
|
|
1484
|
+
/* Foreground/Neutral/on-surface-variant-01 - Theme - BRAND */
|
|
1485
|
+
/* Secondary foreground color for icons and text */
|
|
1708
1486
|
--foreground-neutral-on-surface-variant-01: #c2c2c2;
|
|
1709
|
-
/* Foreground/Neutral/on-surface-variant-02 - Theme -
|
|
1487
|
+
/* Foreground/Neutral/on-surface-variant-02 - Theme - BRAND */
|
|
1488
|
+
/* Tertiary foreground color for icons and text */
|
|
1710
1489
|
--foreground-neutral-on-surface-variant-02: #9e9e9e;
|
|
1711
|
-
/* Foreground/Neutral/on-surface-variant-03 - Theme -
|
|
1490
|
+
/* Foreground/Neutral/on-surface-variant-03 - Theme - BRAND */
|
|
1491
|
+
/* Quaternary foreground color for icons and text. Only for placeholder text */
|
|
1712
1492
|
--foreground-neutral-on-surface-variant-03: #757575;
|
|
1713
|
-
/* Foreground/Neutral/skeleton-element - Theme -
|
|
1714
|
-
--foreground-neutral-skeleton-element: #
|
|
1715
|
-
/* Foreground/Spectrum/blue - Theme -
|
|
1493
|
+
/* Foreground/Neutral/skeleton-element - Theme - BRAND */
|
|
1494
|
+
--foreground-neutral-skeleton-element: #333333;
|
|
1495
|
+
/* Foreground/Spectrum/blue - Theme - BRAND */
|
|
1716
1496
|
--foreground-spectrum-blue: #88aff7;
|
|
1717
|
-
/* Foreground/Spectrum/green - Theme -
|
|
1497
|
+
/* Foreground/Spectrum/green - Theme - BRAND */
|
|
1718
1498
|
--foreground-spectrum-green: #87bd9f;
|
|
1719
|
-
/* Foreground/Spectrum/lime - Theme -
|
|
1499
|
+
/* Foreground/Spectrum/lime - Theme - BRAND */
|
|
1720
1500
|
--foreground-spectrum-lime: #dce28f;
|
|
1721
|
-
/* Foreground/Spectrum/magenta - Theme -
|
|
1501
|
+
/* Foreground/Spectrum/magenta - Theme - BRAND */
|
|
1722
1502
|
--foreground-spectrum-magenta: #e07aed;
|
|
1723
|
-
/* Foreground/Spectrum/orange - Theme -
|
|
1503
|
+
/* Foreground/Spectrum/orange - Theme - BRAND */
|
|
1724
1504
|
--foreground-spectrum-orange: #f6a874;
|
|
1725
|
-
/* Foreground/Spectrum/pink - Theme -
|
|
1505
|
+
/* Foreground/Spectrum/pink - Theme - BRAND */
|
|
1726
1506
|
--foreground-spectrum-pink: #ea86b9;
|
|
1727
|
-
/* Foreground/Spectrum/purple - Theme -
|
|
1507
|
+
/* Foreground/Spectrum/purple - Theme - BRAND */
|
|
1728
1508
|
--foreground-spectrum-purple: #c8a6f9;
|
|
1729
|
-
/* Foreground/Spectrum/red - Theme -
|
|
1509
|
+
/* Foreground/Spectrum/red - Theme - BRAND */
|
|
1730
1510
|
--foreground-spectrum-red: #ea93a0;
|
|
1731
|
-
/* Foreground/Spectrum/teal - Theme -
|
|
1511
|
+
/* Foreground/Spectrum/teal - Theme - BRAND */
|
|
1732
1512
|
--foreground-spectrum-teal: #74bbb4;
|
|
1733
|
-
/* Foreground/Spectrum/yellow - Theme -
|
|
1513
|
+
/* Foreground/Spectrum/yellow - Theme - BRAND */
|
|
1734
1514
|
--foreground-spectrum-yellow: #fada8d;
|
|
1735
|
-
/*
|
|
1736
|
-
--interaction-brand-disabled-opacity: #ffffff0f;
|
|
1737
|
-
/* Interaction/brand-hover-opacity - Theme - 3.0 */
|
|
1738
|
-
--interaction-brand-hover-opacity: #ffffff1a;
|
|
1739
|
-
/* Interaction/brand-press-opacity - Theme - 3.0 */
|
|
1740
|
-
--interaction-brand-press-opacity: #ffffff33;
|
|
1741
|
-
/* Interaction/hover-opacity - Theme - 3.0 */
|
|
1742
|
-
--interaction-hover-opacity: #ffffff14;
|
|
1743
|
-
/* Interaction/link-active-opacity - Theme - 3.0 */
|
|
1744
|
-
--interaction-link-active-opacity: #ffffff4d;
|
|
1745
|
-
/* Interaction/press-opacity - Theme - 3.0 */
|
|
1746
|
-
--interaction-press-opacity: #ffffff29;
|
|
1747
|
-
/* Interactions/brand-disabled-opacity - Theme - Better Home & Garden */
|
|
1748
|
-
--interactions-brand-disabled-opacity: #ffffff0f;
|
|
1749
|
-
/* Interactions/brand-hover-opacity - Theme - Better Home & Garden */
|
|
1515
|
+
/* Interactions/brand-hover-opacity - Theme - BRAND */
|
|
1750
1516
|
--interactions-brand-hover-opacity: #ffffff1a;
|
|
1751
|
-
/* Interactions/brand-press-opacity - Theme -
|
|
1517
|
+
/* Interactions/brand-press-opacity - Theme - BRAND */
|
|
1752
1518
|
--interactions-brand-press-opacity: #ffffff33;
|
|
1753
|
-
/* Interactions/disabled-opacity - Theme -
|
|
1519
|
+
/* Interactions/disabled-opacity - Theme - BRAND */
|
|
1754
1520
|
--interactions-disabled-opacity: #ffffff0f;
|
|
1755
|
-
/* Interactions/
|
|
1756
|
-
--interactions-hover-opacity: #ffffff14;
|
|
1757
|
-
/* Interactions/link-active-opacity - Theme - Better Home & Garden */
|
|
1521
|
+
/* Interactions/link-active-opacity - Theme - BRAND */
|
|
1758
1522
|
--interactions-link-active-opacity: #ffffff4d;
|
|
1759
|
-
/* Interactions/neutral-hover-opacity -
|
|
1523
|
+
/* Interactions/neutral-hover-opacity - Brand */
|
|
1524
|
+
/* surfaces using neutral tones */
|
|
1760
1525
|
--interactions-neutral-hover-opacity: #ffffff14;
|
|
1761
|
-
/* Interactions/neutral-press-opacity -
|
|
1526
|
+
/* Interactions/neutral-press-opacity - Brand */
|
|
1527
|
+
/* surfaces using neutral tones */
|
|
1762
1528
|
--interactions-neutral-press-opacity: #ffffff29;
|
|
1763
|
-
/* Interactions/
|
|
1764
|
-
--interactions-press-opacity: #ffffff29;
|
|
1765
|
-
/* Interactions/primary-disabled-opacity - Theme - Better Home & Garden */
|
|
1529
|
+
/* Interactions/primary-disabled-opacity - Theme - BRAND */
|
|
1766
1530
|
--interactions-primary-disabled-opacity: #7db67c1f;
|
|
1767
|
-
/* Interactions/primary-hover-opacity - Theme -
|
|
1531
|
+
/* Interactions/primary-hover-opacity - Theme - BRAND */
|
|
1768
1532
|
--interactions-primary-hover-opacity: #7db67c1a;
|
|
1769
|
-
/* Interactions/primary-press-opacity - Theme -
|
|
1533
|
+
/* Interactions/primary-press-opacity - Theme - BRAND */
|
|
1770
1534
|
--interactions-primary-press-opacity: #7db67c33;
|
|
1771
|
-
/* Shadow/shadow
|
|
1772
|
-
--shadow-10: #6161611a;
|
|
1773
|
-
/* Shadow/shadow-12 - Theme - Better Home & Garden */
|
|
1774
|
-
--shadow-12: #6161611f;
|
|
1775
|
-
/* Shadow/shadow-15 - Theme - Better Home & Garden */
|
|
1776
|
-
--shadow-15: #61616126;
|
|
1777
|
-
/* Shadow/shadow-25 - Theme - Better Home & Garden */
|
|
1778
|
-
--shadow-25: #61616140;
|
|
1779
|
-
/* Shadow/shadow-32 - Theme - Better Home & Garden */
|
|
1780
|
-
--shadow-32: #61616152;
|
|
1781
|
-
/* Shadow/inner-shadow - Theme - Better Home & Garden */
|
|
1535
|
+
/* Shadow/inner-shadow - Brand */
|
|
1782
1536
|
--shadow-inner: #000000;
|
|
1783
|
-
/* Shadow/
|
|
1784
|
-
--shadow-inner-100: #000000;
|
|
1785
|
-
/* Shadow/variant-01 - Theme - Better Home & Garden */
|
|
1537
|
+
/* Shadow/variant-01 - Brand */
|
|
1786
1538
|
--shadow-variant-01: #6161611a;
|
|
1787
|
-
/* Shadow/variant-02 -
|
|
1539
|
+
/* Shadow/variant-02 - Brand */
|
|
1788
1540
|
--shadow-variant-02: #6161611f;
|
|
1789
|
-
/* Shadow/variant-03 -
|
|
1541
|
+
/* Shadow/variant-03 - Brand */
|
|
1790
1542
|
--shadow-variant-03: #61616126;
|
|
1791
|
-
/* Shadow/variant-04 -
|
|
1543
|
+
/* Shadow/variant-04 - Brand */
|
|
1792
1544
|
--shadow-variant-04: #61616140;
|
|
1793
|
-
/* Shadow/variant-05 -
|
|
1545
|
+
/* Shadow/variant-05 - Brand */
|
|
1794
1546
|
--shadow-variant-05: #61616152;
|
|
1795
|
-
/* Status/error - Theme -
|
|
1547
|
+
/* Status/error - Theme - BRAND */
|
|
1548
|
+
/* Foreground error text and icons */
|
|
1796
1549
|
--status-error: #e26b7d;
|
|
1797
|
-
/* Status/
|
|
1798
|
-
|
|
1799
|
-
/* Status/informational - Theme - Better Home & Garden */
|
|
1550
|
+
/* Status/informational - Brand */
|
|
1551
|
+
/* Foreground informational text and icons */
|
|
1800
1552
|
--status-informational: #5d92f5;
|
|
1801
|
-
/* Status/on-
|
|
1553
|
+
/* Status/on-error - Theme - BRAND */
|
|
1554
|
+
/* Foreground error text and icons */
|
|
1555
|
+
--status-on-error: #ffffff;
|
|
1556
|
+
/* Status/on-informational - Brand */
|
|
1557
|
+
/* Foreground informational text and icons */
|
|
1558
|
+
--status-on-informational: #ffffff;
|
|
1559
|
+
/* Status/on-success - Theme - BRAND */
|
|
1560
|
+
/* Foreground success icons and text */
|
|
1802
1561
|
--status-on-success: #141414;
|
|
1803
|
-
/* Status/
|
|
1562
|
+
/* Status/on-warning - Theme - BRAND */
|
|
1563
|
+
/* Foreground warning icons */
|
|
1564
|
+
--status-on-warning: #141414;
|
|
1565
|
+
/* Status/success - Theme - BRAND */
|
|
1566
|
+
/* Foreground success icons and text */
|
|
1804
1567
|
--status-success: #519f73;
|
|
1805
|
-
/* Status/warning - Theme -
|
|
1568
|
+
/* Status/warning - Theme - BRAND */
|
|
1569
|
+
/* Foreground warning icons */
|
|
1806
1570
|
--status-warning: #f8cd63;
|
|
1807
|
-
/* Stroke/Brand/brand-primary - Theme -
|
|
1571
|
+
/* Stroke/Brand/brand-primary - Theme - BRAND */
|
|
1572
|
+
/* Outline variant - decorative elements such as dividers */
|
|
1808
1573
|
--stroke-brand-primary: #7db67c;
|
|
1809
|
-
/* Stroke/Brand/brand-primary-depth - Theme -
|
|
1574
|
+
/* Stroke/Brand/brand-primary-depth - Theme - BRAND */
|
|
1575
|
+
/* Outline variant - decorative elements such as dividers */
|
|
1810
1576
|
--stroke-brand-primary-depth: #88bc88;
|
|
1811
|
-
/* Stroke/Brand/brand-secondary - Theme -
|
|
1577
|
+
/* Stroke/Brand/brand-secondary - Theme - BRAND */
|
|
1812
1578
|
--stroke-brand-secondary: #f0bcac;
|
|
1813
|
-
/* Stroke/Brand/brand-secondary-depth - Theme -
|
|
1579
|
+
/* Stroke/Brand/brand-secondary-depth - Theme - BRAND */
|
|
1814
1580
|
--stroke-brand-secondary-depth: #eba691;
|
|
1815
|
-
/* Stroke/Neutral/neutral-base - Theme -
|
|
1581
|
+
/* Stroke/Neutral/neutral-base - Theme - BRAND */
|
|
1582
|
+
/* For control components */
|
|
1816
1583
|
--stroke-neutral-base: #6b6b6b;
|
|
1817
|
-
/* Stroke/Neutral/disabled-dark -
|
|
1818
|
-
|
|
1819
|
-
|
|
1584
|
+
/* Stroke/Neutral/disabled-dark - Brand */
|
|
1585
|
+
/* Disabled outline separating the fill and surface background */
|
|
1586
|
+
--stroke-neutral-disabled-dark: #3d3d3d;
|
|
1587
|
+
/* Stroke/Neutral/disabled-light - Brand */
|
|
1588
|
+
/* Disabled outline separating the fill and surface background */
|
|
1820
1589
|
--stroke-neutral-disabled-light: #4d4d4d;
|
|
1821
|
-
/* Stroke/Neutral/focus -
|
|
1590
|
+
/* Stroke/Neutral/focus - Brand */
|
|
1591
|
+
/* Highlight focus element */
|
|
1822
1592
|
--stroke-neutral-focus: #ffffff;
|
|
1823
|
-
/* Stroke/Neutral/
|
|
1593
|
+
/* Stroke/Neutral/focus-on-inverse - Brand */
|
|
1594
|
+
/* Highlight focus element */
|
|
1595
|
+
--stroke-neutral-focus-on-inverse: #ffffff;
|
|
1596
|
+
/* Stroke/Neutral/neutral-high - Brand */
|
|
1824
1597
|
--stroke-neutral-high: #fafafa;
|
|
1825
|
-
/* Stroke/Neutral/neutral-
|
|
1826
|
-
|
|
1827
|
-
/* Stroke/Neutral/Interaction/disabled-dark - Theme - 3.0 */
|
|
1828
|
-
--stroke-neutral-interaction-disabled-dark: #b1c0d2;
|
|
1829
|
-
/* Stroke/Neutral/Interaction/disabled-light - Theme - 3.0 */
|
|
1830
|
-
--stroke-neutral-interaction-disabled-light: #323b49;
|
|
1831
|
-
/* Stroke/Neutral/Interaction/focus - Theme - 3.0 */
|
|
1832
|
-
--stroke-neutral-interaction-focus: #ffffff;
|
|
1833
|
-
/* Stroke/Neutral/Interactions/disabled-dark - Theme - Better Home & Garden */
|
|
1834
|
-
--stroke-neutral-interactions-disabled-dark: #424242;
|
|
1835
|
-
/* Stroke/Neutral/Interactions/disabled-light - Theme - Better Home & Garden */
|
|
1836
|
-
--stroke-neutral-interactions-disabled-light: #4d4d4d;
|
|
1837
|
-
/* Stroke/Neutral/Interactions/focus - Theme - Better Home & Garden */
|
|
1838
|
-
--stroke-neutral-interactions-focus: #ffffff;
|
|
1839
|
-
/* Stroke/Neutral/neutral-low - Theme - Better Home & Garden */
|
|
1598
|
+
/* Stroke/Neutral/neutral-low - Brand */
|
|
1599
|
+
/* Outline variant - decorative elements such as dividers */
|
|
1840
1600
|
--stroke-neutral-low: #4d4d4d;
|
|
1841
|
-
/*
|
|
1842
|
-
--stroke-neutral-low-contrast: #4d4d4d;
|
|
1843
|
-
/* Surface/Brand/primary - Theme - Better Home & Garden */
|
|
1601
|
+
/* Surface/Brand/primary - Theme - BRAND */
|
|
1844
1602
|
--surface-brand-primary: #7db67c;
|
|
1845
|
-
/* Surface/Brand/primary-highlight - Theme -
|
|
1603
|
+
/* Surface/Brand/primary-highlight - Theme - BRAND */
|
|
1846
1604
|
--surface-brand-primary-highlight: #0a220a;
|
|
1847
|
-
/* Surface/Brand/secondary - Theme -
|
|
1605
|
+
/* Surface/Brand/secondary - Theme - BRAND */
|
|
1848
1606
|
--surface-brand-secondary: #f0bcac;
|
|
1849
|
-
/* Surface/Brand/secondary-highlight - Theme -
|
|
1607
|
+
/* Surface/Brand/secondary-highlight - Theme - BRAND */
|
|
1850
1608
|
--surface-brand-secondary-highlight: #371b12;
|
|
1851
|
-
/* Surface/Neutral/
|
|
1852
|
-
|
|
1853
|
-
/* Surface/Neutral/Interactions/light-disabled - Theme - Better Home & Garden */
|
|
1854
|
-
--surface-neutral-interactions-light-disabled: #292929;
|
|
1855
|
-
/* Surface/Neutral/Interactions/skeleton - Theme - Better Home & Garden */
|
|
1856
|
-
--surface-neutral-interactions-skeleton: #333333;
|
|
1857
|
-
/* Surface/Neutral/inverse - Theme - Better Home & Garden */
|
|
1609
|
+
/* Surface/Neutral/inverse - Brand */
|
|
1610
|
+
/* Inverted. Use for toasts notification & snackbars */
|
|
1858
1611
|
--surface-neutral-inverse: #383838;
|
|
1859
|
-
/* Surface/Neutral/inverse-
|
|
1860
|
-
--surface-neutral-inverse-dark: #383838;
|
|
1861
|
-
/* Surface/Neutral/inverse-light - Theme - Better Home & Garden */
|
|
1612
|
+
/* Surface/Neutral/inverse-light - Theme - BRAND */
|
|
1862
1613
|
--surface-neutral-inverse-light: #575757;
|
|
1863
|
-
/* Surface/Neutral/
|
|
1864
|
-
--surface-neutral-skeleton: #333333;
|
|
1865
|
-
/* Surface/Neutral/T1-base - Theme - Better Home & Garden */
|
|
1614
|
+
/* Surface/Neutral/T1-base - Theme - BRAND */
|
|
1866
1615
|
--surface-neutral-t1-base: #1f1f1f;
|
|
1867
|
-
/* Surface/Neutral/T2-lowest - Theme -
|
|
1616
|
+
/* Surface/Neutral/T2-lowest - Theme - BRAND */
|
|
1868
1617
|
--surface-neutral-t2-lowest: #2e2e2e;
|
|
1869
|
-
/* Surface/Neutral/T3-low - Theme -
|
|
1618
|
+
/* Surface/Neutral/T3-low - Theme - BRAND */
|
|
1619
|
+
/* Navigations, app bar etc */
|
|
1870
1620
|
--surface-neutral-t3-low: #383838;
|
|
1871
|
-
/* Surface/Neutral/T4-high - Theme -
|
|
1872
|
-
|
|
1873
|
-
|
|
1621
|
+
/* Surface/Neutral/T4-high - Theme - BRAND */
|
|
1622
|
+
/* Navigations, app bar etc */
|
|
1623
|
+
--surface-neutral-t4-high: #7a7a7a;
|
|
1624
|
+
/* Surface/Neutral/transparent - Theme - BRAND */
|
|
1625
|
+
--surface-neutral-transparent: #ffffff00;
|
|
1626
|
+
/* Surface/Spectrum/blue - Theme - BRAND */
|
|
1874
1627
|
--surface-spectrum-blue: #0e2754;
|
|
1875
|
-
/* Surface/Spectrum/green - Theme -
|
|
1628
|
+
/* Surface/Spectrum/green - Theme - BRAND */
|
|
1876
1629
|
--surface-spectrum-green: #0d2f1c;
|
|
1877
|
-
/* Surface/Spectrum/lime - Theme -
|
|
1630
|
+
/* Surface/Spectrum/lime - Theme - BRAND */
|
|
1878
1631
|
--surface-spectrum-lime: #434712;
|
|
1879
|
-
/* Surface/Spectrum/magenta - Theme -
|
|
1632
|
+
/* Surface/Spectrum/magenta - Theme - BRAND */
|
|
1880
1633
|
--surface-spectrum-magenta: #45054e;
|
|
1881
|
-
/* Surface/Spectrum/orange - Theme -
|
|
1634
|
+
/* Surface/Spectrum/orange - Theme - BRAND */
|
|
1882
1635
|
--surface-spectrum-orange: #532201;
|
|
1883
|
-
/* Surface/Spectrum/pink - Theme -
|
|
1636
|
+
/* Surface/Spectrum/pink - Theme - BRAND */
|
|
1884
1637
|
--surface-spectrum-pink: #4c0c2d;
|
|
1885
|
-
/* Surface/Spectrum/purple - Theme -
|
|
1638
|
+
/* Surface/Spectrum/purple - Theme - BRAND */
|
|
1886
1639
|
--surface-spectrum-purple: #220053;
|
|
1887
|
-
/* Surface/Spectrum/red - Theme -
|
|
1640
|
+
/* Surface/Spectrum/red - Theme - BRAND */
|
|
1888
1641
|
--surface-spectrum-red: #4c141d;
|
|
1889
|
-
/* Surface/Spectrum/teal - Theme -
|
|
1642
|
+
/* Surface/Spectrum/teal - Theme - BRAND */
|
|
1890
1643
|
--surface-spectrum-teal: #012e2a;
|
|
1891
|
-
/* Surface/Spectrum/yellow - Theme -
|
|
1644
|
+
/* Surface/Spectrum/yellow - Theme - BRAND */
|
|
1892
1645
|
--surface-spectrum-yellow: #564210;
|
|
1893
1646
|
}
|