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