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

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