@patternfly/quickstarts 6.0.0-prerelease.1 → 6.0.0-prerelease.2

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 (17) hide show
  1. package/dist/index.es.js +3 -4
  2. package/dist/index.es.js.map +1 -1
  3. package/dist/index.js +3 -4
  4. package/dist/index.js.map +1 -1
  5. package/dist/patternfly-global.css +84 -63
  6. package/dist/patternfly-nested.css +382 -91
  7. package/dist/quickstarts-base.css +4 -4
  8. package/dist/quickstarts-full.es.js +18 -18
  9. package/dist/quickstarts-full.es.js.map +1 -1
  10. package/dist/quickstarts-standalone.min.css +2 -2
  11. package/dist/quickstarts.css +4 -4
  12. package/dist/quickstarts.min.css +1 -1
  13. package/package.json +10 -10
  14. package/src/catalog/QuickStartCatalog.tsx +1 -1
  15. package/src/catalog/QuickStartTileHeader.tsx +1 -2
  16. package/src/controller/QuickStartTaskHeaderList.tsx +1 -1
  17. package/src/controller/QuickStartTasks.tsx +1 -1
package/dist/patternfly-nested.css CHANGED
@@ -206,6 +206,7 @@
206
206
  --pf-v6-c-alert--FontSize: var(--pf-t--global--font--size--body--default);
207
207
  --pf-v6-c-alert__toggle--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
208
208
  --pf-v6-c-alert__toggle--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
209
+ --pf-v6-c-alert__toggle--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--action--horizontal--plain--default));
209
210
  --pf-v6-c-alert__toggle--MarginInlineEnd: var(--pf-t--global--spacer--sm);
210
211
  --pf-v6-c-alert__toggle-icon--Rotate: 0;
211
212
  --pf-v6-c-alert__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
@@ -323,6 +324,7 @@
323
324
  .pfext-quick-start__base .pf-v6-c-alert__toggle {
324
325
  margin-block-start: var(--pf-v6-c-alert__toggle--MarginBlockStart);
325
326
  margin-block-end: var(--pf-v6-c-alert__toggle--MarginBlockEnd);
327
+ margin-inline-start: var(--pf-v6-c-alert__toggle--MarginInlineStart);
326
328
  margin-inline-end: var(--pf-v6-c-alert__toggle--MarginInlineEnd);
327
329
  }
328
330
  .pfext-quick-start__base .pf-v6-c-alert__toggle-icon {
@@ -334,9 +336,7 @@
334
336
  scale: -1 1;
335
337
  }
336
338
  .pfext-quick-start__base .pf-v6-c-alert__icon {
337
- display: flex;
338
339
  grid-area: icon;
339
- margin-block-start: var(--pf-v6-c-alert__icon--MarginBlockStart);
340
340
  margin-inline-end: var(--pf-v6-c-alert__icon--MarginInlineEnd);
341
341
  font-size: var(--pf-v6-c-alert__icon--FontSize);
342
342
  color: var(--pf-v6-c-alert__icon--Color);
@@ -366,10 +366,6 @@
366
366
  margin-block-start: var(--pf-v6-c-alert__action--MarginBlockStart);
367
367
  margin-block-end: var(--pf-v6-c-alert__action--MarginBlockEnd);
368
368
  margin-inline-end: var(--pf-v6-c-alert__action--MarginInlineEnd);
369
- transform: translateY(var(--pf-v6-c-alert__action--TranslateY));
370
- }
371
- .pfext-quick-start__base .pf-v6-c-alert__action > .pf-v6-c-button {
372
- --pf-v6-c-button--LineHeight: 1;
373
369
  }
374
370
  .pfext-quick-start__base .pf-v6-c-alert__action-group {
375
371
  grid-area: actiongroup;
@@ -378,6 +374,249 @@
378
374
  .pfext-quick-start__base .pf-v6-c-alert__action-group > .pf-v6-c-button:not(:last-child) {
379
375
  margin-inline-end: var(--pf-v6-c-alert__action-group__c-button--not-last-child--MarginInlineEnd);
380
376
  }
377
+ .pfext-quick-start__base .pf-v6-c-avatar {
378
+ --pf-v6-c-avatar--BorderColor: transparent;
379
+ --pf-v6-c-avatar--BorderWidth: 0;
380
+ --pf-v6-c-avatar--BorderRadius: var(--pf-t--global--border--radius--pill);
381
+ --pf-v6-c-avatar--Width: 2.25rem;
382
+ --pf-v6-c-avatar--Height: 2.25rem;
383
+ --pf-v6-c-avatar--m-sm--Width: 1.5rem;
384
+ --pf-v6-c-avatar--m-sm--Height: 1.5rem;
385
+ --pf-v6-c-avatar--m-md--Width: 2.25rem;
386
+ --pf-v6-c-avatar--m-md--Height: 2.25rem;
387
+ --pf-v6-c-avatar--m-lg--Width: 4.5rem;
388
+ --pf-v6-c-avatar--m-lg--Height: 4.5rem;
389
+ --pf-v6-c-avatar--m-xl--Width: 8rem;
390
+ --pf-v6-c-avatar--m-xl--Height: 8rem;
391
+ --pf-v6-c-avatar--m-bordered--BorderColor: var(--pf-t--global--border--color--default);
392
+ --pf-v6-c-avatar--m-bordered--BorderWidth: var(--pf-t--global--border--width--box--default);
393
+ }
394
+ .pfext-quick-start__base .pf-v6-c-avatar {
395
+ width: var(--pf-v6-c-avatar--Width);
396
+ height: var(--pf-v6-c-avatar--Height);
397
+ border: var(--pf-v6-c-avatar--BorderWidth) solid var(--pf-v6-c-avatar--BorderColor);
398
+ border-radius: var(--pf-v6-c-avatar--BorderRadius);
399
+ }
400
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-bordered {
401
+ --pf-v6-c-avatar--BorderColor: var(--pf-v6-c-avatar--m-bordered--BorderColor);
402
+ --pf-v6-c-avatar--BorderWidth: var(--pf-v6-c-avatar--m-bordered--BorderWidth);
403
+ }
404
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
405
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width);
406
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height);
407
+ }
408
+ @media (min-width: 36rem) {
409
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
410
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width));
411
+ }
412
+ }
413
+ @media (min-width: 48rem) {
414
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
415
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-md, var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width)));
416
+ }
417
+ }
418
+ @media (min-width: 62rem) {
419
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
420
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-lg, var(--pf-v6-c-avatar--m-sm--Width-on-md, var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width))));
421
+ }
422
+ }
423
+ @media (min-width: 75rem) {
424
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
425
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-xl, var(--pf-v6-c-avatar--m-sm--Width-on-lg, var(--pf-v6-c-avatar--m-sm--Width-on-md, var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width)))));
426
+ }
427
+ }
428
+ @media (min-width: 90.625rem) {
429
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
430
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-sm--Width-on-2xl, var(--pf-v6-c-avatar--m-sm--Width-on-xl, var(--pf-v6-c-avatar--m-sm--Width-on-lg, var(--pf-v6-c-avatar--m-sm--Width-on-md, var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width))))));
431
+ }
432
+ }
433
+ @media (min-width: 36rem) {
434
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
435
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height));
436
+ }
437
+ }
438
+ @media (min-width: 48rem) {
439
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
440
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-md, var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height)));
441
+ }
442
+ }
443
+ @media (min-width: 62rem) {
444
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
445
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-lg, var(--pf-v6-c-avatar--m-sm--Height-on-md, var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height))));
446
+ }
447
+ }
448
+ @media (min-width: 75rem) {
449
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
450
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-xl, var(--pf-v6-c-avatar--m-sm--Height-on-lg, var(--pf-v6-c-avatar--m-sm--Height-on-md, var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height)))));
451
+ }
452
+ }
453
+ @media (min-width: 90.625rem) {
454
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-sm {
455
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-sm--Height-on-2xl, var(--pf-v6-c-avatar--m-sm--Height-on-xl, var(--pf-v6-c-avatar--m-sm--Height-on-lg, var(--pf-v6-c-avatar--m-sm--Height-on-md, var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height))))));
456
+ }
457
+ }
458
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
459
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width);
460
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height);
461
+ }
462
+ @media (min-width: 36rem) {
463
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
464
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width));
465
+ }
466
+ }
467
+ @media (min-width: 48rem) {
468
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
469
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-md, var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width)));
470
+ }
471
+ }
472
+ @media (min-width: 62rem) {
473
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
474
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-lg, var(--pf-v6-c-avatar--m-md--Width-on-md, var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width))));
475
+ }
476
+ }
477
+ @media (min-width: 75rem) {
478
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
479
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-xl, var(--pf-v6-c-avatar--m-md--Width-on-lg, var(--pf-v6-c-avatar--m-md--Width-on-md, var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width)))));
480
+ }
481
+ }
482
+ @media (min-width: 90.625rem) {
483
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
484
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-md--Width-on-2xl, var(--pf-v6-c-avatar--m-md--Width-on-xl, var(--pf-v6-c-avatar--m-md--Width-on-lg, var(--pf-v6-c-avatar--m-md--Width-on-md, var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width))))));
485
+ }
486
+ }
487
+ @media (min-width: 36rem) {
488
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
489
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height));
490
+ }
491
+ }
492
+ @media (min-width: 48rem) {
493
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
494
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-md, var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height)));
495
+ }
496
+ }
497
+ @media (min-width: 62rem) {
498
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
499
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-lg, var(--pf-v6-c-avatar--m-md--Height-on-md, var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height))));
500
+ }
501
+ }
502
+ @media (min-width: 75rem) {
503
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
504
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-xl, var(--pf-v6-c-avatar--m-md--Height-on-lg, var(--pf-v6-c-avatar--m-md--Height-on-md, var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height)))));
505
+ }
506
+ }
507
+ @media (min-width: 90.625rem) {
508
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-md {
509
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-md--Height-on-2xl, var(--pf-v6-c-avatar--m-md--Height-on-xl, var(--pf-v6-c-avatar--m-md--Height-on-lg, var(--pf-v6-c-avatar--m-md--Height-on-md, var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height))))));
510
+ }
511
+ }
512
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
513
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width);
514
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height);
515
+ }
516
+ @media (min-width: 36rem) {
517
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
518
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width));
519
+ }
520
+ }
521
+ @media (min-width: 48rem) {
522
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
523
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-md, var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width)));
524
+ }
525
+ }
526
+ @media (min-width: 62rem) {
527
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
528
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-lg, var(--pf-v6-c-avatar--m-lg--Width-on-md, var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width))));
529
+ }
530
+ }
531
+ @media (min-width: 75rem) {
532
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
533
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-xl, var(--pf-v6-c-avatar--m-lg--Width-on-lg, var(--pf-v6-c-avatar--m-lg--Width-on-md, var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width)))));
534
+ }
535
+ }
536
+ @media (min-width: 90.625rem) {
537
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
538
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-lg--Width-on-2xl, var(--pf-v6-c-avatar--m-lg--Width-on-xl, var(--pf-v6-c-avatar--m-lg--Width-on-lg, var(--pf-v6-c-avatar--m-lg--Width-on-md, var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width))))));
539
+ }
540
+ }
541
+ @media (min-width: 36rem) {
542
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
543
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height));
544
+ }
545
+ }
546
+ @media (min-width: 48rem) {
547
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
548
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-md, var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height)));
549
+ }
550
+ }
551
+ @media (min-width: 62rem) {
552
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
553
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-lg, var(--pf-v6-c-avatar--m-lg--Height-on-md, var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height))));
554
+ }
555
+ }
556
+ @media (min-width: 75rem) {
557
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
558
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-xl, var(--pf-v6-c-avatar--m-lg--Height-on-lg, var(--pf-v6-c-avatar--m-lg--Height-on-md, var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height)))));
559
+ }
560
+ }
561
+ @media (min-width: 90.625rem) {
562
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-lg {
563
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-lg--Height-on-2xl, var(--pf-v6-c-avatar--m-lg--Height-on-xl, var(--pf-v6-c-avatar--m-lg--Height-on-lg, var(--pf-v6-c-avatar--m-lg--Height-on-md, var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height))))));
564
+ }
565
+ }
566
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
567
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width);
568
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height);
569
+ }
570
+ @media (min-width: 36rem) {
571
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
572
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width));
573
+ }
574
+ }
575
+ @media (min-width: 48rem) {
576
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
577
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-md, var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width)));
578
+ }
579
+ }
580
+ @media (min-width: 62rem) {
581
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
582
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-lg, var(--pf-v6-c-avatar--m-xl--Width-on-md, var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width))));
583
+ }
584
+ }
585
+ @media (min-width: 75rem) {
586
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
587
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-xl, var(--pf-v6-c-avatar--m-xl--Width-on-lg, var(--pf-v6-c-avatar--m-xl--Width-on-md, var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width)))));
588
+ }
589
+ }
590
+ @media (min-width: 90.625rem) {
591
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
592
+ --pf-v6-c-avatar--Width:var(--pf-v6-c-avatar--m-xl--Width-on-2xl, var(--pf-v6-c-avatar--m-xl--Width-on-xl, var(--pf-v6-c-avatar--m-xl--Width-on-lg, var(--pf-v6-c-avatar--m-xl--Width-on-md, var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width))))));
593
+ }
594
+ }
595
+ @media (min-width: 36rem) {
596
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
597
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height));
598
+ }
599
+ }
600
+ @media (min-width: 48rem) {
601
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
602
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height)));
603
+ }
604
+ }
605
+ @media (min-width: 62rem) {
606
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
607
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-lg, var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height))));
608
+ }
609
+ }
610
+ @media (min-width: 75rem) {
611
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
612
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-xl, var(--pf-v6-c-avatar--m-xl--Height-on-lg, var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height)))));
613
+ }
614
+ }
615
+ @media (min-width: 90.625rem) {
616
+ .pfext-quick-start__base .pf-v6-c-avatar.pf-m-xl {
617
+ --pf-v6-c-avatar--Height:var(--pf-v6-c-avatar--m-xl--Height-on-2xl, var(--pf-v6-c-avatar--m-xl--Height-on-xl, var(--pf-v6-c-avatar--m-xl--Height-on-lg, var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height))))));
618
+ }
619
+ }
381
620
  .pfext-quick-start__base .pf-v6-c-backdrop {
382
621
  --pf-v6-c-backdrop--Position: fixed;
383
622
  --pf-v6-c-backdrop--ZIndex: var(--pf-t--global--z-index--lg);
@@ -600,6 +839,7 @@
600
839
  --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
601
840
  --pf-v6-c-button--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
602
841
  --pf-v6-c-button--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
842
+ --pf-v6-c-button--m-secondary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
603
843
  --pf-v6-c-button--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--default);
604
844
  --pf-v6-c-button--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
605
845
  --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
@@ -618,6 +858,7 @@
618
858
  --pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--danger--clicked);
619
859
  --pf-v6-c-button--m-tertiary--Color: var(--pf-t--global--text--color--brand--default);
620
860
  --pf-v6-c-button--m-tertiary--BorderColor: var(--pf-t--global--border--color--default);
861
+ --pf-v6-c-button--m-tertiary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
621
862
  --pf-v6-c-button--m-tertiary__icon--Color: var(--pf-t--global--icon--color--brand--default);
622
863
  --pf-v6-c-button--m-tertiary--hover--Color: var(--pf-t--global--text--color--brand--hover);
623
864
  --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--hover);
@@ -686,7 +927,9 @@
686
927
  --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
687
928
  --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: 0;
688
929
  --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: 0;
930
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-t--global--icon--color--subtle);
689
931
  --pf-v6-c-button--m-plain--m-no-padding--BackgroundColor: transparent;
932
+ --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-t--global--icon--color--regular);
690
933
  --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
691
934
  --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
692
935
  --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
@@ -849,6 +1092,7 @@
849
1092
  .pfext-quick-start__base .pf-v6-c-button.pf-m-secondary {
850
1093
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-secondary--Color);
851
1094
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-secondary--BorderColor);
1095
+ --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-secondary--TransitionDuration);
852
1096
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-secondary__icon--Color);
853
1097
  --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-secondary--hover--Color);
854
1098
  --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-secondary--hover--BorderColor);
@@ -874,6 +1118,7 @@
874
1118
  .pfext-quick-start__base .pf-v6-c-button.pf-m-tertiary {
875
1119
  --pf-v6-c-button--Color: var(--pf-v6-c-button--m-tertiary--Color);
876
1120
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-tertiary--BorderColor);
1121
+ --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-tertiary--TransitionDuration);
877
1122
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-tertiary__icon--Color);
878
1123
  --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-tertiary--hover--Color);
879
1124
  --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-tertiary--hover--BorderColor);
@@ -1036,6 +1281,7 @@
1036
1281
  --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineStart);
1037
1282
  }
1038
1283
  .pfext-quick-start__base .pf-v6-c-button.pf-m-plain.pf-m-no-padding {
1284
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding__icon--Color);
1039
1285
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--BackgroundColor);
1040
1286
  --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor);
1041
1287
  --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor);
@@ -1067,6 +1313,7 @@
1067
1313
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
1068
1314
  --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--hover--BorderColor);
1069
1315
  --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
1316
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
1070
1317
  --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
1071
1318
  text-decoration: var(--pf-v6-c-button--hover--TextDecorationLine) var(--pf-v6-c-button--hover--TextDecorationStyle);
1072
1319
  }
@@ -2497,9 +2744,6 @@ ul) {
2497
2744
  .pfext-quick-start__base .pf-v6-c-drawer__body:last-child {
2498
2745
  flex: 1 1;
2499
2746
  }
2500
- .pfext-quick-start__base .pf-v6-c-drawer__body > .pf-v6-c-page__main {
2501
- height: 100%;
2502
- }
2503
2747
  .pfext-quick-start__base .pf-v6-c-drawer__splitter {
2504
2748
  position: relative;
2505
2749
  display: none;
@@ -3751,6 +3995,10 @@ ul) {
3751
3995
  --pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd: calc((var(--pf-v6-c-form-control__icon--FontSize) * 2) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd) + var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart));
3752
3996
  --pf-v6-c-form-control--textarea--Width: var(--pf-v6-c-form-control--Width);
3753
3997
  --pf-v6-c-form-control--textarea--Height: auto;
3998
+ --pf-v6-c-form-control--textarea--PaddingBlockStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
3999
+ --pf-v6-c-form-control--textarea--PaddingBlockEnd--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
4000
+ --pf-v6-c-form-control--textarea--PaddingInlineEnd--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
4001
+ --pf-v6-c-form-control--textarea--PaddingInlineStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
3754
4002
  --pf-v6-c-form-control__icon--Color: var(--pf-t--global--icon--color--regular);
3755
4003
  --pf-v6-c-form-control__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
3756
4004
  --pf-v6-c-form-control__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
@@ -3805,18 +4053,33 @@ ul) {
3805
4053
  background-color: transparent;
3806
4054
  border: none;
3807
4055
  border-radius: var(--pf-v6-c-form-control--BorderRadius);
4056
+ outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
3808
4057
  -moz-appearance: none;
3809
4058
  -webkit-appearance: none;
3810
4059
  }
3811
- .pfext-quick-start__base .pf-v6-c-form-control > :is(input, select, textarea):focus {
3812
- outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
3813
- }
3814
4060
  .pfext-quick-start__base .pf-v6-c-form-control > ::placeholder {
3815
4061
  color: var(--pf-v6-c-form-control--m-placeholder--Color);
3816
4062
  }
3817
4063
  .pfext-quick-start__base .pf-v6-c-form-control > :is(input, select) {
3818
4064
  text-overflow: ellipsis;
3819
4065
  }
4066
+ .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea {
4067
+ padding-block-start: var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset);
4068
+ padding-block-end: var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset);
4069
+ padding-inline-start: var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset);
4070
+ padding-inline-end: var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset);
4071
+ }
4072
+ .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea.pf-m-success, .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea.pf-m-warning, .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea.pf-m-error {
4073
+ --pf-v6-c-form-control--m-status--PaddingInlineEnd--offset: calc(var(--pf-v6-c-form-control__icon--FontSize) + var(--pf-v6-c-form-control--ColumnGap));
4074
+ }
4075
+ .pfext-quick-start__base .pf-v6-c-form-control.pf-m-textarea > textarea {
4076
+ padding-block-start: calc(var(--pf-v6-c-form-control--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
4077
+ padding-block-end: calc(var(--pf-v6-c-form-control--PaddingBlockEnd) - var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset));
4078
+ padding-inline-start: calc(var(--pf-v6-c-form-control--PaddingInlineStart) - var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset));
4079
+ padding-inline-end: calc(var(--pf-v6-c-form-control--PaddingInlineEnd) - var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset) + var(--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset, 0));
4080
+ outline-offset: 0;
4081
+ scrollbar-gutter: stable;
4082
+ }
3820
4083
  .pfext-quick-start__base .pf-v6-c-form-control.pf-m-readonly {
3821
4084
  --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
3822
4085
  --pf-v6-c-form-control--before--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
@@ -5777,7 +6040,7 @@ ul) {
5777
6040
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
5778
6041
  }
5779
6042
  .pfext-quick-start__base .pf-v6-c-menu-toggle {
5780
- --pf-v6-c-menu-toggle--ColumnGap: var(--pf-t--global--spacer--sm);
6043
+ --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5781
6044
  --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5782
6045
  --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5783
6046
  --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
@@ -5842,26 +6105,30 @@ ul) {
5842
6105
  --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
5843
6106
  --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
5844
6107
  --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5845
- --pf-v6-c-menu-toggle__controls--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) + var(--pf-t--global--spacer--sm) + var(--pf-t--global--spacer--sm));
5846
6108
  --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
5847
6109
  --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
5848
6110
  --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5849
6111
  --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5850
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
5851
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5852
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderRadius: var(--pf-t--global--border--radius--pill);
5853
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
5854
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
5855
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5856
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5857
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5858
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
6112
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
6113
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
6114
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
6115
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
6116
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
6117
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
6118
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
6119
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
6120
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
6121
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
6122
+ --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
5859
6123
  --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
6124
+ --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5860
6125
  --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
5861
6126
  --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
5862
6127
  --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
5863
6128
  --pf-v6-c-menu-toggle__button--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5864
6129
  --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
6130
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
6131
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5865
6132
  --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5866
6133
  --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5867
6134
  --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
@@ -5869,14 +6136,15 @@ ul) {
5869
6136
  --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
5870
6137
  --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5871
6138
  --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5872
- --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--icon--color--disabled);
6139
+ --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
6140
+ --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
6141
+ --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
5873
6142
  --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
5874
6143
  --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
5875
6144
  --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
5876
6145
  --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
5877
6146
  --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5878
6147
  --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5879
- --pf-v6-c-menu-toggle__status-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
5880
6148
  --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
5881
6149
  --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
5882
6150
  --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
@@ -5885,11 +6153,12 @@ ul) {
5885
6153
  --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5886
6154
  --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5887
6155
  --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
6156
+ --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
5888
6157
  }
5889
6158
  .pfext-quick-start__base .pf-v6-c-menu-toggle {
5890
6159
  position: relative;
5891
6160
  display: inline-flex;
5892
- column-gap: var(--pf-v6-c-menu-toggle--ColumnGap);
6161
+ gap: var(--pf-v6-c-menu-toggle--Gap);
5893
6162
  align-items: center;
5894
6163
  justify-content: center;
5895
6164
  min-width: var(--pf-v6-c-menu-toggle--MinWidth);
@@ -5975,6 +6244,8 @@ ul) {
5975
6244
  --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
5976
6245
  --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
5977
6246
  --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
6247
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
6248
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5978
6249
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
5979
6250
  }
5980
6251
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-plain::before {
@@ -6003,9 +6274,6 @@ ul) {
6003
6274
  --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
6004
6275
  --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
6005
6276
  }
6006
- .pfext-quick-start__base .pf-v6-c-menu-toggle:has(.pf-v6-c-button) {
6007
- background-color: transparent;
6008
- }
6009
6277
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-success {
6010
6278
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
6011
6279
  --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
@@ -6033,7 +6301,8 @@ ul) {
6033
6301
  pointer-events: none;
6034
6302
  }
6035
6303
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button {
6036
- --pf-v6-c-menu-toggle--ColumnGap: 0;
6304
+ --pf-v6-c-menu-toggle--Gap: 0;
6305
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
6037
6306
  padding: 0;
6038
6307
  }
6039
6308
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button > * {
@@ -6052,7 +6321,6 @@ ul) {
6052
6321
  border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6053
6322
  }
6054
6323
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
6055
- --pf-v6-c-menu-toggle--PaddingInlineEnd: 0;
6056
6324
  --pf-v6-c-check__label--Color: currentcolor;
6057
6325
  --pf-v6-c-check__label--disabled--Color: currentcolor;
6058
6326
  align-items: center;
@@ -6062,47 +6330,50 @@ ul) {
6062
6330
  --pf-v6-c-check__input--TranslateY: 0;
6063
6331
  align-self: center;
6064
6332
  }
6065
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-plain {
6066
- --pf-v6-c-menu-toggle--BorderColor: transparent;
6333
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
6334
+ border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor);
6067
6335
  }
6068
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action {
6069
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
6336
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
6337
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
6070
6338
  }
6071
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action > :not(:first-child) {
6072
- border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor);
6339
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
6340
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
6341
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
6073
6342
  }
6074
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action > :has(.pf-v6-c-menu-toggle__controls) {
6075
- padding-inline-end: 0;
6343
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
6344
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
6345
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor);
6076
6346
  }
6077
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary {
6078
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BorderInlineStartColor);
6347
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
6348
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor);
6079
6349
  }
6080
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])) {
6081
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor);
6350
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
6351
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
6082
6352
  }
6083
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])):is(:hover, :focus) {
6084
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--hover--BackgroundColor);
6353
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__toggle-icon:only-child)):first-child,
6354
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):first-child, .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__toggle-icon:only-child)):first-child,
6355
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
6356
+ padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
6085
6357
  }
6086
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary.pf-m-expanded {
6087
- --pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-primary--expanded--child--BackgroundColor);
6358
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__toggle-icon:only-child)):last-child,
6359
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):last-child, .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__toggle-icon:only-child)):last-child,
6360
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
6361
+ padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
6088
6362
  }
6089
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary {
6090
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderInlineStartColor);
6363
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
6364
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
6091
6365
  }
6092
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action:is(.pf-m-disabled, :disabled) {
6093
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--child--disabled--BorderInlineStartColor);
6094
- }
6095
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action:is(.pf-m-disabled, :disabled)::before {
6096
- content: none;
6097
- }
6098
- .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-action > :is(.pf-m-disabled, :disabled) {
6099
- --pf-v6-c-menu-toggle--m-split-button--m-action--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-action--child--disabled--BorderInlineStartColor);
6366
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
6367
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
6100
6368
  color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
6101
6369
  background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
6102
6370
  }
6371
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
6372
+ content: none;
6373
+ }
6103
6374
  .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-typeahead {
6104
6375
  --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
6105
- --pf-v6-c-menu-toggle--ColumnGap: 0;
6376
+ --pf-v6-c-menu-toggle--Gap: 0;
6106
6377
  align-items: stretch;
6107
6378
  padding: 0;
6108
6379
  }
@@ -6119,6 +6390,7 @@ ul) {
6119
6390
  flex: 1;
6120
6391
  }
6121
6392
  .pfext-quick-start__base .pf-v6-c-menu-toggle__button {
6393
+ gap: var(--pf-v6-c-menu-toggle__button--Gap);
6122
6394
  align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
6123
6395
  min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
6124
6396
  padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
@@ -6127,13 +6399,13 @@ ul) {
6127
6399
  background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
6128
6400
  border: 0;
6129
6401
  }
6130
- .pfext-quick-start__base .pf-v6-c-menu-toggle__button:has(.pf-v6-c-menu-toggle__controls) {
6131
- padding-inline-start: 0;
6132
- }
6133
6402
  .pfext-quick-start__base .pf-v6-c-menu-toggle__button.pf-m-text {
6134
6403
  display: inline-flex;
6135
6404
  align-items: baseline;
6136
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart);
6405
+ }
6406
+ .pfext-quick-start__base .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check.pf-m-standalone, .pfext-quick-start__base .pf-v6-c-menu-toggle__button:has(> .pf-v6-c-menu-toggle__controls:only-child) {
6407
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
6408
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
6137
6409
  }
6138
6410
  .pfext-quick-start__base .pf-v6-c-menu-toggle__text {
6139
6411
  overflow: hidden;
@@ -6145,7 +6417,6 @@ ul) {
6145
6417
  display: flex;
6146
6418
  flex-wrap: nowrap;
6147
6419
  }
6148
- .pfext-quick-start__base .pf-v6-c-menu-toggle__icon,
6149
6420
  .pfext-quick-start__base .pf-v6-c-menu-toggle__controls,
6150
6421
  .pfext-quick-start__base .pf-v6-c-menu-toggle__toggle-icon {
6151
6422
  display: flex;
@@ -6154,10 +6425,15 @@ ul) {
6154
6425
  }
6155
6426
  .pfext-quick-start__base .pf-v6-c-menu-toggle__icon {
6156
6427
  flex-shrink: 0;
6157
- min-height: var(--pf-v6-c-menu-toggle__icon--MinHeight);
6428
+ }
6429
+ .pfext-quick-start__base .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
6430
+ .pfext-quick-start__base .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
6431
+ .pfext-quick-start__base .pf-v6-c-menu-toggle__icon.pf-m-avatar svg {
6432
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
6433
+ margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
6158
6434
  }
6159
6435
  .pfext-quick-start__base .pf-v6-c-menu-toggle__controls {
6160
- min-width: var(--pf-v6-c-menu-toggle__controls--MinWidth);
6436
+ gap: var(--pf-v6-c-menu-toggle__controls--Gap);
6161
6437
  margin-inline-start: auto;
6162
6438
  }
6163
6439
  .pfext-quick-start__base .pf-v6-c-menu-toggle__toggle-icon {
@@ -6165,7 +6441,6 @@ ul) {
6165
6441
  color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
6166
6442
  }
6167
6443
  .pfext-quick-start__base .pf-v6-c-menu-toggle__status-icon {
6168
- margin-inline-end: var(--pf-v6-c-menu-toggle__status-icon--MarginInlineEnd);
6169
6444
  color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
6170
6445
  }
6171
6446
  .pfext-quick-start__base .pf-v6-c-modal-box {
@@ -6364,6 +6639,7 @@ ul) {
6364
6639
  --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
6365
6640
  --pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
6366
6641
  --pf-v6-c-page__sidebar--Width: 18.125rem;
6642
+ --pf-v6-c-page__sidebar--xl--Width: auto;
6367
6643
  --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
6368
6644
  --pf-v6-c-page__sidebar--BoxShadow: none;
6369
6645
  --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
@@ -6372,7 +6648,7 @@ ul) {
6372
6648
  --pf-v6-c-page__sidebar--TranslateZ: 0;
6373
6649
  --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
6374
6650
  --pf-v6-c-page__sidebar--xl--TranslateX: 0;
6375
- --pf-v6-c-page__sidebar--MarginInlineEnd: 0;
6651
+ --pf-v6-c-page__sidebar--MarginInlineEnd: calc(var(--pf-t--global--spacer--inset--page-chrome) / 2);
6376
6652
  --pf-v6-c-page__sidebar--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
6377
6653
  --pf-v6-c-page__sidebar--PaddingInlineStart: 0;
6378
6654
  --pf-v6-c-page__sidebar--PaddingInlineEnd: 0;
@@ -6385,7 +6661,7 @@ ul) {
6385
6661
  --pf-v6-c-page__sidebar-title--LineHeight: var(--pf-t--global--font--line-height--heading);
6386
6662
  --pf-v6-c-page__sidebar-title--FontFamily: var(--pf-t--global--font--family--heading);
6387
6663
  --pf-v6-c-page__sidebar-title--FontWeight: var(--pf-t--global--font--weight--heading--default);
6388
- --pf-v6-c-page__sidebar-body--PaddingInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
6664
+ --pf-v6-c-page__sidebar-body--PaddingInlineEnd: calc(var(--pf-t--global--spacer--inset--page-chrome) / 2);
6389
6665
  --pf-v6-c-page__sidebar-body--PaddingInlineStart: var(--pf-t--global--spacer--inset--page-chrome);
6390
6666
  --pf-v6-c-page__sidebar-body--m-page-insets--PaddingInlineEnd: var(--pf-v6-c-page--inset);
6391
6667
  --pf-v6-c-page__sidebar-body--m-page-insets--PaddingInlineStart: var(--pf-v6-c-page--inset);
@@ -6398,8 +6674,8 @@ ul) {
6398
6674
  --pf-v6-c-page__main-container--BackgroundColor: var(--pf-t--global--background--color--primary--default);
6399
6675
  --pf-v6-c-page__main-container--MarginInlineStart: var(--pf-v6-c-page--inset);
6400
6676
  --pf-v6-c-page__main-container--MarginInlineEnd: var(--pf-v6-c-page--inset);
6401
- --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--large);
6402
- --pf-v6-c-page__main-container--BorderWidth: var(--pf-t--global--spacer--sm);
6677
+ --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--medium);
6678
+ --pf-v6-c-page__main-container--BorderWidth: 0.25rem;
6403
6679
  --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
6404
6680
  --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
6405
6681
  --pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -6455,6 +6731,7 @@ ul) {
6455
6731
  }
6456
6732
  @media (min-width: 75rem) {
6457
6733
  .pfext-quick-start__base .pf-v6-c-page {
6734
+ --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--xl--Width);
6458
6735
  grid-template-areas: "header header" "sidebar main";
6459
6736
  grid-template-columns: var(--pf-v6-c-page__sidebar--Width) 1fr;
6460
6737
  }
@@ -6943,11 +7220,11 @@ ul) {
6943
7220
  .pfext-quick-start__base .pf-v6-c-page__main-group {
6944
7221
  flex-shrink: 0;
6945
7222
  }
6946
- .pfext-quick-start__base .pf-v6-c-page__drawer {
6947
- grid-area: main;
7223
+ .pfext-quick-start__base .pf-v6-c-page__drawer .pf-v6-c-page__main-container {
7224
+ align-self: revert;
6948
7225
  }
6949
- .pfext-quick-start__base .pf-v6-c-page__drawer > .pf-v6-c-drawer {
6950
- flex: 1 0 auto;
7226
+ .pfext-quick-start__base .pf-v6-c-page__drawer .pf-v6-c-page__main-container.pf-m-fill {
7227
+ flex-grow: 1;
6951
7228
  }
6952
7229
  .pfext-quick-start__base .pf-v6-c-pagination {
6953
7230
  --pf-v6-c-pagination--inset: 0;
@@ -6968,17 +7245,23 @@ ul) {
6968
7245
  --pf-v6-c-pagination--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
6969
7246
  --pf-v6-c-pagination--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
6970
7247
  --pf-v6-c-pagination--m-sticky--PaddingBlockStart: var(--pf-t--global--spacer--md);
6971
- --pf-v6-c-pagination--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
6972
7248
  --pf-v6-c-pagination--m-sticky--PaddingBlockEnd: var(--pf-t--global--spacer--md);
6973
7249
  --pf-v6-c-pagination--m-sticky--PaddingInlineStart: var(--pf-t--global--spacer--lg);
6974
- --pf-v6-c-pagination--m-sticky--ZIndex: 100;
7250
+ --pf-v6-c-pagination--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
7251
+ --pf-v6-c-pagination--m-sticky--ZIndex: var(--pf-t--global--z-index--xs);
6975
7252
  --pf-v6-c-pagination--m-sticky--InsetBlockStart: 0;
6976
7253
  --pf-v6-c-pagination--m-bottom--BackgroundColor: var(--pf-t--global--background--color--primary--default);
6977
7254
  --pf-v6-c-pagination--m-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
6978
- --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
6979
- --pf-v6-c-pagination--m-bottom--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
6980
- --pf-v6-c-pagination--m-bottom--PaddingInlineStart: var(--pf-t--global--spacer--lg);
6981
7255
  --pf-v6-c-pagination--m-bottom--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
7256
+ --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
7257
+ --pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockStart: var(--pf-t--global--spacer--sm);
7258
+ --pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
7259
+ --pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7260
+ --pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7261
+ --pf-v6-c-pagination--m-bottom--m-static--PaddingBlockStart: var(--pf-t--global--spacer--gap--group--vertical);
7262
+ --pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd: 0;
7263
+ --pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7264
+ --pf-v6-c-pagination--m-bottom--m-static--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
6982
7265
  --pf-v6-c-pagination__page-menu--Display--base: block;
6983
7266
  --pf-v6-c-pagination__page-menu--Display: none;
6984
7267
  --pf-v6-c-pagination--m-display-summary__page-menu--Display: none;
@@ -7014,17 +7297,13 @@ ul) {
7014
7297
  position: sticky;
7015
7298
  inset-block-end: var(--pf-v6-c-pagination--m-bottom--InsetBlockEnd);
7016
7299
  justify-content: center;
7017
- padding-inline-start: var(--pf-v6-c-pagination--m-bottom--PaddingInlineStart);
7018
- padding-inline-end: var(--pf-v6-c-pagination--m-bottom--PaddingInlineEnd);
7300
+ padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockStart);
7301
+ padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockEnd);
7302
+ padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineStart);
7303
+ padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineEnd);
7019
7304
  background-color: var(--pf-v6-c-pagination--m-bottom--BackgroundColor);
7020
7305
  box-shadow: var(--pf-v6-c-pagination--m-bottom--BoxShadow);
7021
7306
  }
7022
- .pfext-quick-start__base .pf-v6-c-pagination.pf-m-bottom.pf-m-static {
7023
- --pf-v6-c-pagination--m-bottom--MarginBlockStart: 0;
7024
- --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: 0;
7025
- position: relative;
7026
- box-shadow: none;
7027
- }
7028
7307
  @media screen and (min-width: 48rem) {
7029
7308
  .pfext-quick-start__base .pf-v6-c-pagination.pf-m-bottom {
7030
7309
  --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: 0;
@@ -7032,17 +7311,29 @@ ul) {
7032
7311
  --pf-v6-c-pagination--m-bottom--InsetBlockEnd: auto;
7033
7312
  position: relative;
7034
7313
  justify-content: flex-end;
7314
+ padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockStart);
7315
+ padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd);
7316
+ padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart);
7317
+ padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineEnd);
7035
7318
  }
7036
7319
  }
7320
+ .pfext-quick-start__base .pf-v6-c-pagination.pf-m-static {
7321
+ position: relative;
7322
+ padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockStart);
7323
+ padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd);
7324
+ padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart);
7325
+ padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-static--PaddingInlineEnd);
7326
+ box-shadow: none;
7327
+ }
7037
7328
  .pfext-quick-start__base .pf-v6-c-pagination.pf-m-sticky {
7038
7329
  --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
7039
7330
  position: sticky;
7040
7331
  inset-block-start: var(--pf-v6-c-pagination--m-sticky--InsetBlockStart);
7041
7332
  z-index: var(--pf-v6-c-pagination--m-sticky--ZIndex);
7042
- padding-block-start: var(--pf-v6-c-pagination--m-sticky--PaddingBlockStart);
7043
- padding-block-end: var(--pf-v6-c-pagination--m-sticky--PaddingBlockEnd);
7044
- padding-inline-start: var(--pf-v6-c-pagination--m-sticky--PaddingInlineStart);
7045
- padding-inline-end: var(--pf-v6-c-pagination--m-sticky--PaddingInlineEnd);
7333
+ padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockStart);
7334
+ padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockEnd);
7335
+ padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineStart);
7336
+ padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineEnd);
7046
7337
  background-color: var(--pf-v6-c-pagination--m-sticky--BackgroundColor);
7047
7338
  box-shadow: var(--pf-v6-c-pagination--m-sticky--BoxShadow);
7048
7339
  }