@massimo-cassandro/minimo 1.20.16 → 1.21.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/design-tokens/tokens-config-sample.mjs +5 -0
  2. package/design-tokens/utilities/build-tokens-src/config.mjs +5 -0
  3. package/design-tokens/utilities/build-tokens-src/formats/css.mjs +7 -1
  4. package/design-tokens/utilities/build-tokens-src/platforms.mjs +3 -0
  5. package/design-tokens/utilities/build-tokens.mjs +2 -0
  6. package/package.json +3 -3
  7. package/src/components/autocomplete/autocomplete.css +113 -109
  8. package/src/components/inner-nav/inner-nav.css +13 -9
  9. package/src/components/modal-alert/modal-alert.module.css +157 -153
  10. package/src/components/modal-popup/modal-popup.module.css +89 -85
  11. package/src/components/overlay/overlay.css +14 -10
  12. package/src/components/sf-macro/sf-macro.css +60 -56
  13. package/src/components/slide-up-down-toggle/slide-up-down-toggle.module.css +33 -29
  14. package/src/components/snackbar/snackbar.module.css +93 -89
  15. package/src/components/spinner/spinner-circle-basic.css +18 -14
  16. package/src/components/spinner/spinner.module.css +8 -4
  17. package/src/components/unsplash-page/unsplash-page.module.css +260 -256
  18. package/src/css/alerts.css +55 -53
  19. package/src/css/badge.css +16 -12
  20. package/src/css/buttons/btn-close.css +57 -53
  21. package/src/css/buttons/buttons-primary.css +38 -34
  22. package/src/css/buttons/buttons-secondary.css +38 -34
  23. package/src/css/buttons/buttons.css +84 -80
  24. package/src/css/buttons/status-buttons.css +66 -63
  25. package/src/css/container.css +9 -5
  26. package/src/css/data-formats.css +28 -24
  27. package/src/css/details.css +17 -13
  28. package/src/css/dimensions.css +13 -9
  29. package/src/css/display.css +27 -23
  30. package/src/css/flex.css +39 -35
  31. package/src/css/forms/fieldset.css +47 -43
  32. package/src/css/forms/form-collections.css +16 -12
  33. package/src/css/forms/form-disabled-readonly.css +31 -27
  34. package/src/css/forms/form-group.css +15 -11
  35. package/src/css/forms/form-utilities.css +32 -28
  36. package/src/css/forms/forms.css +136 -134
  37. package/src/css/forms/input-group.css +47 -43
  38. package/src/css/forms/switch.css +50 -46
  39. package/src/css/forms/validation.css +26 -22
  40. package/src/css/grid.css +66 -62
  41. package/src/css/headings.css +32 -28
  42. package/src/css/icons.css +41 -37
  43. package/src/css/layout-base.css +16 -12
  44. package/src/css/links.css +40 -36
  45. package/src/css/margin-padding-bootstrap-media.css +1836 -1832
  46. package/src/css/margin-padding-bootstrap.css +445 -441
  47. package/src/css/margin-padding-media.css +1836 -1832
  48. package/src/css/margin-padding.css +445 -441
  49. package/src/css/overflow.css +7 -3
  50. package/src/css/position.css +5 -1
  51. package/src/css/reset.css +47 -44
  52. package/src/css/svg.css +6 -2
  53. package/src/css/table.css +59 -55
  54. package/src/css/text.css +96 -92
  55. package/src/css/visibility.css +23 -19
  56. package/src/custom-properties.css +442 -439
  57. package/src/minimo.css +2 -0
  58. package/src/web-components/s-datatable-component/s-datatable-component.module.css +175 -171
@@ -1,4 +1,4 @@
1
- /* stylelint-disable declaration-no-important, selector-class-pattern */
1
+ /* stylelint-disable selector-class-pattern */
2
2
 
3
3
  /* AUTO-GENERATED FILE — do not edit by hand.
4
4
  Generated by `node scripts/build-margin-padding-css.mjs`.
@@ -8,457 +8,461 @@
8
8
  (m/mt/mb/mx/ms/me/p/pt/pb/px/ps/pe...) to ease the transition to 'minimo'.
9
9
  Responsive variants live in `margin-padding-bootstrap-media.css`. */
10
10
 
11
- .m-0 {
12
- margin: 0 !important;
13
- }
14
- .m-auto {
15
- margin: auto !important;
16
- }
17
- .m-3xl {
18
- margin: var(--size-3xl) !important;
19
- }
20
- .m-2xl {
21
- margin: var(--size-2xl) !important;
22
- }
23
- .m {
24
- margin: var(--size-base) !important;
25
- }
26
- .m-lg {
27
- margin: var(--size-lg) !important;
28
- }
29
- .m-md {
30
- margin: var(--size-md) !important;
31
- }
32
- .m-sm {
33
- margin: var(--size-sm) !important;
34
- }
35
- .m-xl {
36
- margin: var(--size-xl) !important;
37
- }
38
- .m-xs {
39
- margin: var(--size-xs) !important;
40
- }
41
- .m-xxs {
42
- margin: var(--size-xxs) !important;
43
- }
11
+ @layer utilities {
44
12
 
45
- .my-0 {
46
- margin-block: 0 !important;
47
- }
48
- .my-auto {
49
- margin-block: auto !important;
50
- }
51
- .my-3xl {
52
- margin-block: var(--size-3xl) !important;
53
- }
54
- .my-2xl {
55
- margin-block: var(--size-2xl) !important;
56
- }
57
- .my {
58
- margin-block: var(--size-base) !important;
59
- }
60
- .my-lg {
61
- margin-block: var(--size-lg) !important;
62
- }
63
- .my-md {
64
- margin-block: var(--size-md) !important;
65
- }
66
- .my-sm {
67
- margin-block: var(--size-sm) !important;
68
- }
69
- .my-xl {
70
- margin-block: var(--size-xl) !important;
71
- }
72
- .my-xs {
73
- margin-block: var(--size-xs) !important;
74
- }
75
- .my-xxs {
76
- margin-block: var(--size-xxs) !important;
77
- }
13
+ .m-0 {
14
+ margin: 0;
15
+ }
16
+ .m-auto {
17
+ margin: auto;
18
+ }
19
+ .m-3xl {
20
+ margin: var(--size-3xl);
21
+ }
22
+ .m-2xl {
23
+ margin: var(--size-2xl);
24
+ }
25
+ .m {
26
+ margin: var(--size-base);
27
+ }
28
+ .m-lg {
29
+ margin: var(--size-lg);
30
+ }
31
+ .m-md {
32
+ margin: var(--size-md);
33
+ }
34
+ .m-sm {
35
+ margin: var(--size-sm);
36
+ }
37
+ .m-xl {
38
+ margin: var(--size-xl);
39
+ }
40
+ .m-xs {
41
+ margin: var(--size-xs);
42
+ }
43
+ .m-xxs {
44
+ margin: var(--size-xxs);
45
+ }
78
46
 
79
- .mt-0 {
80
- margin-block-start: 0 !important;
81
- }
82
- .mt-auto {
83
- margin-block-start: auto !important;
84
- }
85
- .mt-3xl {
86
- margin-block-start: var(--size-3xl) !important;
87
- }
88
- .mt-2xl {
89
- margin-block-start: var(--size-2xl) !important;
90
- }
91
- .mt {
92
- margin-block-start: var(--size-base) !important;
93
- }
94
- .mt-lg {
95
- margin-block-start: var(--size-lg) !important;
96
- }
97
- .mt-md {
98
- margin-block-start: var(--size-md) !important;
99
- }
100
- .mt-sm {
101
- margin-block-start: var(--size-sm) !important;
102
- }
103
- .mt-xl {
104
- margin-block-start: var(--size-xl) !important;
105
- }
106
- .mt-xs {
107
- margin-block-start: var(--size-xs) !important;
108
- }
109
- .mt-xxs {
110
- margin-block-start: var(--size-xxs) !important;
111
- }
47
+ .my-0 {
48
+ margin-block: 0;
49
+ }
50
+ .my-auto {
51
+ margin-block: auto;
52
+ }
53
+ .my-3xl {
54
+ margin-block: var(--size-3xl);
55
+ }
56
+ .my-2xl {
57
+ margin-block: var(--size-2xl);
58
+ }
59
+ .my {
60
+ margin-block: var(--size-base);
61
+ }
62
+ .my-lg {
63
+ margin-block: var(--size-lg);
64
+ }
65
+ .my-md {
66
+ margin-block: var(--size-md);
67
+ }
68
+ .my-sm {
69
+ margin-block: var(--size-sm);
70
+ }
71
+ .my-xl {
72
+ margin-block: var(--size-xl);
73
+ }
74
+ .my-xs {
75
+ margin-block: var(--size-xs);
76
+ }
77
+ .my-xxs {
78
+ margin-block: var(--size-xxs);
79
+ }
112
80
 
113
- .mb-0 {
114
- margin-block-end: 0 !important;
115
- }
116
- .mb-auto {
117
- margin-block-end: auto !important;
118
- }
119
- .mb-3xl {
120
- margin-block-end: var(--size-3xl) !important;
121
- }
122
- .mb-2xl {
123
- margin-block-end: var(--size-2xl) !important;
124
- }
125
- .mb {
126
- margin-block-end: var(--size-base) !important;
127
- }
128
- .mb-lg {
129
- margin-block-end: var(--size-lg) !important;
130
- }
131
- .mb-md {
132
- margin-block-end: var(--size-md) !important;
133
- }
134
- .mb-sm {
135
- margin-block-end: var(--size-sm) !important;
136
- }
137
- .mb-xl {
138
- margin-block-end: var(--size-xl) !important;
139
- }
140
- .mb-xs {
141
- margin-block-end: var(--size-xs) !important;
142
- }
143
- .mb-xxs {
144
- margin-block-end: var(--size-xxs) !important;
145
- }
81
+ .mt-0 {
82
+ margin-block-start: 0;
83
+ }
84
+ .mt-auto {
85
+ margin-block-start: auto;
86
+ }
87
+ .mt-3xl {
88
+ margin-block-start: var(--size-3xl);
89
+ }
90
+ .mt-2xl {
91
+ margin-block-start: var(--size-2xl);
92
+ }
93
+ .mt {
94
+ margin-block-start: var(--size-base);
95
+ }
96
+ .mt-lg {
97
+ margin-block-start: var(--size-lg);
98
+ }
99
+ .mt-md {
100
+ margin-block-start: var(--size-md);
101
+ }
102
+ .mt-sm {
103
+ margin-block-start: var(--size-sm);
104
+ }
105
+ .mt-xl {
106
+ margin-block-start: var(--size-xl);
107
+ }
108
+ .mt-xs {
109
+ margin-block-start: var(--size-xs);
110
+ }
111
+ .mt-xxs {
112
+ margin-block-start: var(--size-xxs);
113
+ }
146
114
 
147
- .mx-0 {
148
- margin-inline: 0 !important;
149
- }
150
- .mx-auto {
151
- margin-inline: auto !important;
152
- }
153
- .mx-3xl {
154
- margin-inline: var(--size-3xl) !important;
155
- }
156
- .mx-2xl {
157
- margin-inline: var(--size-2xl) !important;
158
- }
159
- .mx {
160
- margin-inline: var(--size-base) !important;
161
- }
162
- .mx-lg {
163
- margin-inline: var(--size-lg) !important;
164
- }
165
- .mx-md {
166
- margin-inline: var(--size-md) !important;
167
- }
168
- .mx-sm {
169
- margin-inline: var(--size-sm) !important;
170
- }
171
- .mx-xl {
172
- margin-inline: var(--size-xl) !important;
173
- }
174
- .mx-xs {
175
- margin-inline: var(--size-xs) !important;
176
- }
177
- .mx-xxs {
178
- margin-inline: var(--size-xxs) !important;
179
- }
115
+ .mb-0 {
116
+ margin-block-end: 0;
117
+ }
118
+ .mb-auto {
119
+ margin-block-end: auto;
120
+ }
121
+ .mb-3xl {
122
+ margin-block-end: var(--size-3xl);
123
+ }
124
+ .mb-2xl {
125
+ margin-block-end: var(--size-2xl);
126
+ }
127
+ .mb {
128
+ margin-block-end: var(--size-base);
129
+ }
130
+ .mb-lg {
131
+ margin-block-end: var(--size-lg);
132
+ }
133
+ .mb-md {
134
+ margin-block-end: var(--size-md);
135
+ }
136
+ .mb-sm {
137
+ margin-block-end: var(--size-sm);
138
+ }
139
+ .mb-xl {
140
+ margin-block-end: var(--size-xl);
141
+ }
142
+ .mb-xs {
143
+ margin-block-end: var(--size-xs);
144
+ }
145
+ .mb-xxs {
146
+ margin-block-end: var(--size-xxs);
147
+ }
180
148
 
181
- .ms-0 {
182
- margin-inline-start: 0 !important;
183
- }
184
- .ms-auto {
185
- margin-inline-start: auto !important;
186
- }
187
- .ms-3xl {
188
- margin-inline-start: var(--size-3xl) !important;
189
- }
190
- .ms-2xl {
191
- margin-inline-start: var(--size-2xl) !important;
192
- }
193
- .ms {
194
- margin-inline-start: var(--size-base) !important;
195
- }
196
- .ms-lg {
197
- margin-inline-start: var(--size-lg) !important;
198
- }
199
- .ms-md {
200
- margin-inline-start: var(--size-md) !important;
201
- }
202
- .ms-sm {
203
- margin-inline-start: var(--size-sm) !important;
204
- }
205
- .ms-xl {
206
- margin-inline-start: var(--size-xl) !important;
207
- }
208
- .ms-xs {
209
- margin-inline-start: var(--size-xs) !important;
210
- }
211
- .ms-xxs {
212
- margin-inline-start: var(--size-xxs) !important;
213
- }
149
+ .mx-0 {
150
+ margin-inline: 0;
151
+ }
152
+ .mx-auto {
153
+ margin-inline: auto;
154
+ }
155
+ .mx-3xl {
156
+ margin-inline: var(--size-3xl);
157
+ }
158
+ .mx-2xl {
159
+ margin-inline: var(--size-2xl);
160
+ }
161
+ .mx {
162
+ margin-inline: var(--size-base);
163
+ }
164
+ .mx-lg {
165
+ margin-inline: var(--size-lg);
166
+ }
167
+ .mx-md {
168
+ margin-inline: var(--size-md);
169
+ }
170
+ .mx-sm {
171
+ margin-inline: var(--size-sm);
172
+ }
173
+ .mx-xl {
174
+ margin-inline: var(--size-xl);
175
+ }
176
+ .mx-xs {
177
+ margin-inline: var(--size-xs);
178
+ }
179
+ .mx-xxs {
180
+ margin-inline: var(--size-xxs);
181
+ }
214
182
 
215
- .me-0 {
216
- margin-inline-end: 0 !important;
217
- }
218
- .me-auto {
219
- margin-inline-end: auto !important;
220
- }
221
- .me-3xl {
222
- margin-inline-end: var(--size-3xl) !important;
223
- }
224
- .me-2xl {
225
- margin-inline-end: var(--size-2xl) !important;
226
- }
227
- .me {
228
- margin-inline-end: var(--size-base) !important;
229
- }
230
- .me-lg {
231
- margin-inline-end: var(--size-lg) !important;
232
- }
233
- .me-md {
234
- margin-inline-end: var(--size-md) !important;
235
- }
236
- .me-sm {
237
- margin-inline-end: var(--size-sm) !important;
238
- }
239
- .me-xl {
240
- margin-inline-end: var(--size-xl) !important;
241
- }
242
- .me-xs {
243
- margin-inline-end: var(--size-xs) !important;
244
- }
245
- .me-xxs {
246
- margin-inline-end: var(--size-xxs) !important;
247
- }
183
+ .ms-0 {
184
+ margin-inline-start: 0;
185
+ }
186
+ .ms-auto {
187
+ margin-inline-start: auto;
188
+ }
189
+ .ms-3xl {
190
+ margin-inline-start: var(--size-3xl);
191
+ }
192
+ .ms-2xl {
193
+ margin-inline-start: var(--size-2xl);
194
+ }
195
+ .ms {
196
+ margin-inline-start: var(--size-base);
197
+ }
198
+ .ms-lg {
199
+ margin-inline-start: var(--size-lg);
200
+ }
201
+ .ms-md {
202
+ margin-inline-start: var(--size-md);
203
+ }
204
+ .ms-sm {
205
+ margin-inline-start: var(--size-sm);
206
+ }
207
+ .ms-xl {
208
+ margin-inline-start: var(--size-xl);
209
+ }
210
+ .ms-xs {
211
+ margin-inline-start: var(--size-xs);
212
+ }
213
+ .ms-xxs {
214
+ margin-inline-start: var(--size-xxs);
215
+ }
248
216
 
249
- .p-0 {
250
- padding: 0 !important;
251
- }
252
- .p-3xl {
253
- padding: var(--size-3xl) !important;
254
- }
255
- .p-2xl {
256
- padding: var(--size-2xl) !important;
257
- }
258
- .p {
259
- padding: var(--size-base) !important;
260
- }
261
- .p-lg {
262
- padding: var(--size-lg) !important;
263
- }
264
- .p-md {
265
- padding: var(--size-md) !important;
266
- }
267
- .p-sm {
268
- padding: var(--size-sm) !important;
269
- }
270
- .p-xl {
271
- padding: var(--size-xl) !important;
272
- }
273
- .p-xs {
274
- padding: var(--size-xs) !important;
275
- }
276
- .p-xxs {
277
- padding: var(--size-xxs) !important;
278
- }
217
+ .me-0 {
218
+ margin-inline-end: 0;
219
+ }
220
+ .me-auto {
221
+ margin-inline-end: auto;
222
+ }
223
+ .me-3xl {
224
+ margin-inline-end: var(--size-3xl);
225
+ }
226
+ .me-2xl {
227
+ margin-inline-end: var(--size-2xl);
228
+ }
229
+ .me {
230
+ margin-inline-end: var(--size-base);
231
+ }
232
+ .me-lg {
233
+ margin-inline-end: var(--size-lg);
234
+ }
235
+ .me-md {
236
+ margin-inline-end: var(--size-md);
237
+ }
238
+ .me-sm {
239
+ margin-inline-end: var(--size-sm);
240
+ }
241
+ .me-xl {
242
+ margin-inline-end: var(--size-xl);
243
+ }
244
+ .me-xs {
245
+ margin-inline-end: var(--size-xs);
246
+ }
247
+ .me-xxs {
248
+ margin-inline-end: var(--size-xxs);
249
+ }
279
250
 
280
- .py-0 {
281
- padding-block: 0 !important;
282
- }
283
- .py-3xl {
284
- padding-block: var(--size-3xl) !important;
285
- }
286
- .py-2xl {
287
- padding-block: var(--size-2xl) !important;
288
- }
289
- .py {
290
- padding-block: var(--size-base) !important;
291
- }
292
- .py-lg {
293
- padding-block: var(--size-lg) !important;
294
- }
295
- .py-md {
296
- padding-block: var(--size-md) !important;
297
- }
298
- .py-sm {
299
- padding-block: var(--size-sm) !important;
300
- }
301
- .py-xl {
302
- padding-block: var(--size-xl) !important;
303
- }
304
- .py-xs {
305
- padding-block: var(--size-xs) !important;
306
- }
307
- .py-xxs {
308
- padding-block: var(--size-xxs) !important;
309
- }
251
+ .p-0 {
252
+ padding: 0;
253
+ }
254
+ .p-3xl {
255
+ padding: var(--size-3xl);
256
+ }
257
+ .p-2xl {
258
+ padding: var(--size-2xl);
259
+ }
260
+ .p {
261
+ padding: var(--size-base);
262
+ }
263
+ .p-lg {
264
+ padding: var(--size-lg);
265
+ }
266
+ .p-md {
267
+ padding: var(--size-md);
268
+ }
269
+ .p-sm {
270
+ padding: var(--size-sm);
271
+ }
272
+ .p-xl {
273
+ padding: var(--size-xl);
274
+ }
275
+ .p-xs {
276
+ padding: var(--size-xs);
277
+ }
278
+ .p-xxs {
279
+ padding: var(--size-xxs);
280
+ }
310
281
 
311
- .pt-0 {
312
- padding-block-start: 0 !important;
313
- }
314
- .pt-3xl {
315
- padding-block-start: var(--size-3xl) !important;
316
- }
317
- .pt-2xl {
318
- padding-block-start: var(--size-2xl) !important;
319
- }
320
- .pt {
321
- padding-block-start: var(--size-base) !important;
322
- }
323
- .pt-lg {
324
- padding-block-start: var(--size-lg) !important;
325
- }
326
- .pt-md {
327
- padding-block-start: var(--size-md) !important;
328
- }
329
- .pt-sm {
330
- padding-block-start: var(--size-sm) !important;
331
- }
332
- .pt-xl {
333
- padding-block-start: var(--size-xl) !important;
334
- }
335
- .pt-xs {
336
- padding-block-start: var(--size-xs) !important;
337
- }
338
- .pt-xxs {
339
- padding-block-start: var(--size-xxs) !important;
340
- }
282
+ .py-0 {
283
+ padding-block: 0;
284
+ }
285
+ .py-3xl {
286
+ padding-block: var(--size-3xl);
287
+ }
288
+ .py-2xl {
289
+ padding-block: var(--size-2xl);
290
+ }
291
+ .py {
292
+ padding-block: var(--size-base);
293
+ }
294
+ .py-lg {
295
+ padding-block: var(--size-lg);
296
+ }
297
+ .py-md {
298
+ padding-block: var(--size-md);
299
+ }
300
+ .py-sm {
301
+ padding-block: var(--size-sm);
302
+ }
303
+ .py-xl {
304
+ padding-block: var(--size-xl);
305
+ }
306
+ .py-xs {
307
+ padding-block: var(--size-xs);
308
+ }
309
+ .py-xxs {
310
+ padding-block: var(--size-xxs);
311
+ }
341
312
 
342
- .pb-0 {
343
- padding-block-end: 0 !important;
344
- }
345
- .pb-3xl {
346
- padding-block-end: var(--size-3xl) !important;
347
- }
348
- .pb-2xl {
349
- padding-block-end: var(--size-2xl) !important;
350
- }
351
- .pb {
352
- padding-block-end: var(--size-base) !important;
353
- }
354
- .pb-lg {
355
- padding-block-end: var(--size-lg) !important;
356
- }
357
- .pb-md {
358
- padding-block-end: var(--size-md) !important;
359
- }
360
- .pb-sm {
361
- padding-block-end: var(--size-sm) !important;
362
- }
363
- .pb-xl {
364
- padding-block-end: var(--size-xl) !important;
365
- }
366
- .pb-xs {
367
- padding-block-end: var(--size-xs) !important;
368
- }
369
- .pb-xxs {
370
- padding-block-end: var(--size-xxs) !important;
371
- }
313
+ .pt-0 {
314
+ padding-block-start: 0;
315
+ }
316
+ .pt-3xl {
317
+ padding-block-start: var(--size-3xl);
318
+ }
319
+ .pt-2xl {
320
+ padding-block-start: var(--size-2xl);
321
+ }
322
+ .pt {
323
+ padding-block-start: var(--size-base);
324
+ }
325
+ .pt-lg {
326
+ padding-block-start: var(--size-lg);
327
+ }
328
+ .pt-md {
329
+ padding-block-start: var(--size-md);
330
+ }
331
+ .pt-sm {
332
+ padding-block-start: var(--size-sm);
333
+ }
334
+ .pt-xl {
335
+ padding-block-start: var(--size-xl);
336
+ }
337
+ .pt-xs {
338
+ padding-block-start: var(--size-xs);
339
+ }
340
+ .pt-xxs {
341
+ padding-block-start: var(--size-xxs);
342
+ }
372
343
 
373
- .px-0 {
374
- padding-inline: 0 !important;
375
- }
376
- .px-3xl {
377
- padding-inline: var(--size-3xl) !important;
378
- }
379
- .px-2xl {
380
- padding-inline: var(--size-2xl) !important;
381
- }
382
- .px {
383
- padding-inline: var(--size-base) !important;
384
- }
385
- .px-lg {
386
- padding-inline: var(--size-lg) !important;
387
- }
388
- .px-md {
389
- padding-inline: var(--size-md) !important;
390
- }
391
- .px-sm {
392
- padding-inline: var(--size-sm) !important;
393
- }
394
- .px-xl {
395
- padding-inline: var(--size-xl) !important;
396
- }
397
- .px-xs {
398
- padding-inline: var(--size-xs) !important;
399
- }
400
- .px-xxs {
401
- padding-inline: var(--size-xxs) !important;
402
- }
344
+ .pb-0 {
345
+ padding-block-end: 0;
346
+ }
347
+ .pb-3xl {
348
+ padding-block-end: var(--size-3xl);
349
+ }
350
+ .pb-2xl {
351
+ padding-block-end: var(--size-2xl);
352
+ }
353
+ .pb {
354
+ padding-block-end: var(--size-base);
355
+ }
356
+ .pb-lg {
357
+ padding-block-end: var(--size-lg);
358
+ }
359
+ .pb-md {
360
+ padding-block-end: var(--size-md);
361
+ }
362
+ .pb-sm {
363
+ padding-block-end: var(--size-sm);
364
+ }
365
+ .pb-xl {
366
+ padding-block-end: var(--size-xl);
367
+ }
368
+ .pb-xs {
369
+ padding-block-end: var(--size-xs);
370
+ }
371
+ .pb-xxs {
372
+ padding-block-end: var(--size-xxs);
373
+ }
403
374
 
404
- .ps-0 {
405
- padding-inline-start: 0 !important;
406
- }
407
- .ps-3xl {
408
- padding-inline-start: var(--size-3xl) !important;
409
- }
410
- .ps-2xl {
411
- padding-inline-start: var(--size-2xl) !important;
412
- }
413
- .ps {
414
- padding-inline-start: var(--size-base) !important;
415
- }
416
- .ps-lg {
417
- padding-inline-start: var(--size-lg) !important;
418
- }
419
- .ps-md {
420
- padding-inline-start: var(--size-md) !important;
421
- }
422
- .ps-sm {
423
- padding-inline-start: var(--size-sm) !important;
424
- }
425
- .ps-xl {
426
- padding-inline-start: var(--size-xl) !important;
427
- }
428
- .ps-xs {
429
- padding-inline-start: var(--size-xs) !important;
430
- }
431
- .ps-xxs {
432
- padding-inline-start: var(--size-xxs) !important;
433
- }
375
+ .px-0 {
376
+ padding-inline: 0;
377
+ }
378
+ .px-3xl {
379
+ padding-inline: var(--size-3xl);
380
+ }
381
+ .px-2xl {
382
+ padding-inline: var(--size-2xl);
383
+ }
384
+ .px {
385
+ padding-inline: var(--size-base);
386
+ }
387
+ .px-lg {
388
+ padding-inline: var(--size-lg);
389
+ }
390
+ .px-md {
391
+ padding-inline: var(--size-md);
392
+ }
393
+ .px-sm {
394
+ padding-inline: var(--size-sm);
395
+ }
396
+ .px-xl {
397
+ padding-inline: var(--size-xl);
398
+ }
399
+ .px-xs {
400
+ padding-inline: var(--size-xs);
401
+ }
402
+ .px-xxs {
403
+ padding-inline: var(--size-xxs);
404
+ }
405
+
406
+ .ps-0 {
407
+ padding-inline-start: 0;
408
+ }
409
+ .ps-3xl {
410
+ padding-inline-start: var(--size-3xl);
411
+ }
412
+ .ps-2xl {
413
+ padding-inline-start: var(--size-2xl);
414
+ }
415
+ .ps {
416
+ padding-inline-start: var(--size-base);
417
+ }
418
+ .ps-lg {
419
+ padding-inline-start: var(--size-lg);
420
+ }
421
+ .ps-md {
422
+ padding-inline-start: var(--size-md);
423
+ }
424
+ .ps-sm {
425
+ padding-inline-start: var(--size-sm);
426
+ }
427
+ .ps-xl {
428
+ padding-inline-start: var(--size-xl);
429
+ }
430
+ .ps-xs {
431
+ padding-inline-start: var(--size-xs);
432
+ }
433
+ .ps-xxs {
434
+ padding-inline-start: var(--size-xxs);
435
+ }
436
+
437
+ .pe-0 {
438
+ padding-inline-end: 0;
439
+ }
440
+ .pe-3xl {
441
+ padding-inline-end: var(--size-3xl);
442
+ }
443
+ .pe-2xl {
444
+ padding-inline-end: var(--size-2xl);
445
+ }
446
+ .pe {
447
+ padding-inline-end: var(--size-base);
448
+ }
449
+ .pe-lg {
450
+ padding-inline-end: var(--size-lg);
451
+ }
452
+ .pe-md {
453
+ padding-inline-end: var(--size-md);
454
+ }
455
+ .pe-sm {
456
+ padding-inline-end: var(--size-sm);
457
+ }
458
+ .pe-xl {
459
+ padding-inline-end: var(--size-xl);
460
+ }
461
+ .pe-xs {
462
+ padding-inline-end: var(--size-xs);
463
+ }
464
+ .pe-xxs {
465
+ padding-inline-end: var(--size-xxs);
466
+ }
434
467
 
435
- .pe-0 {
436
- padding-inline-end: 0 !important;
437
- }
438
- .pe-3xl {
439
- padding-inline-end: var(--size-3xl) !important;
440
- }
441
- .pe-2xl {
442
- padding-inline-end: var(--size-2xl) !important;
443
- }
444
- .pe {
445
- padding-inline-end: var(--size-base) !important;
446
- }
447
- .pe-lg {
448
- padding-inline-end: var(--size-lg) !important;
449
- }
450
- .pe-md {
451
- padding-inline-end: var(--size-md) !important;
452
- }
453
- .pe-sm {
454
- padding-inline-end: var(--size-sm) !important;
455
- }
456
- .pe-xl {
457
- padding-inline-end: var(--size-xl) !important;
458
- }
459
- .pe-xs {
460
- padding-inline-end: var(--size-xs) !important;
461
- }
462
- .pe-xxs {
463
- padding-inline-end: var(--size-xxs) !important;
464
468
  }