@compsych-ui-components/shared 7.0.0 → 7.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,221 +1,221 @@
1
- /* GRO brand theme */
2
- [data-theme="gro"] {
3
- --accent-primary-pd-primary: #075cba;
4
- --accent-primary-pd-on-primary: #ffffff;
5
- --accent-primary-pd-primary-container: #070f36;
6
- --accent-primary-pd-on-primary-container: #ffffff;
7
- --accent-primary-pd-on-primary-container-variant: #b9dcff;
8
- --accent-secondary-pd-secondary: #d67d00;
9
- --accent-secondary-pd-on-secondary: #ffffff;
10
- --accent-secondary-pd-secondary-container: #fdeed9;
11
- --accent-secondary-pd-on-secondary-container: #694007;
12
- --custom-success-pd-success: #278647;
13
- --custom-success-pd-on-success: #ffffff;
14
- --custom-success-pd-success-container: #c4e9d0;
15
- --custom-success-pd-on-success-container: #0a241b;
16
- --custom-warning-pd-warning: #d67d00;
17
- --custom-warning-pd-on-warning: #ffffff;
18
- --custom-warning-pd-warning-container: #fdeed9;
19
- --custom-warning-pd-on-warning-container: #694007;
20
- --custom-info-pd-info: #226cee;
21
- --custom-info-pd-on-info: #ffffff;
22
- --custom-info-pd-info-container: #daecff;
23
- --custom-info-pd-on-info-container: #162755;
24
- --error-pd-error: #d82727;
25
- --error-pd-on-error: #ffffff;
26
- --error-pd-error-container: #f7d4d4;
27
- --error-pd-on-error-container: #570f0f;
28
- --surface-surface-pd-surface: #f3f4f6;
29
- --surface-surface-pd-on-surface: #1b1d22;
30
- --surface-surface-pd-on-surface-variant: #565f6c;
31
- --surface-surface-containers-pd-surface-container-lowest: #ffffff;
32
- --surface-surface-containers-pd-surface-container-low: #f9fafb;
33
- --surface-surface-containers-pd-surface-container: #f3f4f6;
34
- --surface-surface-containers-pd-surface-container-high: #eceeef;
35
- --surface-surface-containers-pd-surface-container-highest: #e6e8ea;
36
- --surface-inverse-pd-inverse-surface: #565f6c;
37
- --surface-inverse-pd-inverse-on-surface: #ffffff;
38
- --surface-inverse-pd-inverse-primary: #b9dcff;
39
- --outline-pd-outline: #ebecf0;
40
- --outline-pd-outline-variant: #d7dbe0;
41
- --outline-pd-outline-fixed: #8a96a6;
42
- --outline-pd-outline-inverse: rgba(255, 255, 255, 0.4);
43
- --add-on-primary-fixed-pd-primary-fixed: #82b1ff;
44
- --add-on-primary-fixed-pd-primary-fixed-dim: #e3f2fd;
45
- --add-on-primary-fixed-pd-on-primary-fixed: #075cba;
46
- --add-on-primary-fixed-pd-on-primary-fixed-variant: #4285f4;
47
- --add-on-secondary-fixed-pd-secondary-fixed: #d67d00;
48
- --add-on-secondary-fixed-pd-secondary-fixed-dim: #f3ac49;
49
- --add-on-secondary-fixed-pd-on-secondary-fixed: #f9d8a9;
50
- --add-on-secondary-fixed-pd-on-secondary-fixed-variant: #3a2304;
51
- --add-on-add-on-surfaces-pd-surface-dim: #eceeef;
52
- --add-on-add-on-surfaces-pd-surface-bright: #ffffff;
53
- --chart-pd-chart-color-1: #b9dcff;
54
- --chart-pd-chart-color-2: #82b1ff;
55
- --chart-pd-chart-color-3: #4285f4;
56
- --chart-pd-chart-color-4: #075cba;
57
- --chart-pd-chart-color-5: #062e6f;
58
- --chart-pd-chart-color-6: #061545;
59
- --chart-pd-chart-color-7: #070f36;
60
- --chart-pd-chart-color-8: #050a24;
61
- --chart-pd-chart-inactive: #eceeef;
62
- --transparent-neutral-pd-white-10: rgba(255, 255, 255, 0.1);
63
- --transparent-neutral-pd-white-20: rgba(255, 255, 255, 0.2);
64
- --transparent-neutral-pd-white-30: rgba(255, 255, 255, 0.3);
65
- --transparent-neutral-pd-white-40: rgba(255, 255, 255, 0.4);
66
- --transparent-neutral-pd-white-50: rgba(255, 255, 255, 0.5);
67
- --transparent-neutral-pd-white-80: rgba(255, 255, 255, 0.8);
68
- --transparent-neutral-pd-black-10: rgba(0, 0, 0, 0.1);
69
- --transparent-neutral-pd-black-20: rgba(0, 0, 0, 0.2);
70
- --transparent-neutral-pd-black-30: rgba(0, 0, 0, 0.3);
71
- --transparent-neutral-pd-black-40: rgba(0, 0, 0, 0.4);
72
- --transparent-neutral-pd-black-50: rgba(0, 0, 0, 0.5);
73
- --transparent-neutral-pd-black-80: rgba(0, 0, 0, 0.8);
74
- --transparent-primary-pd-primary-08: rgba(7, 92, 186, 0.08);
75
- --transparent-primary-pd-primary-20: rgba(7, 92, 186, 0.2);
76
- --transparent-secondary-pd-secondary-08: rgba(214, 125, 0, 0.08);
77
- --transparent-secondary-pd-secondary-20: rgba(214, 125, 0, 0.2);
78
- --display-large-pd-font-family: 'google sans', sans-serif;
79
- --display-large-pd-font-weight: normal;
80
- --display-large-pd-font-size: 5rem;
81
- --display-large-pd-line-height: 5rem;
82
- --display-large-pd-tracking: -0.15rem;
83
- --display-large-pd-font-weight-emphasized: 500;
84
- --display-medium-pd-font-family: 'google sans', sans-serif;
85
- --display-medium-pd-font-weight: normal;
86
- --display-medium-pd-font-size: 4.5rem;
87
- --display-medium-pd-line-height: 4.95rem;
88
- --display-medium-pd-tracking: -0.09rem;
89
- --display-medium-pd-font-weight-emphasized: 500;
90
- --display-small-pd-font-family: 'google sans', sans-serif;
91
- --display-small-pd-font-weight: normal;
92
- --display-small-pd-font-size: 4rem;
93
- --display-small-pd-line-height: 4.8rem;
94
- --display-small-pd-tracking: -0.04rem;
95
- --display-small-pd-font-weight-emphasized: 500;
96
- --headline-large-pd-font-family: 'google sans', sans-serif;
97
- --headline-large-pd-font-weight: normal;
98
- --headline-large-pd-font-size: 3rem;
99
- --headline-large-pd-line-height: 3.6rem;
100
- --headline-large-pd-tracking: -0.03rem;
101
- --headline-large-pd-font-weight-emphasized: 500;
102
- --headline-medium-pd-font-family: 'google sans', sans-serif;
103
- --headline-medium-pd-font-weight: normal;
104
- --headline-medium-pd-font-size: 2.5rem;
105
- --headline-medium-pd-line-height: 3rem;
106
- --headline-medium-pd-tracking: 0;
107
- --headline-medium-pd-font-weight-emphasized: 500;
108
- --headline-small-pd-font-family: 'google sans', sans-serif;
109
- --headline-small-pd-font-weight: normal;
110
- --headline-small-pd-font-size: 2rem;
111
- --headline-small-pd-line-height: 2.4rem;
112
- --headline-small-pd-tracking: 0;
113
- --headline-small-pd-font-weight-emphasized: 500;
114
- --title-large-pd-font-family: 'google sans', sans-serif;
115
- --title-large-pd-font-weight: normal;
116
- --title-large-pd-font-size: 1.75rem;
117
- --title-large-pd-line-height: 2.275rem;
118
- --title-large-pd-tracking: 0;
119
- --title-large-pd-font-weight-emphasized: 500;
120
- --title-medium-pd-font-family: 'google sans', sans-serif;
121
- --title-medium-pd-font-weight: normal;
122
- --title-medium-pd-font-size: 1.5rem;
123
- --title-medium-pd-line-height: 1.95rem;
124
- --title-medium-pd-tracking: 0;
125
- --title-medium-pd-font-weight-emphasized: 500;
126
- --title-small-pd-font-family: 'google sans', sans-serif;
127
- --title-small-pd-font-weight: normal;
128
- --title-small-pd-font-size: 1.25rem;
129
- --title-small-pd-line-height: 1.75rem;
130
- --title-small-pd-tracking: 0;
131
- --title-small-pd-font-weight-emphasized: 500;
132
- --body-large-pd-font-family: 'google sans', sans-serif;
133
- --body-large-pd-font-weight: normal;
134
- --body-large-pd-font-size: 1.25rem;
135
- --body-large-pd-line-height: 1.875rem;
136
- --body-large-pd-tracking: 0;
137
- --body-large-pd-font-weight-emphasized: 500;
138
- --body-medium-pd-font-family: 'google sans', sans-serif;
139
- --body-medium-pd-font-weight: normal;
140
- --body-medium-pd-font-size: 1rem;
141
- --body-medium-pd-line-height: 1.5rem;
142
- --body-medium-pd-tracking: 0;
143
- --body-medium-pd-font-weight-emphasized: 500;
144
- --body-small-pd-font-family: 'google sans', sans-serif;
145
- --body-small-pd-font-weight: normal;
146
- --body-small-pd-font-size: 0.875rem;
147
- --body-small-pd-line-height: 1.25rem;
148
- --body-small-pd-tracking: 0;
149
- --body-small-pd-font-weight-emphasized: 500;
150
- --label-large-pd-font-family: 'google sans', sans-serif;
151
- --label-large-pd-font-weight: normal;
152
- --label-large-pd-font-size: 1rem;
153
- --label-large-pd-line-height: 1.4rem;
154
- --label-large-pd-tracking: 0;
155
- --label-large-pd-font-weight-emphasized: 500;
156
- --label-medium-pd-font-family: 'google sans', sans-serif;
157
- --label-medium-pd-font-weight: normal;
158
- --label-medium-pd-font-size: 0.875rem;
159
- --label-medium-pd-line-height: 1.25rem;
160
- --label-medium-pd-tracking: 0.00438rem;
161
- --label-medium-pd-font-weight-emphasized: 500;
162
- --label-small-pd-font-family: 'google sans', sans-serif;
163
- --label-small-pd-font-weight: normal;
164
- --label-small-pd-font-size: 0.75rem;
165
- --label-small-pd-line-height: 1.125rem;
166
- --label-small-pd-tracking: 0.0075rem;
167
- --label-small-pd-font-weight-emphasized: 500;
168
- --spacing-margin-pd-margin-none: 0;
169
- --spacing-margin-pd-margin-sm: 1rem;
170
- --spacing-margin-pd-margin-md: 1.5rem;
171
- --spacing-margin-pd-margin-lg: 2rem;
172
- --spacing-margin-pd-margin-xl: 2.5rem;
173
- --spacing-margin-pd-margin-2xl: 5rem;
174
- --spacing-spacer-pd-spacer-xs: 0.5rem;
175
- --spacing-spacer-pd-spacer-sm: 1rem;
176
- --spacing-spacer-pd-spacer-md: 1.5rem;
177
- --spacing-spacer-pd-spacer-lg: 2rem;
178
- --spacing-padding-pd-neg-padding-24: -1.5rem;
179
- --spacing-padding-pd-neg-padding-16: -1rem;
180
- --spacing-padding-pd-padding-0: 0;
181
- --spacing-padding-pd-padding-2: 0.125rem;
182
- --spacing-padding-pd-padding-4: 0.25rem;
183
- --spacing-padding-pd-padding-6: 0.375rem;
184
- --spacing-padding-pd-padding-8: 0.5rem;
185
- --spacing-padding-pd-padding-12: 0.75rem;
186
- --spacing-padding-pd-padding-16: 1rem;
187
- --spacing-padding-pd-padding-20: 1.25rem;
188
- --spacing-padding-pd-padding-24: 1.5rem;
189
- --spacing-padding-pd-padding-32: 2rem;
190
- --spacing-padding-pd-padding-40: 2.5rem;
191
- --spacing-padding-pd-padding-48: 3rem;
192
- --spacing-padding-pd-padding-64: 4rem;
193
- --spacing-padding-pd-padding-72: 4.5rem;
194
- --spacing-padding-pd-padding-80: 5rem;
195
- --border-radius-pd-radius-none: 0;
196
- --border-radius-pd-radius-xs: 0.25rem;
197
- --border-radius-pd-radius-sm: 0.5rem;
198
- --border-radius-pd-radius-md: 0.75rem;
199
- --border-radius-pd-radius-lg: 1rem;
200
- --border-radius-pd-radius-lg-increased: 1.25rem;
201
- --border-radius-pd-radius-xl: 1.5rem;
202
- --border-radius-pd-radius-xl-increased: 2rem;
203
- --border-radius-pd-radius-full: 62.4375rem;
204
- --border-width-pd-stroke-thin: 0.0625rem;
205
- --border-width-pd-stroke-medium: 0.09375rem;
206
- --border-width-pd-stroke-thick: 0.125rem;
207
- --border-width-pd-stroke-heavier: 0.1875rem;
208
- --border-width-pd-stroke-bold: 0.25rem;
209
- --pd-size-xxs: 0.75rem;
210
- --pd-size-xs: 1rem;
211
- --pd-size-sm: 1.25rem;
212
- --pd-size-md: 1.5rem;
213
- --pd-size-lg: 2rem;
214
- --pd-size-xl: 3rem;
215
- --pd-hover: 0.5rem;
216
- --pd-focused: 0.75rem;
217
- --pd-pressed: 0.625rem;
218
- --pd-disabled-container: 3rem;
219
- --pd-disabled-content: 4rem;
220
- --pd-scrim: 0.625rem;
221
- }
1
+ /* GRO brand theme */
2
+ [data-theme="gro"] {
3
+ --accent-primary-pd-primary: #075cba;
4
+ --accent-primary-pd-on-primary: #ffffff;
5
+ --accent-primary-pd-primary-container: #070f36;
6
+ --accent-primary-pd-on-primary-container: #ffffff;
7
+ --accent-primary-pd-on-primary-container-variant: #b9dcff;
8
+ --accent-secondary-pd-secondary: #d67d00;
9
+ --accent-secondary-pd-on-secondary: #ffffff;
10
+ --accent-secondary-pd-secondary-container: #fdeed9;
11
+ --accent-secondary-pd-on-secondary-container: #694007;
12
+ --custom-success-pd-success: #278647;
13
+ --custom-success-pd-on-success: #ffffff;
14
+ --custom-success-pd-success-container: #c4e9d0;
15
+ --custom-success-pd-on-success-container: #0a241b;
16
+ --custom-warning-pd-warning: #d67d00;
17
+ --custom-warning-pd-on-warning: #ffffff;
18
+ --custom-warning-pd-warning-container: #fdeed9;
19
+ --custom-warning-pd-on-warning-container: #694007;
20
+ --custom-info-pd-info: #226cee;
21
+ --custom-info-pd-on-info: #ffffff;
22
+ --custom-info-pd-info-container: #daecff;
23
+ --custom-info-pd-on-info-container: #162755;
24
+ --error-pd-error: #d82727;
25
+ --error-pd-on-error: #ffffff;
26
+ --error-pd-error-container: #f7d4d4;
27
+ --error-pd-on-error-container: #570f0f;
28
+ --surface-surface-pd-surface: #f3f4f6;
29
+ --surface-surface-pd-on-surface: #1b1d22;
30
+ --surface-surface-pd-on-surface-variant: #565f6c;
31
+ --surface-surface-containers-pd-surface-container-lowest: #ffffff;
32
+ --surface-surface-containers-pd-surface-container-low: #f9fafb;
33
+ --surface-surface-containers-pd-surface-container: #f3f4f6;
34
+ --surface-surface-containers-pd-surface-container-high: #eceeef;
35
+ --surface-surface-containers-pd-surface-container-highest: #e6e8ea;
36
+ --surface-inverse-pd-inverse-surface: #565f6c;
37
+ --surface-inverse-pd-inverse-on-surface: #ffffff;
38
+ --surface-inverse-pd-inverse-primary: #b9dcff;
39
+ --outline-pd-outline: #ebecf0;
40
+ --outline-pd-outline-variant: #d7dbe0;
41
+ --outline-pd-outline-fixed: #8a96a6;
42
+ --outline-pd-outline-inverse: rgba(255, 255, 255, 0.4);
43
+ --add-on-primary-fixed-pd-primary-fixed: #82b1ff;
44
+ --add-on-primary-fixed-pd-primary-fixed-dim: #e3f2fd;
45
+ --add-on-primary-fixed-pd-on-primary-fixed: #075cba;
46
+ --add-on-primary-fixed-pd-on-primary-fixed-variant: #4285f4;
47
+ --add-on-secondary-fixed-pd-secondary-fixed: #d67d00;
48
+ --add-on-secondary-fixed-pd-secondary-fixed-dim: #f3ac49;
49
+ --add-on-secondary-fixed-pd-on-secondary-fixed: #f9d8a9;
50
+ --add-on-secondary-fixed-pd-on-secondary-fixed-variant: #3a2304;
51
+ --add-on-add-on-surfaces-pd-surface-dim: #eceeef;
52
+ --add-on-add-on-surfaces-pd-surface-bright: #ffffff;
53
+ --chart-pd-chart-color-1: #b9dcff;
54
+ --chart-pd-chart-color-2: #82b1ff;
55
+ --chart-pd-chart-color-3: #4285f4;
56
+ --chart-pd-chart-color-4: #075cba;
57
+ --chart-pd-chart-color-5: #062e6f;
58
+ --chart-pd-chart-color-6: #061545;
59
+ --chart-pd-chart-color-7: #070f36;
60
+ --chart-pd-chart-color-8: #050a24;
61
+ --chart-pd-chart-inactive: #eceeef;
62
+ --transparent-neutral-pd-white-10: rgba(255, 255, 255, 0.1);
63
+ --transparent-neutral-pd-white-20: rgba(255, 255, 255, 0.2);
64
+ --transparent-neutral-pd-white-30: rgba(255, 255, 255, 0.3);
65
+ --transparent-neutral-pd-white-40: rgba(255, 255, 255, 0.4);
66
+ --transparent-neutral-pd-white-50: rgba(255, 255, 255, 0.5);
67
+ --transparent-neutral-pd-white-80: rgba(255, 255, 255, 0.8);
68
+ --transparent-neutral-pd-black-10: rgba(0, 0, 0, 0.1);
69
+ --transparent-neutral-pd-black-20: rgba(0, 0, 0, 0.2);
70
+ --transparent-neutral-pd-black-30: rgba(0, 0, 0, 0.3);
71
+ --transparent-neutral-pd-black-40: rgba(0, 0, 0, 0.4);
72
+ --transparent-neutral-pd-black-50: rgba(0, 0, 0, 0.5);
73
+ --transparent-neutral-pd-black-80: rgba(0, 0, 0, 0.8);
74
+ --transparent-primary-pd-primary-08: rgba(7, 92, 186, 0.08);
75
+ --transparent-primary-pd-primary-20: rgba(7, 92, 186, 0.2);
76
+ --transparent-secondary-pd-secondary-08: rgba(214, 125, 0, 0.08);
77
+ --transparent-secondary-pd-secondary-20: rgba(214, 125, 0, 0.2);
78
+ --display-large-pd-font-family: 'google sans', sans-serif;
79
+ --display-large-pd-font-weight: normal;
80
+ --display-large-pd-font-size: 80px;
81
+ --display-large-pd-line-height: 80px;
82
+ --display-large-pd-tracking: -2px;
83
+ --display-large-pd-font-weight-emphasized: 500;
84
+ --display-medium-pd-font-family: 'google sans', sans-serif;
85
+ --display-medium-pd-font-weight: normal;
86
+ --display-medium-pd-font-size: 72px;
87
+ --display-medium-pd-line-height: 79px;
88
+ --display-medium-pd-tracking: -1px;
89
+ --display-medium-pd-font-weight-emphasized: 500;
90
+ --display-small-pd-font-family: 'google sans', sans-serif;
91
+ --display-small-pd-font-weight: normal;
92
+ --display-small-pd-font-size: 64px;
93
+ --display-small-pd-line-height: 77px;
94
+ --display-small-pd-tracking: -1px;
95
+ --display-small-pd-font-weight-emphasized: 500;
96
+ --headline-large-pd-font-family: 'google sans', sans-serif;
97
+ --headline-large-pd-font-weight: normal;
98
+ --headline-large-pd-font-size: 48px;
99
+ --headline-large-pd-line-height: 58px;
100
+ --headline-large-pd-tracking: 0px;
101
+ --headline-large-pd-font-weight-emphasized: 500;
102
+ --headline-medium-pd-font-family: 'google sans', sans-serif;
103
+ --headline-medium-pd-font-weight: normal;
104
+ --headline-medium-pd-font-size: 40px;
105
+ --headline-medium-pd-line-height: 48px;
106
+ --headline-medium-pd-tracking: 0;
107
+ --headline-medium-pd-font-weight-emphasized: 500;
108
+ --headline-small-pd-font-family: 'google sans', sans-serif;
109
+ --headline-small-pd-font-weight: normal;
110
+ --headline-small-pd-font-size: 32px;
111
+ --headline-small-pd-line-height: 38px;
112
+ --headline-small-pd-tracking: 0;
113
+ --headline-small-pd-font-weight-emphasized: 500;
114
+ --title-large-pd-font-family: 'google sans', sans-serif;
115
+ --title-large-pd-font-weight: normal;
116
+ --title-large-pd-font-size: 28px;
117
+ --title-large-pd-line-height: 36px;
118
+ --title-large-pd-tracking: 0;
119
+ --title-large-pd-font-weight-emphasized: 500;
120
+ --title-medium-pd-font-family: 'google sans', sans-serif;
121
+ --title-medium-pd-font-weight: normal;
122
+ --title-medium-pd-font-size: 24px;
123
+ --title-medium-pd-line-height: 31px;
124
+ --title-medium-pd-tracking: 0;
125
+ --title-medium-pd-font-weight-emphasized: 500;
126
+ --title-small-pd-font-family: 'google sans', sans-serif;
127
+ --title-small-pd-font-weight: normal;
128
+ --title-small-pd-font-size: 20px;
129
+ --title-small-pd-line-height: 28px;
130
+ --title-small-pd-tracking: 0;
131
+ --title-small-pd-font-weight-emphasized: 500;
132
+ --body-large-pd-font-family: 'google sans', sans-serif;
133
+ --body-large-pd-font-weight: normal;
134
+ --body-large-pd-font-size: 20px;
135
+ --body-large-pd-line-height: 30px;
136
+ --body-large-pd-tracking: 0;
137
+ --body-large-pd-font-weight-emphasized: 500;
138
+ --body-medium-pd-font-family: 'google sans', sans-serif;
139
+ --body-medium-pd-font-weight: normal;
140
+ --body-medium-pd-font-size: 16px;
141
+ --body-medium-pd-line-height: 24px;
142
+ --body-medium-pd-tracking: 0;
143
+ --body-medium-pd-font-weight-emphasized: 500;
144
+ --body-small-pd-font-family: 'google sans', sans-serif;
145
+ --body-small-pd-font-weight: normal;
146
+ --body-small-pd-font-size: 14px;
147
+ --body-small-pd-line-height: 20px;
148
+ --body-small-pd-tracking: 0;
149
+ --body-small-pd-font-weight-emphasized: 500;
150
+ --label-large-pd-font-family: 'google sans', sans-serif;
151
+ --label-large-pd-font-weight: normal;
152
+ --label-large-pd-font-size: 16px;
153
+ --label-large-pd-line-height: 22px;
154
+ --label-large-pd-tracking: 0;
155
+ --label-large-pd-font-weight-emphasized: 500;
156
+ --label-medium-pd-font-family: 'google sans', sans-serif;
157
+ --label-medium-pd-font-weight: normal;
158
+ --label-medium-pd-font-size: 14px;
159
+ --label-medium-pd-line-height: 20px;
160
+ --label-medium-pd-tracking: 0px;
161
+ --label-medium-pd-font-weight-emphasized: 500;
162
+ --label-small-pd-font-family: 'google sans', sans-serif;
163
+ --label-small-pd-font-weight: normal;
164
+ --label-small-pd-font-size: 12px;
165
+ --label-small-pd-line-height: 18px;
166
+ --label-small-pd-tracking: 0px;
167
+ --label-small-pd-font-weight-emphasized: 500;
168
+ --spacing-margin-pd-margin-none: 0;
169
+ --spacing-margin-pd-margin-sm: 16px;
170
+ --spacing-margin-pd-margin-md: 24px;
171
+ --spacing-margin-pd-margin-lg: 32px;
172
+ --spacing-margin-pd-margin-xl: 40px;
173
+ --spacing-margin-pd-margin-2xl: 80px;
174
+ --spacing-spacer-pd-spacer-xs: 8px;
175
+ --spacing-spacer-pd-spacer-sm: 16px;
176
+ --spacing-spacer-pd-spacer-md: 24px;
177
+ --spacing-spacer-pd-spacer-lg: 32px;
178
+ --spacing-padding-pd-neg-padding-24: -24px;
179
+ --spacing-padding-pd-neg-padding-16: -16px;
180
+ --spacing-padding-pd-padding-0: 0;
181
+ --spacing-padding-pd-padding-2: 2px;
182
+ --spacing-padding-pd-padding-4: 4px;
183
+ --spacing-padding-pd-padding-6: 6px;
184
+ --spacing-padding-pd-padding-8: 8px;
185
+ --spacing-padding-pd-padding-12: 12px;
186
+ --spacing-padding-pd-padding-16: 16px;
187
+ --spacing-padding-pd-padding-20: 20px;
188
+ --spacing-padding-pd-padding-24: 24px;
189
+ --spacing-padding-pd-padding-32: 32px;
190
+ --spacing-padding-pd-padding-40: 40px;
191
+ --spacing-padding-pd-padding-48: 48px;
192
+ --spacing-padding-pd-padding-64: 64px;
193
+ --spacing-padding-pd-padding-72: 72px;
194
+ --spacing-padding-pd-padding-80: 80px;
195
+ --border-radius-pd-radius-none: 0;
196
+ --border-radius-pd-radius-xs: 4px;
197
+ --border-radius-pd-radius-sm: 8px;
198
+ --border-radius-pd-radius-md: 12px;
199
+ --border-radius-pd-radius-lg: 16px;
200
+ --border-radius-pd-radius-lg-increased: 20px;
201
+ --border-radius-pd-radius-xl: 24px;
202
+ --border-radius-pd-radius-xl-increased: 32px;
203
+ --border-radius-pd-radius-full: 999px;
204
+ --border-width-pd-stroke-thin: 1px;
205
+ --border-width-pd-stroke-medium: 2px;
206
+ --border-width-pd-stroke-thick: 2px;
207
+ --border-width-pd-stroke-heavier: 3px;
208
+ --border-width-pd-stroke-bold: 4px;
209
+ --pd-size-xxs: 12px;
210
+ --pd-size-xs: 16px;
211
+ --pd-size-sm: 20px;
212
+ --pd-size-md: 24px;
213
+ --pd-size-lg: 32px;
214
+ --pd-size-xl: 48px;
215
+ --pd-hover: 8px;
216
+ --pd-focused: 12px;
217
+ --pd-pressed: 10px;
218
+ --pd-disabled-container: 48px;
219
+ --pd-disabled-content: 64px;
220
+ --pd-scrim: 10px;
221
+ }