@swisspost/design-system-tokens 9.0.0-next.10

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.
@@ -0,0 +1,793 @@
1
+
2
+ // Do not edit manually
3
+ // This file was generated by the swisspost/design-system-tokens package
4
+ // Mon, 13 Jan 2025 11:05:26 GMT
5
+
6
+ $post-accordion: (
7
+ post-accordion-header-padding-block-closed: var(--post-device-spacing-padding-19),
8
+ post-accordion-header-padding-block-open: var(--post-device-spacing-padding-19),
9
+ post-accordion-header-padding-inline: var(--post-device-spacing-padding-5),
10
+ post-accordion-header-content-gap-inline: var(--post-device-spacing-gap-7),
11
+ post-accordion-header-logo-size: var(--post-device-sizing-logo-1),
12
+ post-accordion-header-font-size: var(--post-device-font-size-5),
13
+ post-accordion-header-border-open: var(--post-core-color-colorless),
14
+ post-accordion-border-bottom-style: var(--post-core-border-style-solid),
15
+ post-accordion-border-bottom-width: var(--post-device-border-width-default),
16
+ post-accordion-border-top-style: var(--post-core-border-style-solid),
17
+ post-accordion-group-border-top-width: var(--post-device-border-width-default),
18
+ post-accordion-content-padding-block-start: var(--post-device-spacing-padding-15),
19
+ post-accordion-content-padding-block-end: var(--post-device-spacing-padding-block-25),
20
+ post-accordion-content-padding-inline: var(--post-device-spacing-padding-5),
21
+ post-accordion-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
22
+ post-accordion-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke),
23
+ post-accordion-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
24
+ post-accordion-hover-border: var(--post-scheme-color-interactive-primary-hover-stroke),
25
+ post-accordion-icon-size: var(--post-core-dimension-24),
26
+ );
27
+
28
+ $post-app-store-badge: (
29
+ post-app-store-google-width: var(--post-device-sizing-interactive-button-appstore-width-google),
30
+ post-app-store-apple-width: var(--post-device-sizing-interactive-button-appstore-width-apple),
31
+ post-app-store-height: var(--post-device-sizing-interactive-button-height-5),
32
+ post-app-store-border-radius: var(--post-device-border-radius-1),
33
+ );
34
+
35
+ $post-assist: (
36
+ post-assist-gap: var(--post-device-spacing-gap-1),
37
+ post-assist-padding-block: var(--post-device-spacing-padding-block-5),
38
+ post-assist-padding-inline: var(--post-device-spacing-padding-2),
39
+ post-assist-font-size: var(--post-device-font-size-9),
40
+ post-assist-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
41
+ post-assist-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg1),
42
+ post-hint-spacing-block: var(--post-core-dimension-6),
43
+ );
44
+
45
+ $post-avatar: (
46
+ post-avatar-size: var(--post-device-sizing-interactive-icon-size3),
47
+ post-avatar-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg2),
48
+ post-avatar-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg3),
49
+ post-avatar-border-width: var(--post-device-border-width-default),
50
+ post-avatar-border-radius: var(--post-device-border-radius-round),
51
+ post-avatar-font-size: var(--post-device-font-size-8),
52
+ post-avatar-image-hover-opacity: var(--post-core-color-sandgrey-alpha-lightsand-50),
53
+ post-avatar-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg2),
54
+ post-avatar-border-color: var(--post-scheme-color-interactive-primary-enabled-stroke3),
55
+ post-avatar-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg3),
56
+ );
57
+
58
+ $post-badge: (
59
+ post-badge-bg: var(--post-scheme-color-notification-badge-bg),
60
+ post-badge-fg: var(--post-scheme-color-notification-badge-fg),
61
+ post-badge-stroke: var(--post-scheme-color-notification-badge-stroke),
62
+ post-badge-height-l: var(--post-device-sizing-notification-1),
63
+ post-badge-height-m: var(--post-device-sizing-notification-2),
64
+ post-badge-height-s: var(--post-device-sizing-notification-3),
65
+ post-badge-padding-inline-l: var(--post-device-spacing-padding-7),
66
+ post-badge-padding-inline-m: var(--post-device-spacing-padding-8),
67
+ );
68
+
69
+ $post-banner: (
70
+ post-banner-padding: var(--post-device-spacing-padding-10),
71
+ post-banner-actions-margin-top: var(--post-device-spacing-padding-block-10),
72
+ post-banner-actions-gap: var(--post-device-spacing-gap-1),
73
+ post-banner-gap: var(--post-device-spacing-gap-inline-6),
74
+ post-banner-content-gap: var(--post-device-spacing-gap-block-1),
75
+ post-banner-icon-size: var(--post-device-sizing-notification-icon-2),
76
+ post-banner-info-bg: var(--post-scheme-color-interactive-notification-info-bg),
77
+ post-banner-info-border-color: var(--post-scheme-color-interactive-notification-info-stroke),
78
+ post-banner-info-icon-color: var(--post-scheme-color-interactive-notification-info-icon),
79
+ post-banner-info-bg-scheme: var(--post-core-bg-scheme-light),
80
+ post-banner-success-bg: var(--post-scheme-color-interactive-notification-success-bg),
81
+ post-banner-success-border-color: var(--post-scheme-color-interactive-notification-success-stroke),
82
+ post-banner-success-icon-color: var(--post-scheme-color-interactive-notification-success-icon),
83
+ post-banner-success-bg-scheme: var(--post-core-bg-scheme-light),
84
+ post-banner-warning-bg: var(--post-scheme-color-interactive-notification-warning-bg),
85
+ post-banner-warning-border-color: var(--post-scheme-color-interactive-notification-warning-stroke),
86
+ post-banner-warning-icon-color: var(--post-scheme-color-interactive-notification-warning-icon),
87
+ post-banner-warning-bg-scheme: var(--post-core-bg-scheme-light),
88
+ post-banner-error-bg: var(--post-scheme-color-interactive-notification-error-bg),
89
+ post-banner-error-border-color: var(--post-scheme-color-interactive-notification-error-stroke),
90
+ post-banner-error-icon-color: var(--post-scheme-color-interactive-notification-error-icon),
91
+ post-banner-error-bg-scheme: var(--post-core-bg-scheme-light),
92
+ post-banner-border-width: var(--post-device-border-width-default),
93
+ post-banner-border-radius: var(--post-device-border-radius-2),
94
+ post-banner-neutral-bg: var(--post-scheme-color-signal-neutral),
95
+ post-banner-neutral-border-color: var(--post-scheme-color-signal-neutral-dark),
96
+ post-banner-neutral-icon-color: var(--post-scheme-color-signal-neutral-dark),
97
+ post-banner-neutral-bg-scheme: var(--post-core-bg-scheme-light),
98
+ post-banner-border-style: var(--post-core-border-style-solid),
99
+ post-banner-elevation: var(--post-device-elevation-100),
100
+ );
101
+
102
+ $post-blockquote: (
103
+ post-blockquote-border-width-left: var(--post-device-border-width-quote),
104
+ post-blockquote-border-left-color: var(--post-scheme-color-surface-default-stroke),
105
+ post-blockquote-border-left-style: var(--post-core-border-style-solid),
106
+ post-blockquote-margin-block: var(--post-device-spacing-margin-5),
107
+ post-blockquote-margin-inline: var(--post-device-spacing-margin-6),
108
+ post-blockquote-padding-inline-start: var(--post-core-dimension-20),
109
+ post-blockquote-padding-inline-end: var(--post-core-dimension-24),
110
+ post-blockquote-gap-inline: var(--post-core-dimension-16),
111
+ post-blockquote-font-weight: var(--post-device-font-weight-bold),
112
+ post-blockquote-font-size: var(--post-device-font-size-5),
113
+ );
114
+
115
+ $post-breadcrumb: (
116
+ post-breadcrumb-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
117
+ post-breadcrumb-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
118
+ post-breadcrumb-selected-fg: var(--post-scheme-color-interactive-primary-selected-fg1),
119
+ post-breadcrumb-padding-block-text: var(--post-device-spacing-padding-block-7),
120
+ post-breadcrumb-padding-block-icon-home: var(--post-device-spacing-padding-4),
121
+ post-breadcrumb-padding-block-icon-link: var(--post-core-dimension-4),
122
+ post-breadcrumb-padding-inline-icon-home: var(--post-device-spacing-padding-4),
123
+ post-breadcrumb-padding-inline-icon-link: var(--post-core-dimension-4),
124
+ post-breadcrumb-gap-inline-outer: var(--post-device-spacing-gap-inline-4),
125
+ post-breadcrumb-gap-inline-inner: var(--post-device-spacing-gap-inline-5),
126
+ post-breadcrumb-selected-font-weight: var(--post-device-font-weight-bold),
127
+ post-breadcrumb-link-enabled-text-decoration: var(--post-core-text-decoration-none),
128
+ post-breadcrumb-link-hover-text-decoration: var(--post-core-text-decoration-underline),
129
+ post-breadcrumb-link-selected-text-decoration: var(--post-core-text-decoration-none),
130
+ post-breadcrumb-icon-size: var(--post-core-dimension-24),
131
+ );
132
+
133
+ $post-button: (
134
+ post-button-gap-block-1: var(--post-device-spacing-gap-4),
135
+ post-button-gap-block-2: var(--post-device-spacing-gap-block-2),
136
+ post-button-gap-inline-switch: var(--post-device-spacing-gap-inline-3),
137
+ post-button-large-gap-inline: var(--post-device-spacing-gap-inline-1),
138
+ post-button-large-height: var(--post-device-sizing-interactive-button-height-2),
139
+ post-button-large-padding-inline: var(--post-device-spacing-padding-inline-5),
140
+ post-button-large-icon: var(--post-device-sizing-interactive-button-icon-3),
141
+ post-button-padding-block-icon-inner: var(--post-device-spacing-padding-1),
142
+ post-button-padding-inline-icon-inner: var(--post-device-spacing-padding-1),
143
+ post-button-primary-enabled-fg: var(--post-scheme-color-interactive-button-primary-enabled-fg),
144
+ post-button-primary-enabled-bg: var(--post-scheme-color-interactive-button-primary-enabled-bg),
145
+ post-button-primary-enabled-stroke: var(--post-scheme-color-interactive-button-primary-enabled-stroke),
146
+ post-button-primary-hover-fg: var(--post-scheme-color-interactive-button-primary-hover-fg),
147
+ post-button-primary-hover-bg: var(--post-scheme-color-interactive-button-primary-hover-bg),
148
+ post-button-primary-hover-stroke: var(--post-scheme-color-interactive-button-primary-hover-stroke),
149
+ post-button-primary-disabled-fg: var(--post-scheme-color-interactive-button-primary-disabled-fg),
150
+ post-button-primary-disabled-bg: var(--post-scheme-color-interactive-button-primary-disabled-bg),
151
+ post-button-primary-disabled-stroke: var(--post-scheme-color-interactive-button-primary-disabled-stroke),
152
+ post-button-primary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-primary-enabled-fg-inverted),
153
+ post-button-primary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-primary-enabled-bg-inverted),
154
+ post-button-primary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-primary-enabled-stroke-inverted),
155
+ post-button-primary-inverted-hover-fg: var(--post-scheme-color-interactive-button-primary-hover-fg-inverted),
156
+ post-button-primary-inverted-hover-bg: var(--post-scheme-color-interactive-button-primary-hover-bg-inverted),
157
+ post-button-primary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-primary-hover-stroke-inverted),
158
+ post-button-primary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-primary-disabled-fg-inverted),
159
+ post-button-primary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-primary-disabled-bg-inverted),
160
+ post-button-primary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-primary-disabled-stroke-inverted),
161
+ post-button-secondary-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg),
162
+ post-button-secondary-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg),
163
+ post-button-secondary-enabled-stroke: var(--post-scheme-color-interactive-button-secondary-enabled-stroke),
164
+ post-button-secondary-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg),
165
+ post-button-secondary-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg),
166
+ post-button-secondary-hover-stroke: var(--post-scheme-color-interactive-button-secondary-hover-stroke),
167
+ post-button-secondary-disabled-fg: var(--post-scheme-color-interactive-button-secondary-disabled-fg),
168
+ post-button-secondary-disabled-bg: var(--post-scheme-color-interactive-button-secondary-disabled-bg),
169
+ post-button-secondary-disabled-stroke: var(--post-scheme-color-interactive-button-secondary-disabled-stroke),
170
+ post-button-secondary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg-inverted),
171
+ post-button-secondary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg-inverted),
172
+ post-button-secondary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-secondary-enabled-stroke-inverted),
173
+ post-button-secondary-inverted-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg-inverted),
174
+ post-button-secondary-inverted-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg-inverted),
175
+ post-button-secondary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-secondary-hover-stroke-inverted),
176
+ post-button-secondary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-secondary-disabled-fg-inverted),
177
+ post-button-secondary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-secondary-disabled-bg-inverted),
178
+ post-button-secondary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-secondary-disabled-stroke-inverted),
179
+ post-button-tertiary-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg),
180
+ post-button-tertiary-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg),
181
+ post-button-tertiary-enabled-stroke: var(--post-scheme-color-interactive-button-tertiary-enabled-stroke),
182
+ post-button-tertiary-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg),
183
+ post-button-tertiary-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg),
184
+ post-button-tertiary-hover-stroke: var(--post-scheme-color-interactive-button-tertiary-hover-stroke),
185
+ post-button-tertiary-disabled-fg: var(--post-scheme-color-interactive-button-tertiary-disabled-fg),
186
+ post-button-tertiary-disabled-bg: var(--post-scheme-color-interactive-button-tertiary-disabled-bg),
187
+ post-button-tertiary-disabled-stroke: var(--post-scheme-color-interactive-button-tertiary-disabled-stroke),
188
+ post-button-tertiary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg-inverted),
189
+ post-button-tertiary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg-inverted),
190
+ post-button-tertiary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-tertiary-enabled-stroke-inverted),
191
+ post-button-tertiary-inverted-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg-inverted),
192
+ post-button-tertiary-inverted-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg-inverted),
193
+ post-button-tertiary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-tertiary-hover-stroke-inverted),
194
+ post-button-tertiary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-tertiary-disabled-fg-inverted),
195
+ post-button-tertiary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-tertiary-disabled-bg-inverted),
196
+ post-button-tertiary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-tertiary-disabled-stroke-inverted),
197
+ post-button-medium-height: var(--post-device-sizing-interactive-button-height-1),
198
+ post-button-medium-gap-inline: var(--post-device-spacing-gap-inline-10),
199
+ post-button-medium-padding-inline: var(--post-device-spacing-padding-inline-6),
200
+ post-button-medium-icon: var(--post-device-sizing-interactive-button-icon-4),
201
+ post-button-border-radius-round: var(--post-device-border-radius-round),
202
+ post-button-small-height: var(--post-device-sizing-interactive-button-height-4),
203
+ post-button-small-gap-inline: var(--post-device-spacing-gap-inline-11),
204
+ post-button-small-padding-inline: var(--post-device-spacing-padding-inline-7),
205
+ post-button-small-icon: var(--post-device-sizing-interactive-button-icon-5),
206
+ post-button-border-width: var(--post-device-border-width-default),
207
+ post-button-label-font-weight: var(--post-device-font-weight-bold),
208
+ post-button-elevation: var(--post-device-elevation-100),
209
+ post-button-border-style-disabled: var(--post-core-border-style-dash),
210
+ );
211
+
212
+ $post-checkbox: (
213
+ post-checkbox-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg3),
214
+ post-checkbox-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
215
+ post-checkbox-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg3),
216
+ post-checkbox-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
217
+ post-checkbox-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg6),
218
+ post-checkbox-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg4),
219
+ post-checkbox-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke),
220
+ post-checkbox-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke),
221
+ post-checkbox-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke4),
222
+ post-checkbox-gap-block-group: var(--post-device-spacing-gap-4),
223
+ post-checkbox-gap-inline-text-start: var(--post-device-spacing-gap-inline-12),
224
+ post-checkbox-icon-border-width: var(--post-device-border-width-default),
225
+ post-checkbox-icon-size: var(--post-device-sizing-interactive-icon-size),
226
+ post-checkbox-icon-padding-inner: var(--post-device-spacing-padding-1),
227
+ post-checkbox-icon-padding-container: var(--post-device-spacing-padding-block-18),
228
+ post-checkbox-padding-block-single: var(--post-device-spacing-padding-block-19),
229
+ post-checkbox-padding-block-group: var(--post-device-spacing-padding-block-8),
230
+ post-checkbox-border-radius: var(--post-core-dimension-2),
231
+ post-checkbox-group-legend-font-size: var(--post-device-font-size-6),
232
+ post-checkbox-border-style-default: var(--post-core-border-style-solid),
233
+ post-checkbox-border-style-disabled: var(--post-core-border-style-dash),
234
+ post-checkbox-label-padding-block: var(--post-device-spacing-padding-block-20),
235
+ );
236
+
237
+ $post-close: (
238
+ post-close-size: var(--post-device-sizing-notification-1),
239
+ post-close-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg),
240
+ post-close-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg),
241
+ post-close-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg),
242
+ post-close-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg),
243
+ post-close-border-radius: var(--post-device-border-radius-round),
244
+ post-close-icon-size: var(--post-device-sizing-interactive-icon-size4),
245
+ );
246
+
247
+ $post-container: (
248
+ post-grid-gutter-xl: var(--post-core-dimension-24),
249
+ post-grid-gutter-lg: var(--post-core-dimension-24),
250
+ post-grid-gutter-md: var(--post-core-dimension-16),
251
+ post-grid-gutter-sm: var(--post-core-dimension-16),
252
+ post-grid-gutter-xs: var(--post-core-dimension-16),
253
+ post-grid-padding-xl: var(--post-core-dimension-40),
254
+ post-grid-padding-lg: var(--post-core-dimension-40),
255
+ post-grid-padding-md: var(--post-core-dimension-40),
256
+ post-grid-padding-sm: var(--post-core-dimension-16),
257
+ post-grid-padding-xs: var(--post-core-dimension-16),
258
+ post-grid-max-width: var(--post-core-dimension-1280),
259
+ );
260
+
261
+ $post-dropdown: (
262
+ post-dropdown-multi-select-menu-category-title-padding-block-outer: var(--post-device-spacing-padding-block-14),
263
+ post-dropdown-multi-select-menu-category-title-padding-block-inner: var(--post-device-spacing-padding-block-15),
264
+ post-dropdown-multi-select-menu-category-title-padding-inline-inner: var(--post-device-spacing-padding-inline-3),
265
+ post-dropdown-multi-select-menu-category-title-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke),
266
+ post-dropdown-multi-select-menu-category-title-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
267
+ post-dropdown-multi-select-menu-category-title-font-weight: var(--post-device-font-weight-bold),
268
+ post-dropdown-multi-select-menu-list-item-padding-inline-start: var(--post-device-spacing-padding-5),
269
+ post-dropdown-multi-select-menu-list-item-padding-inline-end: var(--post-device-spacing-padding-inline-4),
270
+ post-dropdown-multi-select-menu-list-item-padding-block-start: var(--post-device-spacing-padding-block-16),
271
+ post-dropdown-multi-select-menu-list-item-padding-block-end: var(--post-device-spacing-padding-block-17),
272
+ post-dropdown-multi-select-menu-list-item-gap-inline-text-start: var(--post-device-spacing-gap-4),
273
+ post-dropdown-multi-select-menu-list-item-border-width-bottom: var(--post-device-border-width-alternative2),
274
+ post-dropdown-multi-select-menu-list-item-icon-spacing-height-outer: var(--post-device-sizing-icon-2),
275
+ post-dropdown-multi-select-menu-list-item-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
276
+ post-dropdown-multi-select-menu-list-item-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
277
+ post-dropdown-multi-select-menu-list-item-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg1),
278
+ post-dropdown-multi-select-menu-list-item-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg),
279
+ post-dropdown-multi-select-menu-list-item-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke),
280
+ post-dropdown-multi-select-menu-list-item-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke3),
281
+ post-dropdown-multi-select-menu-padding-block: var(--post-device-spacing-padding-block-8),
282
+ post-dropdown-multi-select-menu-border-radius: var(--post-device-border-radius-1),
283
+ post-dropdown-multi-select-menu-elevation: var(--post-device-elevation-300),
284
+ );
285
+
286
+ $post-floating-button: (
287
+ post-floating-button-position-right: var(--post-device-position-1),
288
+ post-floating-button-position-top: var(--post-device-position-1),
289
+ post-floating-button-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg),
290
+ post-floating-button-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg),
291
+ post-floating-button-enabled-border: var(--post-scheme-color-interactive-button-secondary-enabled-stroke),
292
+ post-floating-button-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg),
293
+ post-floating-button-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg),
294
+ post-floating-button-hover-border: var(--post-scheme-color-interactive-button-secondary-hover-stroke),
295
+ post-floating-button-size-outer: var(--post-device-sizing-interactive-button-height-2),
296
+ post-floating-button-size-icon: var(--post-device-sizing-interactive-button-icon-3),
297
+ post-floating-button-border-width: var(--post-device-border-width-default),
298
+ post-floating-button-border-radius-round: var(--post-device-border-radius-round),
299
+ post-floating-button-elevation: var(--post-device-elevation-300),
300
+ post-floating-button-translate-y: var(--post-core-dimension-112),
301
+ );
302
+
303
+ $post-form-footer: (
304
+ post-form-footer-border-block-start-width: var(--post-device-border-width-default),
305
+ post-form-footer-border-block-start-style: var(--post-core-border-style-solid),
306
+ post-form-footer-border-start-color: var(--post-scheme-color-surface-default-stroke),
307
+ post-form-footer-padding-block-start: var(--post-device-spacing-padding-block-21),
308
+ post-form-footer-gap: var(--post-device-spacing-gap-4),
309
+ );
310
+
311
+ $post-grid: (
312
+ post-grid-gutter: var(--post-device-grid-sizing-gutter),
313
+ post-grid-container-max-width: var(--post-device-grid-sizing-container-max-width),
314
+ post-grid-container-padding-inline: var(--post-device-grid-padding-inline-container),
315
+ );
316
+
317
+ $post-icon-button: (
318
+ post-icon-button-large-outer: var(--post-device-sizing-interactive-button-height-2),
319
+ post-icon-button-large-icon: var(--post-device-sizing-interactive-button-icon-3),
320
+ post-icon-button-primary-enabled-fg: var(--post-scheme-color-interactive-button-primary-enabled-fg),
321
+ post-icon-button-primary-enabled-bg: var(--post-scheme-color-interactive-button-primary-enabled-bg),
322
+ post-icon-button-primary-enabled-stroke: var(--post-scheme-color-interactive-button-primary-enabled-stroke),
323
+ post-icon-button-primary-hover-fg: var(--post-scheme-color-interactive-button-primary-hover-fg),
324
+ post-icon-button-primary-hover-bg: var(--post-scheme-color-interactive-button-primary-hover-bg),
325
+ post-icon-button-primary-hover-stroke: var(--post-scheme-color-interactive-button-primary-hover-stroke),
326
+ post-icon-button-primary-disabled-fg: var(--post-scheme-color-interactive-button-primary-disabled-fg),
327
+ post-icon-button-primary-disabled-bg: var(--post-scheme-color-interactive-button-primary-disabled-bg),
328
+ post-icon-button-primary-disabled-stroke: var(--post-scheme-color-interactive-button-primary-disabled-stroke),
329
+ post-icon-button-primary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-primary-enabled-fg-inverted),
330
+ post-icon-button-primary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-primary-enabled-bg-inverted),
331
+ post-icon-button-primary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-primary-enabled-stroke-inverted),
332
+ post-icon-button-primary-inverted-hover-fg: var(--post-scheme-color-interactive-button-primary-hover-fg-inverted),
333
+ post-icon-button-primary-inverted-hover-bg: var(--post-scheme-color-interactive-button-primary-hover-bg-inverted),
334
+ post-icon-button-primary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-primary-hover-stroke-inverted),
335
+ post-icon-button-primary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-primary-disabled-fg-inverted),
336
+ post-icon-button-primary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-primary-disabled-bg-inverted),
337
+ post-icon-button-primary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-primary-disabled-stroke-inverted),
338
+ post-icon-button-secondary-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg),
339
+ post-icon-button-secondary-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg),
340
+ post-icon-button-secondary-enabled-stroke: var(--post-scheme-color-interactive-button-secondary-enabled-stroke),
341
+ post-icon-button-secondary-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg),
342
+ post-icon-button-secondary-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg),
343
+ post-icon-button-secondary-hover-stroke: var(--post-scheme-color-interactive-button-secondary-hover-stroke),
344
+ post-icon-button-secondary-disabled-fg: var(--post-scheme-color-interactive-button-secondary-disabled-fg),
345
+ post-icon-button-secondary-disabled-bg: var(--post-scheme-color-interactive-button-secondary-disabled-bg),
346
+ post-icon-button-secondary-disabled-stroke: var(--post-scheme-color-interactive-button-secondary-disabled-stroke),
347
+ post-icon-button-secondary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg-inverted),
348
+ post-icon-button-secondary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg-inverted),
349
+ post-icon-button-secondary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-secondary-enabled-stroke-inverted),
350
+ post-icon-button-secondary-inverted-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg-inverted),
351
+ post-icon-button-secondary-inverted-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg-inverted),
352
+ post-icon-button-secondary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-secondary-hover-stroke-inverted),
353
+ post-icon-button-secondary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-secondary-disabled-fg-inverted),
354
+ post-icon-button-secondary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-secondary-disabled-bg-inverted),
355
+ post-icon-button-secondary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-secondary-disabled-stroke-inverted),
356
+ post-icon-button-tertiary-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg),
357
+ post-icon-button-tertiary-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg),
358
+ post-icon-button-tertiary-enabled-stroke: var(--post-scheme-color-interactive-button-tertiary-enabled-stroke),
359
+ post-icon-button-tertiary-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg),
360
+ post-icon-button-tertiary-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg),
361
+ post-icon-button-tertiary-hover-stroke: var(--post-scheme-color-interactive-button-tertiary-hover-stroke),
362
+ post-icon-button-tertiary-disabled-fg: var(--post-scheme-color-interactive-button-tertiary-disabled-fg),
363
+ post-icon-button-tertiary-disabled-bg: var(--post-scheme-color-interactive-button-tertiary-disabled-bg),
364
+ post-icon-button-tertiary-disabled-stroke: var(--post-scheme-color-interactive-button-tertiary-disabled-stroke),
365
+ post-icon-button-tertiary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg-inverted),
366
+ post-icon-button-tertiary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg-inverted),
367
+ post-icon-button-tertiary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-tertiary-enabled-stroke-inverted),
368
+ post-icon-button-tertiary-inverted-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg-inverted),
369
+ post-icon-button-tertiary-inverted-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg-inverted),
370
+ post-icon-button-tertiary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-tertiary-hover-stroke-inverted),
371
+ post-icon-button-tertiary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-tertiary-disabled-fg-inverted),
372
+ post-icon-button-tertiary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-tertiary-disabled-bg-inverted),
373
+ post-icon-button-tertiary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-tertiary-disabled-stroke-inverted),
374
+ post-icon-button-medium-outer: var(--post-device-sizing-interactive-button-height-1),
375
+ post-icon-button-medium-icon: var(--post-device-sizing-interactive-button-icon-4),
376
+ post-icon-button-border-radius-round: var(--post-device-border-radius-round),
377
+ post-icon-button-small-outer: var(--post-device-sizing-interactive-button-height-4),
378
+ post-icon-button-small-icon: var(--post-device-sizing-interactive-button-icon-5),
379
+ post-icon-button-border-width: var(--post-device-border-width-default),
380
+ post-icon-button-elevation: var(--post-device-elevation-100),
381
+ post-icon-button-border-style-disabled: var(--post-core-border-style-dash),
382
+ );
383
+
384
+ $post-inline-notification: (
385
+ post-inline-spacing-gap-outer: var(--post-device-spacing-gap-inline-7),
386
+ post-inline-spacing-gap-inner: var(--post-device-spacing-gap-1),
387
+ post-inline-spacing-padding-block: var(--post-device-spacing-padding-12),
388
+ post-inline-sizing-icon: var(--post-device-sizing-notification-icon-2),
389
+ post-inline-color-info-bg: var(--post-scheme-color-interactive-notification-info-bg),
390
+ post-inline-color-info-fg: var(--post-scheme-color-interactive-notification-info-fg),
391
+ post-inline-color-info-stroke: var(--post-scheme-color-interactive-notification-info-stroke),
392
+ post-inline-color-info-icon: var(--post-scheme-color-interactive-notification-info-icon),
393
+ post-inline-color-success-bg: var(--post-scheme-color-interactive-notification-success-bg),
394
+ post-inline-color-success-fg: var(--post-scheme-color-interactive-notification-success-fg),
395
+ post-inline-color-success-stroke: var(--post-scheme-color-interactive-notification-success-stroke),
396
+ post-inline-color-success-icon: var(--post-scheme-color-interactive-notification-success-icon),
397
+ post-inline-color-warning-bg: var(--post-scheme-color-interactive-notification-warning-bg),
398
+ post-inline-color-warning-fg: var(--post-scheme-color-interactive-notification-warning-fg),
399
+ post-inline-color-warning-stroke: var(--post-scheme-color-interactive-notification-warning-stroke),
400
+ post-inline-color-warning-icon: var(--post-scheme-color-interactive-notification-warning-icon),
401
+ post-inline-color-error-bg: var(--post-scheme-color-interactive-notification-error-bg),
402
+ post-inline-color-error-fg: var(--post-scheme-color-interactive-notification-error-fg),
403
+ post-inline-color-error-stroke: var(--post-scheme-color-interactive-notification-error-stroke),
404
+ post-inline-color-error-icon: var(--post-scheme-color-interactive-notification-error-icon),
405
+ post-inline-elevation: var(--post-device-elevation-300),
406
+ );
407
+
408
+ $post-lead: (
409
+ post-lead-font-size: var(--post-device-font-size-5),
410
+ post-lead-font-weight: var(--post-device-font-weight-bold),
411
+ );
412
+
413
+ $post-list: (
414
+ post-list-item-padding-inline-start: var(--post-device-spacing-padding-5),
415
+ post-list-item-padding-inline-end: var(--post-device-spacing-padding-inline-4),
416
+ post-list-item-padding-block-start: var(--post-device-spacing-padding-block-22),
417
+ post-list-item-padding-block-end: var(--post-device-spacing-padding-block-23),
418
+ post-list-item-gap-inline: var(--post-device-spacing-gap-4),
419
+ post-list-item-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke),
420
+ post-list-item-hover-border: var(--post-scheme-color-interactive-primary-hover-stroke),
421
+ post-list-item-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
422
+ post-list-item-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
423
+ post-list-item-border-width: var(--post-device-border-width-alternative1),
424
+ post-list-item-border-style: var(--post-core-border-style-solid),
425
+ post-list-icon-container-padding-block: var(--post-device-spacing-padding-block-24),
426
+ post-list-icon-container-padding-inline: var(--post-device-spacing-padding-4),
427
+ post-list-icon-size: var(--post-device-sizing-interactive-icon-size2),
428
+ post-list-switch-padding-block: var(--post-device-spacing-padding-block-18),
429
+ post-list-margin-block: var(--post-device-spacing-padding-block-8),
430
+ post-list-bg: var(--post-scheme-color-surface-default-bg),
431
+ );
432
+
433
+ $post-listcheck: (
434
+ post-list-check-sizing-icon: var(--post-device-sizing-icon-1),
435
+ post-list-check-padding-icon: var(--post-device-spacing-padding-16),
436
+ post-list-check-text-padding: var(--post-device-spacing-padding-block-6),
437
+ post-list-check-icon-gap-inline: var(--post-device-spacing-gap-inline-2),
438
+ post-list-check-icon-container-inline: var(--post-device-spacing-padding-4),
439
+ post-list-check-icon-container-block: var(--post-device-spacing-padding-18),
440
+ post-list-check-item-gap-block-text: var(--post-device-spacing-gap-block-3),
441
+ post-list-check-margin-block: var(--post-device-spacing-padding-block-8),
442
+ post-list-check-color-icon-bg: var(--post-scheme-color-surface-accent-bg),
443
+ post-list-check-color-icon-fg: var(--post-scheme-color-surface-accent-fg),
444
+ post-list-check-color-text-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
445
+ );
446
+
447
+ $post-popover: (
448
+ post-popover-close-button-enabled-fg: var(--post-scheme-color-surface-accent-fg),
449
+ post-popover-close-button-selected-fg: var(--post-scheme-color-surface-accent-fg),
450
+ post-popover-close-button-hover-fg: var(--post-scheme-color-surface-accent-fg),
451
+ post-popover-close-button-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg2),
452
+ post-popover-close-button-outer: var(--post-device-sizing-notification-1),
453
+ post-popover-link-padding-block: var(--post-device-spacing-padding-block-9),
454
+ post-popover-link-enabled-fg: var(--post-scheme-color-surface-accent-fg),
455
+ post-popover-link-selected-fg: var(--post-scheme-color-surface-accent-fg),
456
+ post-popover-link-hover-fg: var(--post-scheme-color-notification-popover-hover),
457
+ post-popover-link-font-weight: var(--post-device-font-weight-bold),
458
+ post-popover-link-font-size: var(--post-device-font-size-7),
459
+ post-popover-icon-enabled-fg: var(--post-scheme-color-surface-accent1-fg),
460
+ post-popover-icon-selected-fg: var(--post-scheme-color-surface-accent1-fg),
461
+ post-popover-icon-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
462
+ post-popover-surface-bg: var(--post-scheme-color-surface-accent-bg),
463
+ post-popover-surface-fg: var(--post-scheme-color-surface-accent-fg),
464
+ post-popover-surface-border-radius: var(--post-device-border-radius-1),
465
+ post-popover-surface-padding-block: var(--post-device-spacing-padding-5),
466
+ post-popover-surface-padding-inline-start: var(--post-device-spacing-padding-5),
467
+ post-popover-surface-padding-inline-end: var(--post-device-spacing-padding-6),
468
+ post-popover-surface-gap-inline: var(--post-device-spacing-gap-inline-4),
469
+ post-popover-text-selected-fg: var(--post-scheme-color-surface-accent-fg),
470
+ post-popover-elevation: var(--post-device-elevation-300),
471
+ post-popover-paragraph-font-size: var(--post-device-font-size-7),
472
+ post-popover-legend-font-size: var(--post-device-font-size-6),
473
+ );
474
+
475
+ $post-radio-button: (
476
+ post-radio-button-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg3),
477
+ post-radio-button-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
478
+ post-radio-button-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg3),
479
+ post-radio-button-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
480
+ post-radio-button-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg6),
481
+ post-radio-button-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg4),
482
+ post-radio-button-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke),
483
+ post-radio-button-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke),
484
+ post-radio-button-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke4),
485
+ post-radio-button-gap-block-group: var(--post-device-spacing-gap-4),
486
+ post-radio-button-gap-inline-text-start: var(--post-device-spacing-gap-inline-12),
487
+ post-radio-button-icon-padding-block-inner: var(--post-device-spacing-padding-1),
488
+ post-radio-button-icon-padding-block-container: var(--post-device-spacing-padding-block-18),
489
+ post-radio-button-icon-padding-inline-inner: var(--post-device-spacing-padding-1),
490
+ post-radio-button-icon-border-width: var(--post-device-border-width-default),
491
+ post-radio-button-icon-border-radius-round: var(--post-device-border-radius-round),
492
+ post-radio-button-icon-border-style-disabled: var(--post-core-border-style-dash),
493
+ post-radio-button-icon-border-style-default: var(--post-core-border-style-solid),
494
+ post-radio-button-icon-dot: var(--post-device-sizing-icon-3),
495
+ post-radio-button-icon-ring: var(--post-device-sizing-interactive-icon-size),
496
+ post-radio-button-padding-block-single: var(--post-device-spacing-padding-block-19),
497
+ post-radio-button-padding-block-group: var(--post-device-spacing-padding-block-8),
498
+ post-radio-button-group-legend-font-size: var(--post-device-font-size-6),
499
+ post-radio-button-label-padding-block: var(--post-device-spacing-padding-block-20),
500
+ );
501
+
502
+ $post-search-input: (
503
+ post-input-search-empty-padding-inline-end: var(--post-core-dimension-48),
504
+ post-input-search-filled-padding-inline-end: var(--post-core-dimension-80),
505
+ post-input-search-filled-gap-icon: var(--post-core-dimension-8),
506
+ post-input-search-label-empty-padding-inline-end: var(--post-core-dimension-50),
507
+ post-input-search-label-filled-padding-inline-end: var(--post-core-dimension-82),
508
+ post-input-search-icon-border-radius: var(--post-device-border-radius-focus),
509
+ post-search-position-inline-end-icon: var(--post-core-dimension-14),
510
+ );
511
+
512
+ $post-segmented-button: (
513
+ post-button-segmented-horizontal-border-radius: var(--post-device-border-radius-round),
514
+ post-button-segmented-vertical-border-radius: var(--post-device-border-radius-2),
515
+ post-button-segmented-selected-fg: var(--post-scheme-color-interactive-primary-selected-fg3),
516
+ post-button-segmented-selected-bg: var(--post-scheme-color-interactive-primary-selected-bg4),
517
+ post-button-segmented-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
518
+ post-button-segmented-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg1),
519
+ post-button-segmented-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke),
520
+ post-button-segmented-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
521
+ post-button-segmented-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg),
522
+ post-button-segmented-hover-border: var(--post-scheme-color-interactive-primary-hover-stroke),
523
+ post-button-segmented-border-width: var(--post-device-border-width-default),
524
+ post-button-segmented-elements-height: var(--post-device-sizing-interactive-button-height-2),
525
+ post-button-segmented-elements-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke3),
526
+ post-button-segmented-padding-inline: var(--post-device-spacing-padding-11),
527
+ post-button-segmented-gap-inline: var(--post-device-spacing-gap-inline-13),
528
+ post-button-segmented-margin: var(--post-device-spacing-gap-6),
529
+ post-button-segmented-font-weight: var(--post-device-font-weight-bold),
530
+ post-button-segmented-selected-border: var(--post-scheme-color-interactive-primary-selected-stroke1),
531
+ post-button-segmented-elevation: var(--post-device-elevation-200),
532
+ );
533
+
534
+ $post-select: (
535
+ post-select-color-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg1),
536
+ post-select-color-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
537
+ post-select-color-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg),
538
+ post-select-color-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
539
+ post-select-color-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg),
540
+ post-select-color-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg1),
541
+ post-select-color-selected-bg: var(--post-scheme-color-interactive-primary-selected-bg1),
542
+ post-select-color-selected-fg: var(--post-scheme-color-interactive-primary-selected-fg1),
543
+ post-select-color-helptext-fg: var(--post-scheme-color-interactive-primary-enabled-fg2),
544
+ post-select-color-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke),
545
+ post-select-color-hover-border: var(--post-scheme-color-interactive-primary-hover-stroke),
546
+ post-select-color-disabled-border: var(--post-scheme-color-interactive-primary-disabled-stroke),
547
+ post-select-color-selected-border: var(--post-scheme-color-interactive-primary-selected-stroke1),
548
+ post-select-color-signal-error: var(--post-scheme-color-signal-error-dark),
549
+ post-select-color-signal-success: var(--post-scheme-color-signal-success-dark),
550
+ post-select-gap-inline-icon: var(--post-device-spacing-gap-1),
551
+ post-select-padding-block-assist: var(--post-device-spacing-padding-block-5),
552
+ post-select-padding-block-start: var(--post-device-spacing-padding-block-29),
553
+ post-select-padding-block-end: var(--post-device-spacing-padding-block-3),
554
+ post-select-padding-inline-start: var(--post-device-spacing-padding-inline-1),
555
+ post-select-padding-inline-end: var(--post-core-dimension-48),
556
+ post-select-padding-inline-assist: var(--post-device-spacing-padding-2),
557
+ post-select-sizing-icon: var(--post-device-sizing-notification-1),
558
+ post-select-sizing-height: var(--post-device-sizing-interactive-button-height-6),
559
+ post-select-border-radius: var(--post-device-border-radius-1),
560
+ post-select-border-width: var(--post-device-border-width-default),
561
+ post-select-border-style-default: var(--post-core-border-style-solid),
562
+ post-select-border-style-disabled: var(--post-core-border-style-dash),
563
+ post-select-standalone-padding-block: var(--post-device-spacing-padding-block-1),
564
+ post-select-label-empty-padding-block-start: var(--post-device-spacing-padding-block-28),
565
+ post-select-label-empty-padding-inline-start: var(--post-device-spacing-padding-5),
566
+ post-select-label-empty-padding-inline-end: var(--post-core-dimension-50),
567
+ post-select-label-validated-padding-inline-end: var(--post-core-dimension-82),
568
+ post-select-label-filled-padding-block-start: var(--post-device-spacing-padding-block-30),
569
+ post-select-label-filled-font-size: var(--post-device-font-size-10),
570
+ post-select-validation-icon-position-inline-end: var(--post-device-position-3),
571
+ post-select-assist-font-size: var(--post-device-font-size-10),
572
+ post-select-validated-padding-inline-end: var(--post-core-dimension-80),
573
+ post-select-icon-position-inline-end: var(--post-device-position-2),
574
+ );
575
+
576
+ $post-snackbar: (
577
+ post-snackbar-spacing-gap-outer: var(--post-device-spacing-gap-inline-3),
578
+ post-snackbar-spacing-padding-inline: var(--post-device-spacing-padding-11),
579
+ post-snackbar-spacing-padding-block: var(--post-device-spacing-padding-block-12),
580
+ post-snackbar-sizing-icon: var(--post-device-sizing-notification-icon-3),
581
+ post-snackbar-color-info-bg: var(--post-scheme-color-interactive-notification-info-bg),
582
+ post-snackbar-color-info-fg: var(--post-scheme-color-interactive-notification-info-fg),
583
+ post-snackbar-color-info-stroke: var(--post-scheme-color-interactive-notification-info-stroke),
584
+ post-snackbar-color-info-icon: var(--post-scheme-color-interactive-notification-info-icon),
585
+ post-snackbar-color-success-bg: var(--post-scheme-color-interactive-notification-success-bg),
586
+ post-snackbar-color-success-fg: var(--post-scheme-color-interactive-notification-success-fg),
587
+ post-snackbar-color-success-stroke: var(--post-scheme-color-interactive-notification-success-stroke),
588
+ post-snackbar-color-success-icon: var(--post-scheme-color-interactive-notification-success-icon),
589
+ post-snackbar-color-warning-bg: var(--post-scheme-color-interactive-notification-warning-bg),
590
+ post-snackbar-color-warning-fg: var(--post-scheme-color-interactive-notification-warning-fg),
591
+ post-snackbar-color-warning-stroke: var(--post-scheme-color-interactive-notification-warning-stroke),
592
+ post-snackbar-color-warning-icon: var(--post-scheme-color-interactive-notification-warning-icon),
593
+ post-snackbar-color-error-bg: var(--post-scheme-color-interactive-notification-error-bg),
594
+ post-snackbar-color-error-fg: var(--post-scheme-color-interactive-notification-error-fg),
595
+ post-snackbar-color-error-stroke: var(--post-scheme-color-interactive-notification-error-stroke),
596
+ post-snackbar-color-error-icon: var(--post-scheme-color-interactive-notification-error-icon),
597
+ post-snackbar-elevation: var(--post-device-elevation-300),
598
+ );
599
+
600
+ $post-stepper: (
601
+ post-stepper-text-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
602
+ post-stepper-text-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg1),
603
+ post-stepper-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg2),
604
+ post-stepper-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg3),
605
+ post-stepper-completed-bg: var(--post-scheme-color-interactive-primary-selected-bg2),
606
+ post-stepper-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg2),
607
+ post-stepper-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg3),
608
+ post-stepper-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg4),
609
+ post-stepper-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg3),
610
+ post-stepper-connector-active: var(--post-scheme-color-interactive-primary-enabled-fg1),
611
+ post-stepper-connector-completed: var(--post-scheme-color-interactive-primary-selected-bg2),
612
+ post-stepper-connector-next: var(--post-scheme-color-interactive-primary-disabled-bg4),
613
+ post-stepper-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke3),
614
+ post-stepper-completed-stroke: var(--post-scheme-color-interactive-primary-selected-stroke3),
615
+ post-stepper-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke3),
616
+ post-stepper-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke3),
617
+ post-stepper-gap-text-start: var(--post-device-spacing-gap-1),
618
+ post-stepper-padding-connector: var(--post-device-spacing-padding-9),
619
+ post-stepper-border-radius-round: var(--post-device-border-radius-round),
620
+ post-stepper-indicator: var(--post-device-sizing-interactive-stepper-indicator),
621
+ post-stepper-border-width: var(--post-device-border-width-default),
622
+ post-stepper-step-label-font-size: var(--post-device-font-size-7),
623
+ post-stepper-step-label-selected-font-weight: var(--post-device-font-weight-bold),
624
+ );
625
+
626
+ $post-switch: (
627
+ post-switch-text-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
628
+ post-switch-text-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg1),
629
+ post-switch-text-selected-fg: var(--post-scheme-color-interactive-primary-selected-fg1),
630
+ post-switch-icon-success: var(--post-scheme-color-interactive-primary-selected-bg2),
631
+ post-switch-icon-disabled: var(--post-scheme-color-interactive-primary-disabled-fg1),
632
+ post-switch-icon-hover: var(--post-scheme-color-interactive-primary-hover-fg1),
633
+ post-switch-icon-padding-container: var(--post-device-spacing-padding-block-18),
634
+ post-switch-handle-enabled: var(--post-scheme-color-interactive-primary-enabled-fg3),
635
+ post-switch-handle-selected: var(--post-scheme-color-interactive-primary-selected-fg3),
636
+ post-switch-handle-selected-stroke: var(--post-scheme-color-interactive-primary-selected-stroke3),
637
+ post-switch-handle-hover: var(--post-scheme-color-interactive-primary-hover-fg3),
638
+ post-switch-handle-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke3),
639
+ post-switch-handle-disabled: var(--post-scheme-color-interactive-primary-disabled-fg3),
640
+ post-switch-handle-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke2),
641
+ post-switch-handle-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke3),
642
+ post-switch-element-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg2),
643
+ post-switch-element-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke),
644
+ post-switch-element-selected-bg: var(--post-scheme-color-interactive-primary-selected-bg2),
645
+ post-switch-element-selected-stroke: var(--post-scheme-color-interactive-primary-selected-stroke4),
646
+ post-switch-element-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg2),
647
+ post-switch-element-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke),
648
+ post-switch-element-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg5),
649
+ post-switch-element-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke2),
650
+ post-switch-element-width: var(--post-core-dimension-48),
651
+ post-switch-element-height: var(--post-core-dimension-24),
652
+ post-switch-element-handle: var(--post-core-dimension-18),
653
+ post-switch-gap-inline-text: var(--post-device-spacing-gap-inline-3),
654
+ post-switch-padding-block-text: var(--post-device-spacing-padding-block-7),
655
+ post-switch-padding-block-container-text: var(--post-device-spacing-padding-block-9),
656
+ post-switch-padding-inline-handle: var(--post-core-dimension-4),
657
+ post-switch-border-radius-round: var(--post-device-border-radius-round),
658
+ post-switch-border-style-disabled: var(--post-core-border-style-dash),
659
+ post-switch-border-style-default: var(--post-core-border-style-solid),
660
+ post-switch-border-width: var(--post-device-border-width-alternative1),
661
+ );
662
+
663
+ $post-text-area: (
664
+ post-textarea-enabled-bg: var(--post-scheme-color-interactive-input-enabled-bg),
665
+ post-textarea-enabled-fg: var(--post-scheme-color-interactive-input-enabled-fg),
666
+ post-textarea-hover-bg: var(--post-scheme-color-interactive-input-hover-bg),
667
+ post-textarea-hover-fg: var(--post-scheme-color-interactive-input-hover-fg),
668
+ post-textarea-disabled-bg: var(--post-scheme-color-interactive-input-disabled-bg),
669
+ post-textarea-disabled-fg: var(--post-scheme-color-interactive-input-disabled-fg),
670
+ post-textarea-enabled-border: var(--post-scheme-color-interactive-input-enabled-border),
671
+ post-textarea-hover-border: var(--post-scheme-color-interactive-input-hover-border),
672
+ post-textarea-disabled-border: var(--post-scheme-color-interactive-input-disabled-border),
673
+ post-textarea-gap-inline: var(--post-device-spacing-gap-1),
674
+ post-textarea-gap-assist: var(--post-device-spacing-gap-1),
675
+ post-textarea-padding-block-start: var(--post-device-spacing-padding-block-29),
676
+ post-textarea-padding-block-end: var(--post-device-spacing-padding-3),
677
+ post-textarea-padding-block-assist: var(--post-device-spacing-padding-block-5),
678
+ post-textarea-padding-inline-assist: var(--post-device-spacing-padding-2),
679
+ post-textarea-padding-inline-start: var(--post-device-spacing-padding-inline-1),
680
+ post-textarea-padding-inline-end: var(--post-core-dimension-26),
681
+ post-textarea-standalone-padding-block: var(--post-device-spacing-padding-3),
682
+ post-textarea-sizing-icon: var(--post-device-sizing-notification-1),
683
+ post-textarea-sizing-min-height: var(--post-core-dimension-88),
684
+ post-textarea-border-radius: var(--post-device-border-radius-1),
685
+ post-textarea-border-style-enabled: var(--post-core-border-style-solid),
686
+ post-textarea-border-style-disabled: var(--post-core-border-style-dash),
687
+ post-textarea-border-width: var(--post-device-border-width-default),
688
+ post-textarea-label-padding-inline-start: var(--post-device-spacing-padding-5),
689
+ post-textarea-label-padding-inline-end: var(--post-core-dimension-28),
690
+ post-textarea-label-padding-block-start: var(--post-device-spacing-padding-block-27),
691
+ post-textarea-label-validated-padding-inline-end: var(--post-core-dimension-58),
692
+ post-textarea-label-filled-font-size: var(--post-device-font-size-10),
693
+ post-textarea-label-filled-padding-block-start: var(--post-device-spacing-padding-block-30),
694
+ post-textarea-signal-error: var(--post-scheme-color-signal-error-dark),
695
+ post-textarea-signal-success: var(--post-scheme-color-signal-success-dark),
696
+ post-textarea-position-inline-end-resize: var(--post-core-dimension-6),
697
+ post-textarea-position-inline-end-validation: var(--post-core-dimension-28),
698
+ post-textarea-position-block-end-resize: var(--post-core-dimension-6),
699
+ post-textarea-position-block-start-validation: var(--post-core-dimension-12),
700
+ post-textarea-assist-font-size: var(--post-device-font-size-9),
701
+ post-textarea-validated-padding-inline-end: var(--post-core-dimension-56),
702
+ post-textarea-placeholder-fg: var(--post-scheme-color-interactive-primary-enabled-fg2),
703
+ );
704
+
705
+ $post-text-highlighted: (
706
+ post-text-highlighted-bg: var(--post-scheme-color-signal-information-light),
707
+ post-text-highlighted-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
708
+ post-text-highlighted-padding-text: var(--post-device-spacing-padding-5),
709
+ post-text-highlighted-height-space-bottom: var(--post-core-dimension-24),
710
+ post-text-highlighted-border-radius: var(--post-device-border-radius-1),
711
+ );
712
+
713
+ $post-text-input: (
714
+ post-input-color-enabled-bg: var(--post-scheme-color-interactive-input-enabled-bg),
715
+ post-input-color-enabled-fg: var(--post-scheme-color-interactive-input-enabled-fg),
716
+ post-input-color-hover-bg: var(--post-scheme-color-interactive-input-hover-bg),
717
+ post-input-color-hover-fg: var(--post-scheme-color-interactive-input-hover-fg),
718
+ post-input-color-disabled-bg: var(--post-scheme-color-interactive-input-disabled-bg),
719
+ post-input-color-disabled-fg: var(--post-scheme-color-interactive-input-disabled-fg),
720
+ post-input-color-selected-bg: var(--post-scheme-color-interactive-primary-selected-bg1),
721
+ post-input-color-selected-fg: var(--post-scheme-color-interactive-input-enabled-fg),
722
+ post-input-color-helptext-fg: var(--post-scheme-color-interactive-primary-enabled-fg2),
723
+ post-input-color-enabled-border: var(--post-scheme-color-interactive-input-enabled-border),
724
+ post-input-color-hover-border: var(--post-scheme-color-interactive-input-hover-border),
725
+ post-input-color-disabled-border: var(--post-scheme-color-interactive-input-disabled-border),
726
+ post-input-color-selected-border: var(--post-scheme-color-interactive-input-enabled-border),
727
+ post-input-color-signal-error: var(--post-scheme-color-signal-error-dark),
728
+ post-input-color-signal-success: var(--post-scheme-color-signal-success-dark),
729
+ post-input-gap-inline-1: var(--post-device-spacing-gap-1),
730
+ post-input-gap-inline-2: var(--post-device-spacing-gap-inline-4),
731
+ post-input-padding-block-assist: var(--post-device-spacing-padding-block-5),
732
+ post-input-padding-block-start: var(--post-device-spacing-padding-block-29),
733
+ post-input-padding-block-end: var(--post-device-spacing-padding-block-3),
734
+ post-input-padding-inline-start: var(--post-device-spacing-padding-inline-1),
735
+ post-input-padding-inline-end: var(--post-device-spacing-padding-3),
736
+ post-input-padding-inline-assist: var(--post-device-spacing-padding-2),
737
+ post-input-sizing-icon: var(--post-device-sizing-notification-1),
738
+ post-input-sizing-height: var(--post-device-sizing-interactive-button-height-6),
739
+ post-input-border-radius-surface: var(--post-device-border-radius-1),
740
+ post-input-border-width: var(--post-device-border-width-default),
741
+ post-input-border-style-default: var(--post-core-border-style-solid),
742
+ post-input-border-style-disabled: var(--post-core-border-style-dash),
743
+ post-input-standalone-padding-block: var(--post-device-spacing-padding-block-1),
744
+ post-input-label-empty-padding-block-start: var(--post-device-spacing-padding-block-28),
745
+ post-input-label-empty-padding-inline-start: var(--post-device-spacing-padding-5),
746
+ post-input-label-empty-padding-inline-end: var(--post-device-spacing-padding-inline-4),
747
+ post-input-label-validated-padding-inline-end: var(--post-core-dimension-50),
748
+ post-input-label-filled-padding-block-start: var(--post-device-spacing-padding-block-30),
749
+ post-input-label-filled-font-size: var(--post-device-font-size-10),
750
+ post-input-validation-icon-position-inline-end: var(--post-device-position-2),
751
+ post-input-assist-font-size: var(--post-device-font-size-10),
752
+ post-input-validated-padding-inline-end: var(--post-core-dimension-48),
753
+ );
754
+
755
+ $post-toast: (
756
+ post-toast-spacing-padding-action: var(--post-device-spacing-padding-block-10),
757
+ post-toast-spacing-padding-inline: var(--post-device-spacing-padding-11),
758
+ post-toast-spacing-padding-block: var(--post-device-spacing-padding-3),
759
+ post-toast-spacing-gap-action: var(--post-device-spacing-gap-1),
760
+ post-toast-spacing-gap-outer: var(--post-device-spacing-gap-inline-2),
761
+ post-toast-spacing-gap-inner: var(--post-device-spacing-gap-2),
762
+ post-toast-sizing-icon: var(--post-device-sizing-notification-icon-3),
763
+ post-toast-color-info-bg: var(--post-scheme-color-interactive-notification-info-bg),
764
+ post-toast-color-info-fg: var(--post-scheme-color-interactive-notification-info-fg),
765
+ post-toast-color-info-stroke: var(--post-scheme-color-interactive-notification-info-stroke),
766
+ post-toast-color-info-icon: var(--post-scheme-color-interactive-notification-info-icon),
767
+ post-toast-color-success-bg: var(--post-scheme-color-interactive-notification-success-bg),
768
+ post-toast-color-success-fg: var(--post-scheme-color-interactive-notification-success-fg),
769
+ post-toast-color-success-stroke: var(--post-scheme-color-interactive-notification-success-stroke),
770
+ post-toast-color-success-icon: var(--post-scheme-color-interactive-notification-success-icon),
771
+ post-toast-color-warning-bg: var(--post-scheme-color-interactive-notification-warning-bg),
772
+ post-toast-color-warning-fg: var(--post-scheme-color-interactive-notification-warning-fg),
773
+ post-toast-color-warning-stroke: var(--post-scheme-color-interactive-notification-warning-stroke),
774
+ post-toast-color-warning-icon: var(--post-scheme-color-interactive-notification-warning-icon),
775
+ post-toast-color-error-bg: var(--post-scheme-color-interactive-notification-error-bg),
776
+ post-toast-color-error-fg: var(--post-scheme-color-interactive-notification-error-fg),
777
+ post-toast-color-error-stroke: var(--post-scheme-color-interactive-notification-error-stroke),
778
+ post-toast-color-error-icon: var(--post-scheme-color-interactive-notification-error-icon),
779
+ post-toast-elevation: var(--post-device-elevation-300),
780
+ );
781
+
782
+ $post-validation: (
783
+ post-validation-group-gap-inline: var(--post-device-spacing-gap-inline-10),
784
+ post-validation-group-icon-size: var(--post-device-sizing-interactive-icon-size4),
785
+ post-validation-group-icon-block-start: var(--post-core-dimension-2),
786
+ post-validation-group-icon-block-end: var(--post-core-dimension-3),
787
+ post-validation-group-padding-inline-start: var(--post-core-dimension-4),
788
+ post-validation-error: var(--post-scheme-color-signal-error-solo),
789
+ post-validation-success: var(--post-scheme-color-signal-success-solo),
790
+ post-validation-input-padding-block: var(--post-device-spacing-padding-block-5),
791
+ post-validation-input-padding-inline: var(--post-device-spacing-padding-2),
792
+ post-validation-font-size: var(--post-device-font-size-9),
793
+ );