@primer/brand-css 0.0.0-20250212132611

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 (75) hide show
  1. package/components/Accordion/Accordion.css +305 -0
  2. package/components/ActionMenu/ActionMenu.css +187 -0
  3. package/components/AnchorNav/AnchorNav.css +427 -0
  4. package/components/Avatar/Avatar.css +115 -0
  5. package/components/Bento/Bento.css +2157 -0
  6. package/components/Box/Box.css +2795 -0
  7. package/components/Box/Box.features.css +48 -0
  8. package/components/Breadcrumbs/Breadcrumbs.css +81 -0
  9. package/components/BreakoutBanner/BreakoutBanner.css +109 -0
  10. package/components/Button/Button.css +207 -0
  11. package/components/ButtonGroup/ButtonGroup.css +10 -0
  12. package/components/CTABanner/CTABanner.css +104 -0
  13. package/components/CTAForm/CTAForm.css +48 -0
  14. package/components/Card/Card.css +183 -0
  15. package/components/ComparisonTable/ComparisonTable.css +290 -0
  16. package/components/ExpandableArrow/ExpandableArrow.css +26 -0
  17. package/components/EyebrowBanner/EyebrowBanner.css +320 -0
  18. package/components/FAQ/FAQ.css +51 -0
  19. package/components/FAQ/FAQGroup.css +51 -0
  20. package/components/Footnotes/Footnotes.css +35 -0
  21. package/components/FrostedGlassVFX/FrostedGlassVFX.css +50 -0
  22. package/components/Grid/Grid.css +741 -0
  23. package/components/Heading/Heading.css +284 -0
  24. package/components/Hero/Hero.css +87 -0
  25. package/components/IDE/IDE.css +392 -0
  26. package/components/Icon/Icon.css +121 -0
  27. package/components/Image/Image.css +54 -0
  28. package/components/InlineLink/InlineLink.css +30 -0
  29. package/components/Label/Label.css +167 -0
  30. package/components/Link/Link.css +84 -0
  31. package/components/LogoSuite/LogoSuite.css +165 -0
  32. package/components/MinimalFooter/MinimalFooter.css +116 -0
  33. package/components/MonaSans/MonaSans.css +4 -0
  34. package/components/Pagination/Pagination.css +117 -0
  35. package/components/Pillar/Pillar.css +106 -0
  36. package/components/PricingOptions/PricingOptions.css +357 -0
  37. package/components/Prose/Prose.css +332 -0
  38. package/components/Section/Section.css +156 -0
  39. package/components/Section/Section.features.css +33 -0
  40. package/components/SectionIntro/SectionIntro.css +48 -0
  41. package/components/Stack/Stack.css +793 -0
  42. package/components/Statistic/Statistic.css +91 -0
  43. package/components/SubNav/SubNav.css +678 -0
  44. package/components/SubdomainNavBar/SubdomainNavBar.css +728 -0
  45. package/components/Testimonial/Testimonial.css +228 -0
  46. package/components/Text/Text.css +195 -0
  47. package/components/Timeline/Timeline.css +79 -0
  48. package/components/Tooltip/Tooltip.css +170 -0
  49. package/components/VideoPlayer/VideoPlayer.css +348 -0
  50. package/components/VideoPlayer/components/Captions/Captions.css +17 -0
  51. package/components/VideoPlayer/components/VolumeControl/VolumeControl.css +3 -0
  52. package/components/animation/Animation.css +192 -0
  53. package/components/animation/TextRevealAnimation/TextRevealAnimation.css +38 -0
  54. package/components/forms/Checkbox/Checkbox.css +88 -0
  55. package/components/forms/ControlGroup/ControlGroup.css +59 -0
  56. package/components/forms/FormControl/FormControl.css +113 -0
  57. package/components/forms/Radio/Radio.css +111 -0
  58. package/components/forms/Select/Select.css +143 -0
  59. package/components/forms/TextInput/TextInput.css +266 -0
  60. package/components/forms/Textarea/Textarea.css +129 -0
  61. package/components/list/ListItem/ListItem.css +29 -0
  62. package/components/list/OrderedList/OrderedList.css +3 -0
  63. package/components/list/list-shared.css +10 -0
  64. package/components/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.css +204 -0
  65. package/components/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.css +57 -0
  66. package/components/recipes/FeaturePreviewLPs/FeaturePreviewLevelZero/FeaturePreviewLevelZero.css +3 -0
  67. package/components/recipes/SolutionTemplates/CategoryPage/CategoryPage.css +83 -0
  68. package/components/recipes/SolutionTemplates/SolutionPage/SolutionPage.css +119 -0
  69. package/components/recipes/SolutionTemplates/SolutionsOverview/SolutionsOverview.css +35 -0
  70. package/components/recipes/SolutionTemplates/parallax.css +165 -0
  71. package/components/recipes/seo/Article/Article.css +289 -0
  72. package/components/recipes/seo/Category/CategoryPage.css +43 -0
  73. package/components/river/RiverStoryScroll/RiverStoryScroll.css +470 -0
  74. package/components/river/river-shared.css +205 -0
  75. package/package.json +42 -0
@@ -0,0 +1,793 @@
1
+ .Stack {
2
+ display: flex;
3
+ }
4
+
5
+ /*
6
+ * Direction
7
+ */
8
+ .Stack--vertical {
9
+ flex-direction: column;
10
+ }
11
+
12
+ .Stack--horizontal {
13
+ flex-direction: row;
14
+ }
15
+
16
+ .Stack-narrow--vertical {
17
+ flex-direction: column;
18
+ }
19
+
20
+ .Stack-narrow--horizontal {
21
+ flex-direction: row;
22
+ }
23
+
24
+ @media screen and (min-width: 48rem) {
25
+ .Stack-regular--vertical {
26
+ flex-direction: column;
27
+ }
28
+
29
+ .Stack-regular--horizontal {
30
+ flex-direction: row;
31
+ }
32
+ }
33
+
34
+ @media screen and (min-width: 80rem) {
35
+ .Stack-wide--vertical {
36
+ flex-direction: column;
37
+ }
38
+
39
+ .Stack-wide--horizontal {
40
+ flex-direction: row;
41
+ }
42
+ }
43
+
44
+ /*
45
+ * Gap and padding
46
+ */
47
+ .Stack--gap-none {
48
+ gap: 0;
49
+ }
50
+
51
+ .Stack--gap-condensed {
52
+ gap: var(--brand-stack-gap-condensed);
53
+ }
54
+
55
+ .Stack--gap-normal {
56
+ gap: var(--brand-stack-gap-normal);
57
+ }
58
+
59
+ .Stack--gap-spacious {
60
+ gap: var(--brand-stack-gap-spacious);
61
+ }
62
+
63
+ .Stack--gap-4 {
64
+ gap: var(--base-size-4);
65
+ }
66
+ .Stack--gap-8 {
67
+ gap: var(--base-size-8);
68
+ }
69
+ .Stack--gap-12 {
70
+ gap: var(--base-size-12);
71
+ }
72
+ .Stack--gap-16 {
73
+ gap: var(--base-size-16);
74
+ }
75
+ .Stack--gap-20 {
76
+ gap: var(--base-size-20);
77
+ }
78
+ .Stack--gap-24 {
79
+ gap: var(--base-size-24);
80
+ }
81
+ .Stack--gap-28 {
82
+ gap: var(--base-size-28);
83
+ }
84
+ .Stack--gap-32 {
85
+ gap: var(--base-size-32);
86
+ }
87
+ .Stack--gap-36 {
88
+ gap: var(--base-size-36);
89
+ }
90
+ .Stack--gap-40 {
91
+ gap: var(--base-size-40);
92
+ }
93
+ .Stack--gap-44 {
94
+ gap: var(--base-size-44);
95
+ }
96
+ .Stack--gap-48 {
97
+ gap: var(--base-size-48);
98
+ }
99
+ .Stack--gap-64 {
100
+ gap: var(--base-size-64);
101
+ }
102
+ .Stack--gap-80 {
103
+ gap: var(--base-size-80);
104
+ }
105
+ .Stack--gap-96 {
106
+ gap: var(--base-size-96);
107
+ }
108
+ .Stack--gap-112 {
109
+ gap: var(--base-size-112);
110
+ }
111
+ .Stack--gap-128 {
112
+ gap: var(--base-size-128);
113
+ }
114
+
115
+ .Stack-narrow--gap-none {
116
+ gap: 0;
117
+ }
118
+
119
+ .Stack-narrow--gap-condensed {
120
+ gap: var(--brand-stack-gap-condensed);
121
+ }
122
+
123
+ .Stack-narrow--gap-normal {
124
+ gap: var(--brand-stack-gap-normal);
125
+ }
126
+
127
+ .Stack-narrow--gap-spacious {
128
+ gap: var(--brand-stack-gap-spacious);
129
+ }
130
+
131
+ .Stack--padding-none {
132
+ padding: 0;
133
+ }
134
+
135
+ .Stack--padding-condensed {
136
+ padding: var(--brand-stack-padding-condensed);
137
+ }
138
+
139
+ .Stack--padding-normal {
140
+ padding: var(--brand-stack-padding-normal);
141
+ }
142
+
143
+ .Stack--padding-spacious {
144
+ padding: var(--brand-stack-padding-spacious);
145
+ }
146
+
147
+ .Stack--padding-4 {
148
+ padding: var(--base-size-4);
149
+ }
150
+ .Stack--padding-8 {
151
+ padding: var(--base-size-8);
152
+ }
153
+ .Stack--padding-12 {
154
+ padding: var(--base-size-12);
155
+ }
156
+ .Stack--padding-16 {
157
+ padding: var(--base-size-16);
158
+ }
159
+ .Stack--padding-20 {
160
+ padding: var(--base-size-20);
161
+ }
162
+ .Stack--padding-24 {
163
+ padding: var(--base-size-24);
164
+ }
165
+ .Stack--padding-28 {
166
+ padding: var(--base-size-28);
167
+ }
168
+ .Stack--padding-32 {
169
+ padding: var(--base-size-32);
170
+ }
171
+ .Stack--padding-36 {
172
+ padding: var(--base-size-36);
173
+ }
174
+ .Stack--padding-40 {
175
+ padding: var(--base-size-40);
176
+ }
177
+ .Stack--padding-44 {
178
+ padding: var(--base-size-44);
179
+ }
180
+ .Stack--padding-48 {
181
+ padding: var(--base-size-48);
182
+ }
183
+ .Stack--padding-64 {
184
+ padding: var(--base-size-64);
185
+ }
186
+ .Stack--padding-80 {
187
+ padding: var(--base-size-80);
188
+ }
189
+ .Stack--padding-96 {
190
+ padding: var(--base-size-96);
191
+ }
192
+ .Stack--padding-112 {
193
+ padding: var(--base-size-112);
194
+ }
195
+ .Stack--padding-128 {
196
+ padding: var(--base-size-128);
197
+ }
198
+
199
+ .Stack-narrow--padding-none {
200
+ padding: 0;
201
+ }
202
+
203
+ .Stack-narrow--padding-condensed {
204
+ padding: var(--brand-stack-padding-condensed);
205
+ }
206
+
207
+ .Stack-narrow--padding-normal {
208
+ padding: var(--brand-stack-padding-normal);
209
+ }
210
+
211
+ .Stack-narrow--padding-spacious {
212
+ padding: var(--brand-stack-padding-spacious);
213
+ }
214
+
215
+ .Stack-narrow--padding-4 {
216
+ padding: var(--base-size-4);
217
+ }
218
+ .Stack-narrow--padding-8 {
219
+ padding: var(--base-size-8);
220
+ }
221
+ .Stack-narrow--padding-12 {
222
+ padding: var(--base-size-12);
223
+ }
224
+ .Stack-narrow--padding-16 {
225
+ padding: var(--base-size-16);
226
+ }
227
+ .Stack-narrow--padding-20 {
228
+ padding: var(--base-size-20);
229
+ }
230
+ .Stack-narrow--padding-24 {
231
+ padding: var(--base-size-24);
232
+ }
233
+ .Stack-narrow--padding-28 {
234
+ padding: var(--base-size-28);
235
+ }
236
+ .Stack-narrow--padding-32 {
237
+ padding: var(--base-size-32);
238
+ }
239
+ .Stack-narrow--padding-36 {
240
+ padding: var(--base-size-36);
241
+ }
242
+ .Stack-narrow--padding-40 {
243
+ padding: var(--base-size-40);
244
+ }
245
+ .Stack-narrow--padding-44 {
246
+ padding: var(--base-size-44);
247
+ }
248
+ .Stack-narrow--padding-48 {
249
+ padding: var(--base-size-48);
250
+ }
251
+ .Stack-narrow--padding-64 {
252
+ padding: var(--base-size-64);
253
+ }
254
+ .Stack-narrow--padding-80 {
255
+ padding: var(--base-size-80);
256
+ }
257
+ .Stack-narrow--padding-96 {
258
+ padding: var(--base-size-96);
259
+ }
260
+ .Stack-narrow--padding-112 {
261
+ padding: var(--base-size-112);
262
+ }
263
+ .Stack-narrow--padding-128 {
264
+ padding: var(--base-size-128);
265
+ }
266
+
267
+ .Stack-narrow--gap-4 {
268
+ gap: var(--base-size-4);
269
+ }
270
+ .Stack-narrow--gap-8 {
271
+ gap: var(--base-size-8);
272
+ }
273
+ .Stack-narrow--gap-12 {
274
+ gap: var(--base-size-12);
275
+ }
276
+ .Stack-narrow--gap-16 {
277
+ gap: var(--base-size-16);
278
+ }
279
+ .Stack-narrow--gap-20 {
280
+ gap: var(--base-size-20);
281
+ }
282
+ .Stack-narrow--gap-24 {
283
+ gap: var(--base-size-24);
284
+ }
285
+ .Stack-narrow--gap-28 {
286
+ gap: var(--base-size-28);
287
+ }
288
+ .Stack-narrow--gap-32 {
289
+ gap: var(--base-size-32);
290
+ }
291
+ .Stack-narrow--gap-36 {
292
+ gap: var(--base-size-36);
293
+ }
294
+ .Stack-narrow--gap-40 {
295
+ gap: var(--base-size-40);
296
+ }
297
+ .Stack-narrow--gap-44 {
298
+ gap: var(--base-size-44);
299
+ }
300
+ .Stack-narrow--gap-48 {
301
+ gap: var(--base-size-48);
302
+ }
303
+ .Stack-narrow--gap-64 {
304
+ gap: var(--base-size-64);
305
+ }
306
+ .Stack-narrow--gap-80 {
307
+ gap: var(--base-size-80);
308
+ }
309
+ .Stack-narrow--gap-96 {
310
+ gap: var(--base-size-96);
311
+ }
312
+ .Stack-narrow--gap-112 {
313
+ gap: var(--base-size-112);
314
+ }
315
+ .Stack-narrow--gap-128 {
316
+ gap: var(--base-size-128);
317
+ }
318
+
319
+ @media screen and (min-width: 48rem) {
320
+ .Stack-regular--gap-none {
321
+ gap: 0;
322
+ }
323
+
324
+ .Stack-regular--gap-condensed {
325
+ gap: var(--brand-stack-gap-condensed);
326
+ }
327
+
328
+ .Stack-regular--gap-normal {
329
+ gap: var(--brand-stack-gap-normal);
330
+ }
331
+
332
+ .Stack-regular--gap-spacious {
333
+ gap: var(--brand-stack-gap-spacious);
334
+ }
335
+
336
+ .Stack-regular--gap-4 {
337
+ gap: var(--base-size-4);
338
+ }
339
+ .Stack-regular--gap-8 {
340
+ gap: var(--base-size-8);
341
+ }
342
+ .Stack-regular--gap-12 {
343
+ gap: var(--base-size-12);
344
+ }
345
+ .Stack-regular--gap-16 {
346
+ gap: var(--base-size-16);
347
+ }
348
+ .Stack-regular--gap-20 {
349
+ gap: var(--base-size-20);
350
+ }
351
+ .Stack-regular--gap-24 {
352
+ gap: var(--base-size-24);
353
+ }
354
+ .Stack-regular--gap-28 {
355
+ gap: var(--base-size-28);
356
+ }
357
+ .Stack-regular--gap-32 {
358
+ gap: var(--base-size-32);
359
+ }
360
+ .Stack-regular--gap-36 {
361
+ gap: var(--base-size-36);
362
+ }
363
+ .Stack-regular--gap-40 {
364
+ gap: var(--base-size-40);
365
+ }
366
+ .Stack-regular--gap-44 {
367
+ gap: var(--base-size-44);
368
+ }
369
+ .Stack-regular--gap-48 {
370
+ gap: var(--base-size-48);
371
+ }
372
+ .Stack-regular--gap-64 {
373
+ gap: var(--base-size-64);
374
+ }
375
+ .Stack-regular--gap-80 {
376
+ gap: var(--base-size-80);
377
+ }
378
+ .Stack-regular--gap-96 {
379
+ gap: var(--base-size-96);
380
+ }
381
+ .Stack-regular--gap-112 {
382
+ gap: var(--base-size-112);
383
+ }
384
+ .Stack-regular--gap-128 {
385
+ gap: var(--base-size-128);
386
+ }
387
+
388
+ .Stack-regular--padding-none {
389
+ padding: 0;
390
+ }
391
+
392
+ .Stack-regular--padding-condensed {
393
+ padding: var(--brand-stack-padding-condensed);
394
+ }
395
+
396
+ .Stack-regular--padding-normal {
397
+ padding: var(--brand-stack-padding-normal);
398
+ }
399
+
400
+ .Stack-regular--padding-spacious {
401
+ padding: var(--brand-stack-padding-spacious);
402
+ }
403
+
404
+ .Stack-regular--padding-4 {
405
+ padding: var(--base-size-4);
406
+ }
407
+ .Stack-regular--padding-8 {
408
+ padding: var(--base-size-8);
409
+ }
410
+ .Stack-regular--padding-12 {
411
+ padding: var(--base-size-12);
412
+ }
413
+ .Stack-regular--padding-16 {
414
+ padding: var(--base-size-16);
415
+ }
416
+ .Stack-regular--padding-20 {
417
+ padding: var(--base-size-20);
418
+ }
419
+ .Stack-regular--padding-24 {
420
+ padding: var(--base-size-24);
421
+ }
422
+ .Stack-regular--padding-28 {
423
+ padding: var(--base-size-28);
424
+ }
425
+ .Stack-regular--padding-32 {
426
+ padding: var(--base-size-32);
427
+ }
428
+ .Stack-regular--padding-36 {
429
+ padding: var(--base-size-36);
430
+ }
431
+ .Stack-regular--padding-40 {
432
+ padding: var(--base-size-40);
433
+ }
434
+ .Stack-regular--padding-44 {
435
+ padding: var(--base-size-44);
436
+ }
437
+ .Stack-regular--padding-48 {
438
+ padding: var(--base-size-48);
439
+ }
440
+ .Stack-regular--padding-64 {
441
+ padding: var(--base-size-64);
442
+ }
443
+ .Stack-regular--padding-80 {
444
+ padding: var(--base-size-80);
445
+ }
446
+ .Stack-regular--padding-96 {
447
+ padding: var(--base-size-96);
448
+ }
449
+ .Stack-regular--padding-112 {
450
+ padding: var(--base-size-112);
451
+ }
452
+ .Stack-regular--padding-128 {
453
+ padding: var(--base-size-128);
454
+ }
455
+ }
456
+
457
+ @media screen and (min-width: 80rem) {
458
+ .Stack-wide--gap-none {
459
+ gap: 0;
460
+ }
461
+
462
+ .Stack-wide--gap-condensed {
463
+ gap: var(--brand-stack-gap-condensed);
464
+ }
465
+
466
+ .Stack-wide--gap-normal {
467
+ gap: var(--brand-stack-gap-normal);
468
+ }
469
+
470
+ .Stack-wide--gap-spacious {
471
+ gap: var(--brand-stack-gap-spacious);
472
+ }
473
+
474
+ .Stack-wide--gap-4 {
475
+ gap: var(--base-size-4);
476
+ }
477
+ .Stack-wide--gap-8 {
478
+ gap: var(--base-size-8);
479
+ }
480
+ .Stack-wide--gap-12 {
481
+ gap: var(--base-size-12);
482
+ }
483
+ .Stack-wide--gap-16 {
484
+ gap: var(--base-size-16);
485
+ }
486
+ .Stack-wide--gap-20 {
487
+ gap: var(--base-size-20);
488
+ }
489
+ .Stack-wide--gap-24 {
490
+ gap: var(--base-size-24);
491
+ }
492
+ .Stack-wide--gap-28 {
493
+ gap: var(--base-size-28);
494
+ }
495
+ .Stack-wide--gap-32 {
496
+ gap: var(--base-size-32);
497
+ }
498
+ .Stack-wide--gap-36 {
499
+ gap: var(--base-size-36);
500
+ }
501
+ .Stack-wide--gap-40 {
502
+ gap: var(--base-size-40);
503
+ }
504
+ .Stack-wide--gap-44 {
505
+ gap: var(--base-size-44);
506
+ }
507
+ .Stack-wide--gap-48 {
508
+ gap: var(--base-size-48);
509
+ }
510
+ .Stack-wide--gap-64 {
511
+ gap: var(--base-size-64);
512
+ }
513
+ .Stack-wide--gap-80 {
514
+ gap: var(--base-size-80);
515
+ }
516
+ .Stack-wide--gap-96 {
517
+ gap: var(--base-size-96);
518
+ }
519
+ .Stack-wide--gap-112 {
520
+ gap: var(--base-size-112);
521
+ }
522
+ .Stack-wide--gap-128 {
523
+ gap: var(--base-size-128);
524
+ }
525
+
526
+ .Stack-wide--padding-none {
527
+ padding: 0;
528
+ }
529
+
530
+ .Stack-wide--padding-condensed {
531
+ padding: var(--brand-stack-padding-condensed);
532
+ }
533
+
534
+ .Stack-wide--padding-normal {
535
+ padding: var(--brand-stack-padding-normal);
536
+ }
537
+
538
+ .Stack-wide--padding-spacious {
539
+ padding: var(--brand-stack-padding-spacious);
540
+ }
541
+
542
+ .Stack-wide--padding-4 {
543
+ padding: var(--base-size-4);
544
+ }
545
+ .Stack-wide--padding-8 {
546
+ padding: var(--base-size-8);
547
+ }
548
+ .Stack-wide--padding-12 {
549
+ padding: var(--base-size-12);
550
+ }
551
+ .Stack-wide--padding-16 {
552
+ padding: var(--base-size-16);
553
+ }
554
+ .Stack-wide--padding-20 {
555
+ padding: var(--base-size-20);
556
+ }
557
+ .Stack-wide--padding-24 {
558
+ padding: var(--base-size-24);
559
+ }
560
+ .Stack-wide--padding-28 {
561
+ padding: var(--base-size-28);
562
+ }
563
+ .Stack-wide--padding-32 {
564
+ padding: var(--base-size-32);
565
+ }
566
+ .Stack-wide--padding-36 {
567
+ padding: var(--base-size-36);
568
+ }
569
+ .Stack-wide--padding-40 {
570
+ padding: var(--base-size-40);
571
+ }
572
+ .Stack-wide--padding-44 {
573
+ padding: var(--base-size-44);
574
+ }
575
+ .Stack-wide--padding-48 {
576
+ padding: var(--base-size-48);
577
+ }
578
+ .Stack-wide--padding-64 {
579
+ padding: var(--base-size-64);
580
+ }
581
+ .Stack-wide--padding-80 {
582
+ padding: var(--base-size-80);
583
+ }
584
+ .Stack-wide--padding-96 {
585
+ padding: var(--base-size-96);
586
+ }
587
+ .Stack-wide--padding-112 {
588
+ padding: var(--base-size-112);
589
+ }
590
+ .Stack-wide--padding-128 {
591
+ padding: var(--base-size-128);
592
+ }
593
+ }
594
+
595
+ /*
596
+ * Vertical alignment
597
+ */
598
+
599
+ .Stack--align-items-flex-end {
600
+ align-items: flex-end;
601
+ }
602
+
603
+ .Stack--align-items-flex-start {
604
+ align-items: flex-start;
605
+ }
606
+
607
+ .Stack--align-items-center {
608
+ align-items: center;
609
+ }
610
+
611
+ .Stack-narrow--align-items-flex-end {
612
+ align-items: flex-end;
613
+ }
614
+
615
+ .Stack-narrow--align-items-flex-start {
616
+ align-items: flex-start;
617
+ }
618
+
619
+ .Stack-narrow--align-items-center {
620
+ align-items: center;
621
+ }
622
+
623
+ @media screen and (min-width: 48rem) {
624
+ .Stack-regular--align-items-flex-end {
625
+ align-items: flex-end;
626
+ }
627
+
628
+ .Stack-regular--align-items-flex-start {
629
+ align-items: flex-start;
630
+ }
631
+
632
+ .Stack-regular--align-items-center {
633
+ align-items: center;
634
+ }
635
+ }
636
+
637
+ @media screen and (min-width: 80rem) {
638
+ .Stack-wide--align-items-flex-end {
639
+ align-items: flex-end;
640
+ }
641
+
642
+ .Stack-wide--align-items-flex-start {
643
+ align-items: flex-start;
644
+ }
645
+
646
+ .Stack-wide--align-items-center {
647
+ align-items: center;
648
+ }
649
+ }
650
+
651
+ /*
652
+ * Horizontal alignment
653
+ */
654
+
655
+ .Stack--justify-content-flex-end {
656
+ justify-content: flex-end;
657
+ }
658
+
659
+ .Stack--justify-content-flex-start {
660
+ justify-content: flex-start;
661
+ }
662
+
663
+ .Stack--justify-content-center {
664
+ justify-content: center;
665
+ }
666
+
667
+ .Stack--justify-content-space-between {
668
+ justify-content: space-between;
669
+ }
670
+
671
+ .Stack--justify-content-space-evenly {
672
+ justify-content: space-evenly;
673
+ }
674
+
675
+ .Stack--justify-content-space-around {
676
+ justify-content: space-around;
677
+ }
678
+
679
+ .Stack-narrow--justify-content-flex-end {
680
+ justify-content: flex-end;
681
+ }
682
+
683
+ .Stack-narrow--justify-content-flex-start {
684
+ justify-content: flex-start;
685
+ }
686
+
687
+ .Stack-narrow--justify-content-center {
688
+ justify-content: center;
689
+ }
690
+
691
+ .Stack-narrow--justify-content-space-between {
692
+ justify-content: space-between;
693
+ }
694
+
695
+ .Stack-narrow--justify-content-space-evenly {
696
+ justify-content: space-evenly;
697
+ }
698
+
699
+ .Stack-narrow--justify-content-space-around {
700
+ justify-content: space-around;
701
+ }
702
+
703
+ @media screen and (min-width: 48rem) {
704
+ .Stack-regular--justify-content-flex-end {
705
+ justify-content: flex-end;
706
+ }
707
+
708
+ .Stack-regular--justify-content-flex-start {
709
+ justify-content: flex-start;
710
+ }
711
+
712
+ .Stack-regular--justify-content-center {
713
+ justify-content: center;
714
+ }
715
+
716
+ .Stack-regular--justify-content-space-between {
717
+ justify-content: space-between;
718
+ }
719
+
720
+ .Stack-regular--justify-content-space-evenly {
721
+ justify-content: space-evenly;
722
+ }
723
+
724
+ .Stack-regular--justify-content-space-around {
725
+ justify-content: space-around;
726
+ }
727
+ }
728
+
729
+ @media screen and (min-width: 80rem) {
730
+ .Stack-wide--justify-content-flex-end {
731
+ justify-content: flex-end;
732
+ }
733
+
734
+ .Stack-wide--justify-content-flex-start {
735
+ justify-content: flex-start;
736
+ }
737
+
738
+ .Stack-wide--justify-content-center {
739
+ justify-content: center;
740
+ }
741
+
742
+ .Stack-wide--justify-content-space-between {
743
+ justify-content: space-between;
744
+ }
745
+
746
+ .Stack-wide--justify-content-space-evenly {
747
+ justify-content: space-evenly;
748
+ }
749
+
750
+ .Stack-wide--justify-content-space-around {
751
+ justify-content: space-around;
752
+ }
753
+ }
754
+
755
+ /*
756
+ * Wrap
757
+ */
758
+
759
+ .Stack-flexWrap--wrap {
760
+ flex-wrap: wrap;
761
+ }
762
+
763
+ .Stack-flexWrap--no-wrap {
764
+ flex-wrap: nowrap;
765
+ }
766
+
767
+ .Stack-narrow-flexWrap--wrap {
768
+ flex-wrap: wrap;
769
+ }
770
+
771
+ .Stack-narrow-flexWrap--no-wrap {
772
+ flex-wrap: nowrap;
773
+ }
774
+
775
+ @media screen and (min-width: 48rem) {
776
+ .Stack-regular-flexWrap--wrap {
777
+ flex-wrap: wrap;
778
+ }
779
+
780
+ .Stack-regular-flexWrap--no-wrap {
781
+ flex-wrap: nowrap;
782
+ }
783
+ }
784
+
785
+ @media screen and (min-width: 80rem) {
786
+ .Stack-wide-flexWrap--wrap {
787
+ flex-wrap: wrap;
788
+ }
789
+
790
+ .Stack-wide-flexWrap--no-wrap {
791
+ flex-wrap: nowrap;
792
+ }
793
+ }