@patternfly/patternfly 6.0.0-alpha.15 → 6.0.0-alpha.16

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 (19) hide show
  1. package/base/_globals.scss +2 -11
  2. package/base/patternfly-globals.css +2 -6
  3. package/base/patternfly-variables.css +3 -3
  4. package/base/tokens/_tokens-font.scss +3 -3
  5. package/components/List/list.css +16 -16
  6. package/components/List/list.scss +17 -17
  7. package/components/Title/title.css +70 -19
  8. package/components/Title/title.scss +90 -20
  9. package/docs/components/Title/examples/Title.md +18 -0
  10. package/package.json +1 -1
  11. package/patternfly-base-no-globals-theme-dark-unversioned.css +3 -7
  12. package/patternfly-base-no-globals.css +3 -7
  13. package/patternfly-base-theme-dark-unversioned.css +5 -9
  14. package/patternfly-base.css +5 -9
  15. package/patternfly-no-globals.css +89 -42
  16. package/patternfly-theme-dark-unversioned.css +91 -44
  17. package/patternfly.css +91 -44
  18. package/patternfly.min.css +1 -1
  19. package/patternfly.min.css.map +1 -1
package/patternfly-no-globals.css CHANGED
@@ -889,14 +889,14 @@
889
889
  --pf-t--global--font--size--heading--100: 16px;
890
890
  --pf-t--global--font--size--heading--200: 18px;
891
891
  --pf-t--global--font--size--heading--300: 20px;
892
- --pf-t--global--font--size--heading--400: 24px;
892
+ --pf-t--global--font--size--heading--400: 22px;
893
893
  --pf-t--global--font--size--heading--500: 28px;
894
894
  --pf-t--global--font--size--heading--600: 36px;
895
895
  --pf-t--global--font--family--body: var(--pf-t--global--font--family--100);
896
896
  --pf-t--global--font--family--heading: var(--pf-t--global--font--family--200);
897
897
  --pf-t--global--font--family--mono: var(--pf-t--global--font--family--300);
898
- --pf-t--global--font--line-height--body: var(--pf-t--global--font--line-height--100);
899
- --pf-t--global--font--line-height--heading: var(--pf-t--global--font--line-height--200);
898
+ --pf-t--global--font--line-height--body: var(--pf-t--global--font--line-height--200);
899
+ --pf-t--global--font--line-height--heading: var(--pf-t--global--font--line-height--100);
900
900
  --pf-t--global--font--weight--body: var(--pf-t--global--font--weight--body--100);
901
901
  --pf-t--global--font--weight--body--bold: var(--pf-t--global--font--weight--body--200);
902
902
  --pf-t--global--font--weight--heading: var(--pf-t--global--font--weight--heading--100);
@@ -1432,10 +1432,6 @@
1432
1432
  scale: -1 1;
1433
1433
  }
1434
1434
 
1435
- :where(.pf-v5-theme-dark) {
1436
- color-scheme: dark;
1437
- }
1438
-
1439
1435
  .pf-v5-t-dark.pf-m-transparent {
1440
1436
  background-color: transparent;
1441
1437
  }
@@ -17295,23 +17291,23 @@ button.pf-v5-c-label__content:focus {
17295
17291
  }
17296
17292
 
17297
17293
  .pf-v5-c-list {
17298
- --pf-v5-c-list--PaddingLeft: var(--pf-v5-global--spacer--lg);
17299
- --pf-v5-c-list--nested--MarginTop: var(--pf-v5-global--spacer--sm);
17300
- --pf-v5-c-list--nested--MarginLeft: var(--pf-v5-global--spacer--sm);
17294
+ --pf-v5-c-list--PaddingLeft: var(--pf-t--global--spacer--lg);
17295
+ --pf-v5-c-list--nested--MarginTop: var(--pf-t--global--spacer--sm);
17296
+ --pf-v5-c-list--nested--MarginLeft: var(--pf-t--global--spacer--sm);
17301
17297
  --pf-v5-c-list--ul--ListStyle: var(--pf-v5-global--ListStyle);
17302
- --pf-v5-c-list--li--MarginTop: var(--pf-v5-global--spacer--sm);
17303
- --pf-v5-c-list--m-inline--li--MarginRight: var(--pf-v5-global--spacer--lg);
17304
- --pf-v5-c-list--m-bordered--li--PaddingBottom: var(--pf-v5-global--spacer--sm);
17305
- --pf-v5-c-list--m-bordered--li--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
17306
- --pf-v5-c-list--m-bordered--li--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
17307
- --pf-v5-c-list__item-icon--MinWidth: var(--pf-v5-global--icon--FontSize--sm);
17308
- --pf-v5-c-list__item-icon--MarginTop: 0.375rem;
17309
- --pf-v5-c-list__item-icon--MarginRight: var(--pf-v5-global--spacer--sm);
17310
- --pf-v5-c-list__item-icon--Color: var(--pf-v5-global--icon--Color--dark);
17311
- --pf-v5-c-list__item-icon--FontSize: var(--pf-v5-global--icon--FontSize--sm);
17312
- --pf-v5-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-v5-global--icon--FontSize--lg);
17313
- --pf-v5-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-v5-global--spacer--md);
17314
- --pf-v5-c-list--m-icon-lg__item-icon--FontSize: var(--pf-v5-global--icon--FontSize--lg);
17298
+ --pf-v5-c-list--li--MarginTop: var(--pf-t--global--spacer--sm);
17299
+ --pf-v5-c-list--m-inline--li--MarginRight: var(--pf-t--global--spacer--lg);
17300
+ --pf-v5-c-list--m-bordered--li--PaddingBottom: var(--pf-t--global--spacer--sm);
17301
+ --pf-v5-c-list--m-bordered--li--BorderBottomColor: var(--pf-t--global--border--color--default);
17302
+ --pf-v5-c-list--m-bordered--li--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
17303
+ --pf-v5-c-list__item-icon--MinWidth: var(--pf-t--global--icon--size--sm);
17304
+ --pf-v5-c-list__item-icon--MarginTop: var(--pf-t--global--spacer--xs);
17305
+ --pf-v5-c-list__item-icon--MarginRight: var(--pf-t--global--spacer--sm);
17306
+ --pf-v5-c-list__item-icon--Color: var(--pf-t--global--icon--color--regular);
17307
+ --pf-v5-c-list__item-icon--FontSize: var(--pf-t--global--icon--size--sm);
17308
+ --pf-v5-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-t--global--icon--size--lg);
17309
+ --pf-v5-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-t--global--spacer--md);
17310
+ --pf-v5-c-list--m-icon-lg__item-icon--FontSize: var(--pf-t--global--icon--size--lg);
17315
17311
  padding-inline-start: var(--pf-v5-c-list--PaddingLeft);
17316
17312
  }
17317
17313
  .pf-v5-c-list ol,
@@ -30573,26 +30569,47 @@ svg.pf-v5-c-spinner.pf-m-xl {
30573
30569
  --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-c-timestamp--m-help-text--focus--TextDecorationColor);
30574
30570
  }
30575
30571
 
30572
+ :root {
30573
+ --pf-v5-c-title--FontFamily: var(--pf-t--global--font--family--heading);
30574
+ --pf-v5-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30575
+ --pf-v5-c-title--m-4xl--FontSize: var(--pf-t--global--font--size--heading--2xl);
30576
+ --pf-v5-c-title--m-4xl--FontWeight: var(--pf-t--global--font--weight--heading);
30577
+ --pf-v5-c-title--m-3xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30578
+ --pf-v5-c-title--m-3xl--FontSize: var(--pf-t--global--font--size--heading--xl);
30579
+ --pf-v5-c-title--m-3xl--FontWeight: var(--pf-t--global--font--weight--heading);
30580
+ --pf-v5-c-title--m-2xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30581
+ --pf-v5-c-title--m-2xl--FontSize: var(--pf-t--global--font--size--heading--lg);
30582
+ --pf-v5-c-title--m-2xl--FontWeight: var(--pf-t--global--font--weight--heading);
30583
+ --pf-v5-c-title--m-xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30584
+ --pf-v5-c-title--m-xl--FontSize: var(--pf-t--global--font--size--heading--md);
30585
+ --pf-v5-c-title--m-xl--FontWeight: var(--pf-t--global--font--weight--heading);
30586
+ --pf-v5-c-title--m-lg--LineHeight: var(--pf-t--global--font--line-height--heading);
30587
+ --pf-v5-c-title--m-lg--FontSize: var(--pf-t--global--font--size--heading--sm);
30588
+ --pf-v5-c-title--m-lg--FontWeight: var(--pf-t--global--font--weight--heading);
30589
+ --pf-v5-c-title--m-md--LineHeight: var(--pf-t--global--font--line-height--heading);
30590
+ --pf-v5-c-title--m-md--FontSize: var(--pf-t--global--font--size--heading--xs);
30591
+ --pf-v5-c-title--m-md--FontWeight: var(--pf-t--global--font--weight--heading);
30592
+ --pf-v5-c-title--m-h1--LineHeight: var(--pf-t--global--font--line-height--heading);
30593
+ --pf-v5-c-title--m-h1--FontSize: var(--pf-t--global--font--size--heading--lg);
30594
+ --pf-v5-c-title--m-h1--FontWeight: var(--pf-t--global--font--weight--heading);
30595
+ --pf-v5-c-title--m-h2--LineHeight: var(--pf-t--global--font--line-height--heading);
30596
+ --pf-v5-c-title--m-h2--FontSize: var(--pf-t--global--font--size--heading--md);
30597
+ --pf-v5-c-title--m-h2--FontWeight: var(--pf-t--global--font--weight--heading);
30598
+ --pf-v5-c-title--m-h3--LineHeight: var(--pf-t--global--font--line-height--heading);
30599
+ --pf-v5-c-title--m-h3--FontSize: var(--pf-t--global--font--size--heading--sm);
30600
+ --pf-v5-c-title--m-h3--FontWeight: var(--pf-t--global--font--weight--heading);
30601
+ --pf-v5-c-title--m-h4--LineHeight: var(--pf-t--global--font--line-height--heading);
30602
+ --pf-v5-c-title--m-h4--FontSize: var(--pf-t--global--font--size--heading--xs);
30603
+ --pf-v5-c-title--m-h4--FontWeight: var(--pf-t--global--font--weight--heading);
30604
+ --pf-v5-c-title--m-h5--LineHeight: var(--pf-t--global--font--line-height--heading);
30605
+ --pf-v5-c-title--m-h5--FontSize: var(--pf-t--global--font--size--heading--xs);
30606
+ --pf-v5-c-title--m-h5--FontWeight: var(--pf-t--global--font--weight--heading);
30607
+ --pf-v5-c-title--m-h6--LineHeight: var(--pf-t--global--font--line-height--heading);
30608
+ --pf-v5-c-title--m-h6--FontSize: var(--pf-t--global--font--size--heading--xs);
30609
+ --pf-v5-c-title--m-h6--FontWeight: var(--pf-t--global--font--weight--heading);
30610
+ }
30611
+
30576
30612
  .pf-v5-c-title {
30577
- --pf-v5-c-title--FontFamily: var(--pf-v5-global--FontFamily--heading);
30578
- --pf-v5-c-title--m-4xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30579
- --pf-v5-c-title--m-4xl--FontSize: var(--pf-v5-global--FontSize--4xl);
30580
- --pf-v5-c-title--m-4xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30581
- --pf-v5-c-title--m-3xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30582
- --pf-v5-c-title--m-3xl--FontSize: var(--pf-v5-global--FontSize--3xl);
30583
- --pf-v5-c-title--m-3xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30584
- --pf-v5-c-title--m-2xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30585
- --pf-v5-c-title--m-2xl--FontSize: var(--pf-v5-global--FontSize--2xl);
30586
- --pf-v5-c-title--m-2xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30587
- --pf-v5-c-title--m-xl--LineHeight: var(--pf-v5-global--LineHeight--md);
30588
- --pf-v5-c-title--m-xl--FontSize: var(--pf-v5-global--FontSize--xl);
30589
- --pf-v5-c-title--m-xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30590
- --pf-v5-c-title--m-lg--LineHeight: var(--pf-v5-global--LineHeight--md);
30591
- --pf-v5-c-title--m-lg--FontSize: var(--pf-v5-global--FontSize--lg);
30592
- --pf-v5-c-title--m-lg--FontWeight: var(--pf-v5-global--FontWeight--normal);
30593
- --pf-v5-c-title--m-md--LineHeight: var(--pf-v5-global--LineHeight--md);
30594
- --pf-v5-c-title--m-md--FontSize: var(--pf-v5-global--FontSize--md);
30595
- --pf-v5-c-title--m-md--FontWeight: var(--pf-v5-global--FontWeight--normal);
30596
30613
  font-family: var(--pf-v5-c-title--FontFamily);
30597
30614
  word-break: break-word;
30598
30615
  }
@@ -30626,6 +30643,36 @@ svg.pf-v5-c-spinner.pf-m-xl {
30626
30643
  font-weight: var(--pf-v5-c-title--m-md--FontWeight);
30627
30644
  line-height: var(--pf-v5-c-title--m-md--LineHeight);
30628
30645
  }
30646
+ .pf-v5-c-title.pf-m-h1 {
30647
+ font-size: var(--pf-v5-c-title--m-h1--FontSize);
30648
+ font-weight: var(--pf-v5-c-title--m-h1--FontWeight);
30649
+ line-height: var(--pf-v5-c-title--m-h1--LineHeight);
30650
+ }
30651
+ .pf-v5-c-title.pf-m-h2 {
30652
+ font-size: var(--pf-v5-c-title--m-h2--FontSize);
30653
+ font-weight: var(--pf-v5-c-title--m-h2--FontWeight);
30654
+ line-height: var(--pf-v5-c-title--m-h2--LineHeight);
30655
+ }
30656
+ .pf-v5-c-title.pf-m-h3 {
30657
+ font-size: var(--pf-v5-c-title--m-h3--FontSize);
30658
+ font-weight: var(--pf-v5-c-title--m-h3--FontWeight);
30659
+ line-height: var(--pf-v5-c-title--m-h3--LineHeight);
30660
+ }
30661
+ .pf-v5-c-title.pf-m-h4 {
30662
+ font-size: var(--pf-v5-c-title--m-h4--FontSize);
30663
+ font-weight: var(--pf-v5-c-title--m-h4--FontWeight);
30664
+ line-height: var(--pf-v5-c-title--m-h4--LineHeight);
30665
+ }
30666
+ .pf-v5-c-title.pf-m-h5 {
30667
+ font-size: var(--pf-v5-c-title--m-h5--FontSize);
30668
+ font-weight: var(--pf-v5-c-title--m-h5--FontWeight);
30669
+ line-height: var(--pf-v5-c-title--m-h5--LineHeight);
30670
+ }
30671
+ .pf-v5-c-title.pf-m-h6 {
30672
+ font-size: var(--pf-v5-c-title--m-h6--FontSize);
30673
+ font-weight: var(--pf-v5-c-title--m-h6--FontWeight);
30674
+ line-height: var(--pf-v5-c-title--m-h6--LineHeight);
30675
+ }
30629
30676
 
30630
30677
  .pf-v5-c-toggle-group {
30631
30678
  --pf-v5-c-toggle-group__button--PaddingTop: var(--pf-v5-global--spacer--form-element);
package/patternfly-theme-dark-unversioned.css CHANGED
@@ -889,14 +889,14 @@
889
889
  --pf-t--global--font--size--heading--100: 16px;
890
890
  --pf-t--global--font--size--heading--200: 18px;
891
891
  --pf-t--global--font--size--heading--300: 20px;
892
- --pf-t--global--font--size--heading--400: 24px;
892
+ --pf-t--global--font--size--heading--400: 22px;
893
893
  --pf-t--global--font--size--heading--500: 28px;
894
894
  --pf-t--global--font--size--heading--600: 36px;
895
895
  --pf-t--global--font--family--body: var(--pf-t--global--font--family--100);
896
896
  --pf-t--global--font--family--heading: var(--pf-t--global--font--family--200);
897
897
  --pf-t--global--font--family--mono: var(--pf-t--global--font--family--300);
898
- --pf-t--global--font--line-height--body: var(--pf-t--global--font--line-height--100);
899
- --pf-t--global--font--line-height--heading: var(--pf-t--global--font--line-height--200);
898
+ --pf-t--global--font--line-height--body: var(--pf-t--global--font--line-height--200);
899
+ --pf-t--global--font--line-height--heading: var(--pf-t--global--font--line-height--100);
900
900
  --pf-t--global--font--weight--body: var(--pf-t--global--font--weight--body--100);
901
901
  --pf-t--global--font--weight--body--bold: var(--pf-t--global--font--weight--body--200);
902
902
  --pf-t--global--font--weight--heading: var(--pf-t--global--font--weight--heading--100);
@@ -1460,8 +1460,8 @@ h6) {
1460
1460
  }
1461
1461
 
1462
1462
  *,
1463
- :where(*::before,
1464
- *::after) {
1463
+ *::before,
1464
+ *::after {
1465
1465
  box-sizing: border-box;
1466
1466
  }
1467
1467
 
@@ -1548,10 +1548,6 @@ button) {
1548
1548
  cursor: pointer;
1549
1549
  }
1550
1550
 
1551
- :where(.pf-theme-dark) {
1552
- color-scheme: dark;
1553
- }
1554
-
1555
1551
  .pf-t-dark.pf-m-transparent {
1556
1552
  background-color: transparent;
1557
1553
  }
@@ -17411,23 +17407,23 @@ button.pf-v5-c-label__content:focus {
17411
17407
  }
17412
17408
 
17413
17409
  .pf-v5-c-list {
17414
- --pf-v5-c-list--PaddingLeft: var(--pf-v5-global--spacer--lg);
17415
- --pf-v5-c-list--nested--MarginTop: var(--pf-v5-global--spacer--sm);
17416
- --pf-v5-c-list--nested--MarginLeft: var(--pf-v5-global--spacer--sm);
17410
+ --pf-v5-c-list--PaddingLeft: var(--pf-t--global--spacer--lg);
17411
+ --pf-v5-c-list--nested--MarginTop: var(--pf-t--global--spacer--sm);
17412
+ --pf-v5-c-list--nested--MarginLeft: var(--pf-t--global--spacer--sm);
17417
17413
  --pf-v5-c-list--ul--ListStyle: var(--pf-v5-global--ListStyle);
17418
- --pf-v5-c-list--li--MarginTop: var(--pf-v5-global--spacer--sm);
17419
- --pf-v5-c-list--m-inline--li--MarginRight: var(--pf-v5-global--spacer--lg);
17420
- --pf-v5-c-list--m-bordered--li--PaddingBottom: var(--pf-v5-global--spacer--sm);
17421
- --pf-v5-c-list--m-bordered--li--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
17422
- --pf-v5-c-list--m-bordered--li--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
17423
- --pf-v5-c-list__item-icon--MinWidth: var(--pf-v5-global--icon--FontSize--sm);
17424
- --pf-v5-c-list__item-icon--MarginTop: 0.375rem;
17425
- --pf-v5-c-list__item-icon--MarginRight: var(--pf-v5-global--spacer--sm);
17426
- --pf-v5-c-list__item-icon--Color: var(--pf-v5-global--icon--Color--dark);
17427
- --pf-v5-c-list__item-icon--FontSize: var(--pf-v5-global--icon--FontSize--sm);
17428
- --pf-v5-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-v5-global--icon--FontSize--lg);
17429
- --pf-v5-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-v5-global--spacer--md);
17430
- --pf-v5-c-list--m-icon-lg__item-icon--FontSize: var(--pf-v5-global--icon--FontSize--lg);
17414
+ --pf-v5-c-list--li--MarginTop: var(--pf-t--global--spacer--sm);
17415
+ --pf-v5-c-list--m-inline--li--MarginRight: var(--pf-t--global--spacer--lg);
17416
+ --pf-v5-c-list--m-bordered--li--PaddingBottom: var(--pf-t--global--spacer--sm);
17417
+ --pf-v5-c-list--m-bordered--li--BorderBottomColor: var(--pf-t--global--border--color--default);
17418
+ --pf-v5-c-list--m-bordered--li--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
17419
+ --pf-v5-c-list__item-icon--MinWidth: var(--pf-t--global--icon--size--sm);
17420
+ --pf-v5-c-list__item-icon--MarginTop: var(--pf-t--global--spacer--xs);
17421
+ --pf-v5-c-list__item-icon--MarginRight: var(--pf-t--global--spacer--sm);
17422
+ --pf-v5-c-list__item-icon--Color: var(--pf-t--global--icon--color--regular);
17423
+ --pf-v5-c-list__item-icon--FontSize: var(--pf-t--global--icon--size--sm);
17424
+ --pf-v5-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-t--global--icon--size--lg);
17425
+ --pf-v5-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-t--global--spacer--md);
17426
+ --pf-v5-c-list--m-icon-lg__item-icon--FontSize: var(--pf-t--global--icon--size--lg);
17431
17427
  padding-inline-start: var(--pf-v5-c-list--PaddingLeft);
17432
17428
  }
17433
17429
  .pf-v5-c-list ol,
@@ -30689,26 +30685,47 @@ svg.pf-v5-c-spinner.pf-m-xl {
30689
30685
  --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-c-timestamp--m-help-text--focus--TextDecorationColor);
30690
30686
  }
30691
30687
 
30688
+ :root {
30689
+ --pf-v5-c-title--FontFamily: var(--pf-t--global--font--family--heading);
30690
+ --pf-v5-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30691
+ --pf-v5-c-title--m-4xl--FontSize: var(--pf-t--global--font--size--heading--2xl);
30692
+ --pf-v5-c-title--m-4xl--FontWeight: var(--pf-t--global--font--weight--heading);
30693
+ --pf-v5-c-title--m-3xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30694
+ --pf-v5-c-title--m-3xl--FontSize: var(--pf-t--global--font--size--heading--xl);
30695
+ --pf-v5-c-title--m-3xl--FontWeight: var(--pf-t--global--font--weight--heading);
30696
+ --pf-v5-c-title--m-2xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30697
+ --pf-v5-c-title--m-2xl--FontSize: var(--pf-t--global--font--size--heading--lg);
30698
+ --pf-v5-c-title--m-2xl--FontWeight: var(--pf-t--global--font--weight--heading);
30699
+ --pf-v5-c-title--m-xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30700
+ --pf-v5-c-title--m-xl--FontSize: var(--pf-t--global--font--size--heading--md);
30701
+ --pf-v5-c-title--m-xl--FontWeight: var(--pf-t--global--font--weight--heading);
30702
+ --pf-v5-c-title--m-lg--LineHeight: var(--pf-t--global--font--line-height--heading);
30703
+ --pf-v5-c-title--m-lg--FontSize: var(--pf-t--global--font--size--heading--sm);
30704
+ --pf-v5-c-title--m-lg--FontWeight: var(--pf-t--global--font--weight--heading);
30705
+ --pf-v5-c-title--m-md--LineHeight: var(--pf-t--global--font--line-height--heading);
30706
+ --pf-v5-c-title--m-md--FontSize: var(--pf-t--global--font--size--heading--xs);
30707
+ --pf-v5-c-title--m-md--FontWeight: var(--pf-t--global--font--weight--heading);
30708
+ --pf-v5-c-title--m-h1--LineHeight: var(--pf-t--global--font--line-height--heading);
30709
+ --pf-v5-c-title--m-h1--FontSize: var(--pf-t--global--font--size--heading--lg);
30710
+ --pf-v5-c-title--m-h1--FontWeight: var(--pf-t--global--font--weight--heading);
30711
+ --pf-v5-c-title--m-h2--LineHeight: var(--pf-t--global--font--line-height--heading);
30712
+ --pf-v5-c-title--m-h2--FontSize: var(--pf-t--global--font--size--heading--md);
30713
+ --pf-v5-c-title--m-h2--FontWeight: var(--pf-t--global--font--weight--heading);
30714
+ --pf-v5-c-title--m-h3--LineHeight: var(--pf-t--global--font--line-height--heading);
30715
+ --pf-v5-c-title--m-h3--FontSize: var(--pf-t--global--font--size--heading--sm);
30716
+ --pf-v5-c-title--m-h3--FontWeight: var(--pf-t--global--font--weight--heading);
30717
+ --pf-v5-c-title--m-h4--LineHeight: var(--pf-t--global--font--line-height--heading);
30718
+ --pf-v5-c-title--m-h4--FontSize: var(--pf-t--global--font--size--heading--xs);
30719
+ --pf-v5-c-title--m-h4--FontWeight: var(--pf-t--global--font--weight--heading);
30720
+ --pf-v5-c-title--m-h5--LineHeight: var(--pf-t--global--font--line-height--heading);
30721
+ --pf-v5-c-title--m-h5--FontSize: var(--pf-t--global--font--size--heading--xs);
30722
+ --pf-v5-c-title--m-h5--FontWeight: var(--pf-t--global--font--weight--heading);
30723
+ --pf-v5-c-title--m-h6--LineHeight: var(--pf-t--global--font--line-height--heading);
30724
+ --pf-v5-c-title--m-h6--FontSize: var(--pf-t--global--font--size--heading--xs);
30725
+ --pf-v5-c-title--m-h6--FontWeight: var(--pf-t--global--font--weight--heading);
30726
+ }
30727
+
30692
30728
  .pf-v5-c-title {
30693
- --pf-v5-c-title--FontFamily: var(--pf-v5-global--FontFamily--heading);
30694
- --pf-v5-c-title--m-4xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30695
- --pf-v5-c-title--m-4xl--FontSize: var(--pf-v5-global--FontSize--4xl);
30696
- --pf-v5-c-title--m-4xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30697
- --pf-v5-c-title--m-3xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30698
- --pf-v5-c-title--m-3xl--FontSize: var(--pf-v5-global--FontSize--3xl);
30699
- --pf-v5-c-title--m-3xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30700
- --pf-v5-c-title--m-2xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30701
- --pf-v5-c-title--m-2xl--FontSize: var(--pf-v5-global--FontSize--2xl);
30702
- --pf-v5-c-title--m-2xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30703
- --pf-v5-c-title--m-xl--LineHeight: var(--pf-v5-global--LineHeight--md);
30704
- --pf-v5-c-title--m-xl--FontSize: var(--pf-v5-global--FontSize--xl);
30705
- --pf-v5-c-title--m-xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30706
- --pf-v5-c-title--m-lg--LineHeight: var(--pf-v5-global--LineHeight--md);
30707
- --pf-v5-c-title--m-lg--FontSize: var(--pf-v5-global--FontSize--lg);
30708
- --pf-v5-c-title--m-lg--FontWeight: var(--pf-v5-global--FontWeight--normal);
30709
- --pf-v5-c-title--m-md--LineHeight: var(--pf-v5-global--LineHeight--md);
30710
- --pf-v5-c-title--m-md--FontSize: var(--pf-v5-global--FontSize--md);
30711
- --pf-v5-c-title--m-md--FontWeight: var(--pf-v5-global--FontWeight--normal);
30712
30729
  font-family: var(--pf-v5-c-title--FontFamily);
30713
30730
  word-break: break-word;
30714
30731
  }
@@ -30742,6 +30759,36 @@ svg.pf-v5-c-spinner.pf-m-xl {
30742
30759
  font-weight: var(--pf-v5-c-title--m-md--FontWeight);
30743
30760
  line-height: var(--pf-v5-c-title--m-md--LineHeight);
30744
30761
  }
30762
+ .pf-v5-c-title.pf-m-h1 {
30763
+ font-size: var(--pf-v5-c-title--m-h1--FontSize);
30764
+ font-weight: var(--pf-v5-c-title--m-h1--FontWeight);
30765
+ line-height: var(--pf-v5-c-title--m-h1--LineHeight);
30766
+ }
30767
+ .pf-v5-c-title.pf-m-h2 {
30768
+ font-size: var(--pf-v5-c-title--m-h2--FontSize);
30769
+ font-weight: var(--pf-v5-c-title--m-h2--FontWeight);
30770
+ line-height: var(--pf-v5-c-title--m-h2--LineHeight);
30771
+ }
30772
+ .pf-v5-c-title.pf-m-h3 {
30773
+ font-size: var(--pf-v5-c-title--m-h3--FontSize);
30774
+ font-weight: var(--pf-v5-c-title--m-h3--FontWeight);
30775
+ line-height: var(--pf-v5-c-title--m-h3--LineHeight);
30776
+ }
30777
+ .pf-v5-c-title.pf-m-h4 {
30778
+ font-size: var(--pf-v5-c-title--m-h4--FontSize);
30779
+ font-weight: var(--pf-v5-c-title--m-h4--FontWeight);
30780
+ line-height: var(--pf-v5-c-title--m-h4--LineHeight);
30781
+ }
30782
+ .pf-v5-c-title.pf-m-h5 {
30783
+ font-size: var(--pf-v5-c-title--m-h5--FontSize);
30784
+ font-weight: var(--pf-v5-c-title--m-h5--FontWeight);
30785
+ line-height: var(--pf-v5-c-title--m-h5--LineHeight);
30786
+ }
30787
+ .pf-v5-c-title.pf-m-h6 {
30788
+ font-size: var(--pf-v5-c-title--m-h6--FontSize);
30789
+ font-weight: var(--pf-v5-c-title--m-h6--FontWeight);
30790
+ line-height: var(--pf-v5-c-title--m-h6--LineHeight);
30791
+ }
30745
30792
 
30746
30793
  .pf-v5-c-toggle-group {
30747
30794
  --pf-v5-c-toggle-group__button--PaddingTop: var(--pf-v5-global--spacer--form-element);
package/patternfly.css CHANGED
@@ -889,14 +889,14 @@
889
889
  --pf-t--global--font--size--heading--100: 16px;
890
890
  --pf-t--global--font--size--heading--200: 18px;
891
891
  --pf-t--global--font--size--heading--300: 20px;
892
- --pf-t--global--font--size--heading--400: 24px;
892
+ --pf-t--global--font--size--heading--400: 22px;
893
893
  --pf-t--global--font--size--heading--500: 28px;
894
894
  --pf-t--global--font--size--heading--600: 36px;
895
895
  --pf-t--global--font--family--body: var(--pf-t--global--font--family--100);
896
896
  --pf-t--global--font--family--heading: var(--pf-t--global--font--family--200);
897
897
  --pf-t--global--font--family--mono: var(--pf-t--global--font--family--300);
898
- --pf-t--global--font--line-height--body: var(--pf-t--global--font--line-height--100);
899
- --pf-t--global--font--line-height--heading: var(--pf-t--global--font--line-height--200);
898
+ --pf-t--global--font--line-height--body: var(--pf-t--global--font--line-height--200);
899
+ --pf-t--global--font--line-height--heading: var(--pf-t--global--font--line-height--100);
900
900
  --pf-t--global--font--weight--body: var(--pf-t--global--font--weight--body--100);
901
901
  --pf-t--global--font--weight--body--bold: var(--pf-t--global--font--weight--body--200);
902
902
  --pf-t--global--font--weight--heading: var(--pf-t--global--font--weight--heading--100);
@@ -1460,8 +1460,8 @@ h6) {
1460
1460
  }
1461
1461
 
1462
1462
  *,
1463
- :where(*::before,
1464
- *::after) {
1463
+ *::before,
1464
+ *::after {
1465
1465
  box-sizing: border-box;
1466
1466
  }
1467
1467
 
@@ -1548,10 +1548,6 @@ button) {
1548
1548
  cursor: pointer;
1549
1549
  }
1550
1550
 
1551
- :where(.pf-v5-theme-dark) {
1552
- color-scheme: dark;
1553
- }
1554
-
1555
1551
  .pf-v5-t-dark.pf-m-transparent {
1556
1552
  background-color: transparent;
1557
1553
  }
@@ -17411,23 +17407,23 @@ button.pf-v5-c-label__content:focus {
17411
17407
  }
17412
17408
 
17413
17409
  .pf-v5-c-list {
17414
- --pf-v5-c-list--PaddingLeft: var(--pf-v5-global--spacer--lg);
17415
- --pf-v5-c-list--nested--MarginTop: var(--pf-v5-global--spacer--sm);
17416
- --pf-v5-c-list--nested--MarginLeft: var(--pf-v5-global--spacer--sm);
17410
+ --pf-v5-c-list--PaddingLeft: var(--pf-t--global--spacer--lg);
17411
+ --pf-v5-c-list--nested--MarginTop: var(--pf-t--global--spacer--sm);
17412
+ --pf-v5-c-list--nested--MarginLeft: var(--pf-t--global--spacer--sm);
17417
17413
  --pf-v5-c-list--ul--ListStyle: var(--pf-v5-global--ListStyle);
17418
- --pf-v5-c-list--li--MarginTop: var(--pf-v5-global--spacer--sm);
17419
- --pf-v5-c-list--m-inline--li--MarginRight: var(--pf-v5-global--spacer--lg);
17420
- --pf-v5-c-list--m-bordered--li--PaddingBottom: var(--pf-v5-global--spacer--sm);
17421
- --pf-v5-c-list--m-bordered--li--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
17422
- --pf-v5-c-list--m-bordered--li--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
17423
- --pf-v5-c-list__item-icon--MinWidth: var(--pf-v5-global--icon--FontSize--sm);
17424
- --pf-v5-c-list__item-icon--MarginTop: 0.375rem;
17425
- --pf-v5-c-list__item-icon--MarginRight: var(--pf-v5-global--spacer--sm);
17426
- --pf-v5-c-list__item-icon--Color: var(--pf-v5-global--icon--Color--dark);
17427
- --pf-v5-c-list__item-icon--FontSize: var(--pf-v5-global--icon--FontSize--sm);
17428
- --pf-v5-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-v5-global--icon--FontSize--lg);
17429
- --pf-v5-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-v5-global--spacer--md);
17430
- --pf-v5-c-list--m-icon-lg__item-icon--FontSize: var(--pf-v5-global--icon--FontSize--lg);
17414
+ --pf-v5-c-list--li--MarginTop: var(--pf-t--global--spacer--sm);
17415
+ --pf-v5-c-list--m-inline--li--MarginRight: var(--pf-t--global--spacer--lg);
17416
+ --pf-v5-c-list--m-bordered--li--PaddingBottom: var(--pf-t--global--spacer--sm);
17417
+ --pf-v5-c-list--m-bordered--li--BorderBottomColor: var(--pf-t--global--border--color--default);
17418
+ --pf-v5-c-list--m-bordered--li--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
17419
+ --pf-v5-c-list__item-icon--MinWidth: var(--pf-t--global--icon--size--sm);
17420
+ --pf-v5-c-list__item-icon--MarginTop: var(--pf-t--global--spacer--xs);
17421
+ --pf-v5-c-list__item-icon--MarginRight: var(--pf-t--global--spacer--sm);
17422
+ --pf-v5-c-list__item-icon--Color: var(--pf-t--global--icon--color--regular);
17423
+ --pf-v5-c-list__item-icon--FontSize: var(--pf-t--global--icon--size--sm);
17424
+ --pf-v5-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-t--global--icon--size--lg);
17425
+ --pf-v5-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-t--global--spacer--md);
17426
+ --pf-v5-c-list--m-icon-lg__item-icon--FontSize: var(--pf-t--global--icon--size--lg);
17431
17427
  padding-inline-start: var(--pf-v5-c-list--PaddingLeft);
17432
17428
  }
17433
17429
  .pf-v5-c-list ol,
@@ -30689,26 +30685,47 @@ svg.pf-v5-c-spinner.pf-m-xl {
30689
30685
  --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-c-timestamp--m-help-text--focus--TextDecorationColor);
30690
30686
  }
30691
30687
 
30688
+ :root {
30689
+ --pf-v5-c-title--FontFamily: var(--pf-t--global--font--family--heading);
30690
+ --pf-v5-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30691
+ --pf-v5-c-title--m-4xl--FontSize: var(--pf-t--global--font--size--heading--2xl);
30692
+ --pf-v5-c-title--m-4xl--FontWeight: var(--pf-t--global--font--weight--heading);
30693
+ --pf-v5-c-title--m-3xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30694
+ --pf-v5-c-title--m-3xl--FontSize: var(--pf-t--global--font--size--heading--xl);
30695
+ --pf-v5-c-title--m-3xl--FontWeight: var(--pf-t--global--font--weight--heading);
30696
+ --pf-v5-c-title--m-2xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30697
+ --pf-v5-c-title--m-2xl--FontSize: var(--pf-t--global--font--size--heading--lg);
30698
+ --pf-v5-c-title--m-2xl--FontWeight: var(--pf-t--global--font--weight--heading);
30699
+ --pf-v5-c-title--m-xl--LineHeight: var(--pf-t--global--font--line-height--heading);
30700
+ --pf-v5-c-title--m-xl--FontSize: var(--pf-t--global--font--size--heading--md);
30701
+ --pf-v5-c-title--m-xl--FontWeight: var(--pf-t--global--font--weight--heading);
30702
+ --pf-v5-c-title--m-lg--LineHeight: var(--pf-t--global--font--line-height--heading);
30703
+ --pf-v5-c-title--m-lg--FontSize: var(--pf-t--global--font--size--heading--sm);
30704
+ --pf-v5-c-title--m-lg--FontWeight: var(--pf-t--global--font--weight--heading);
30705
+ --pf-v5-c-title--m-md--LineHeight: var(--pf-t--global--font--line-height--heading);
30706
+ --pf-v5-c-title--m-md--FontSize: var(--pf-t--global--font--size--heading--xs);
30707
+ --pf-v5-c-title--m-md--FontWeight: var(--pf-t--global--font--weight--heading);
30708
+ --pf-v5-c-title--m-h1--LineHeight: var(--pf-t--global--font--line-height--heading);
30709
+ --pf-v5-c-title--m-h1--FontSize: var(--pf-t--global--font--size--heading--lg);
30710
+ --pf-v5-c-title--m-h1--FontWeight: var(--pf-t--global--font--weight--heading);
30711
+ --pf-v5-c-title--m-h2--LineHeight: var(--pf-t--global--font--line-height--heading);
30712
+ --pf-v5-c-title--m-h2--FontSize: var(--pf-t--global--font--size--heading--md);
30713
+ --pf-v5-c-title--m-h2--FontWeight: var(--pf-t--global--font--weight--heading);
30714
+ --pf-v5-c-title--m-h3--LineHeight: var(--pf-t--global--font--line-height--heading);
30715
+ --pf-v5-c-title--m-h3--FontSize: var(--pf-t--global--font--size--heading--sm);
30716
+ --pf-v5-c-title--m-h3--FontWeight: var(--pf-t--global--font--weight--heading);
30717
+ --pf-v5-c-title--m-h4--LineHeight: var(--pf-t--global--font--line-height--heading);
30718
+ --pf-v5-c-title--m-h4--FontSize: var(--pf-t--global--font--size--heading--xs);
30719
+ --pf-v5-c-title--m-h4--FontWeight: var(--pf-t--global--font--weight--heading);
30720
+ --pf-v5-c-title--m-h5--LineHeight: var(--pf-t--global--font--line-height--heading);
30721
+ --pf-v5-c-title--m-h5--FontSize: var(--pf-t--global--font--size--heading--xs);
30722
+ --pf-v5-c-title--m-h5--FontWeight: var(--pf-t--global--font--weight--heading);
30723
+ --pf-v5-c-title--m-h6--LineHeight: var(--pf-t--global--font--line-height--heading);
30724
+ --pf-v5-c-title--m-h6--FontSize: var(--pf-t--global--font--size--heading--xs);
30725
+ --pf-v5-c-title--m-h6--FontWeight: var(--pf-t--global--font--weight--heading);
30726
+ }
30727
+
30692
30728
  .pf-v5-c-title {
30693
- --pf-v5-c-title--FontFamily: var(--pf-v5-global--FontFamily--heading);
30694
- --pf-v5-c-title--m-4xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30695
- --pf-v5-c-title--m-4xl--FontSize: var(--pf-v5-global--FontSize--4xl);
30696
- --pf-v5-c-title--m-4xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30697
- --pf-v5-c-title--m-3xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30698
- --pf-v5-c-title--m-3xl--FontSize: var(--pf-v5-global--FontSize--3xl);
30699
- --pf-v5-c-title--m-3xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30700
- --pf-v5-c-title--m-2xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
30701
- --pf-v5-c-title--m-2xl--FontSize: var(--pf-v5-global--FontSize--2xl);
30702
- --pf-v5-c-title--m-2xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30703
- --pf-v5-c-title--m-xl--LineHeight: var(--pf-v5-global--LineHeight--md);
30704
- --pf-v5-c-title--m-xl--FontSize: var(--pf-v5-global--FontSize--xl);
30705
- --pf-v5-c-title--m-xl--FontWeight: var(--pf-v5-global--FontWeight--normal);
30706
- --pf-v5-c-title--m-lg--LineHeight: var(--pf-v5-global--LineHeight--md);
30707
- --pf-v5-c-title--m-lg--FontSize: var(--pf-v5-global--FontSize--lg);
30708
- --pf-v5-c-title--m-lg--FontWeight: var(--pf-v5-global--FontWeight--normal);
30709
- --pf-v5-c-title--m-md--LineHeight: var(--pf-v5-global--LineHeight--md);
30710
- --pf-v5-c-title--m-md--FontSize: var(--pf-v5-global--FontSize--md);
30711
- --pf-v5-c-title--m-md--FontWeight: var(--pf-v5-global--FontWeight--normal);
30712
30729
  font-family: var(--pf-v5-c-title--FontFamily);
30713
30730
  word-break: break-word;
30714
30731
  }
@@ -30742,6 +30759,36 @@ svg.pf-v5-c-spinner.pf-m-xl {
30742
30759
  font-weight: var(--pf-v5-c-title--m-md--FontWeight);
30743
30760
  line-height: var(--pf-v5-c-title--m-md--LineHeight);
30744
30761
  }
30762
+ .pf-v5-c-title.pf-m-h1 {
30763
+ font-size: var(--pf-v5-c-title--m-h1--FontSize);
30764
+ font-weight: var(--pf-v5-c-title--m-h1--FontWeight);
30765
+ line-height: var(--pf-v5-c-title--m-h1--LineHeight);
30766
+ }
30767
+ .pf-v5-c-title.pf-m-h2 {
30768
+ font-size: var(--pf-v5-c-title--m-h2--FontSize);
30769
+ font-weight: var(--pf-v5-c-title--m-h2--FontWeight);
30770
+ line-height: var(--pf-v5-c-title--m-h2--LineHeight);
30771
+ }
30772
+ .pf-v5-c-title.pf-m-h3 {
30773
+ font-size: var(--pf-v5-c-title--m-h3--FontSize);
30774
+ font-weight: var(--pf-v5-c-title--m-h3--FontWeight);
30775
+ line-height: var(--pf-v5-c-title--m-h3--LineHeight);
30776
+ }
30777
+ .pf-v5-c-title.pf-m-h4 {
30778
+ font-size: var(--pf-v5-c-title--m-h4--FontSize);
30779
+ font-weight: var(--pf-v5-c-title--m-h4--FontWeight);
30780
+ line-height: var(--pf-v5-c-title--m-h4--LineHeight);
30781
+ }
30782
+ .pf-v5-c-title.pf-m-h5 {
30783
+ font-size: var(--pf-v5-c-title--m-h5--FontSize);
30784
+ font-weight: var(--pf-v5-c-title--m-h5--FontWeight);
30785
+ line-height: var(--pf-v5-c-title--m-h5--LineHeight);
30786
+ }
30787
+ .pf-v5-c-title.pf-m-h6 {
30788
+ font-size: var(--pf-v5-c-title--m-h6--FontSize);
30789
+ font-weight: var(--pf-v5-c-title--m-h6--FontWeight);
30790
+ line-height: var(--pf-v5-c-title--m-h6--LineHeight);
30791
+ }
30745
30792
 
30746
30793
  .pf-v5-c-toggle-group {
30747
30794
  --pf-v5-c-toggle-group__button--PaddingTop: var(--pf-v5-global--spacer--form-element);