@patternfly/patternfly 4.167.0 → 4.171.0

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.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "4.167.0",
4
+ "version": "4.171.0",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -10364,6 +10364,12 @@ label.pf-c-check, .pf-c-check__label,
10364
10364
  --pf-c-toolbar--spacer: 0;
10365
10365
  }
10366
10366
 
10367
+ .pf-c-toolbar__group.pf-m-overflow-container,
10368
+ .pf-c-toolbar__item.pf-m-overflow-container {
10369
+ flex: 1;
10370
+ overflow: hidden;
10371
+ }
10372
+
10367
10373
  .pf-c-toolbar__expand-all-icon {
10368
10374
  display: inline-block;
10369
10375
  transition: var(--pf-c-toolbar__expand-all-icon--Transition);
@@ -12651,6 +12657,10 @@ label.pf-c-check, .pf-c-check__label,
12651
12657
  white-space: nowrap;
12652
12658
  }
12653
12659
 
12660
+ .pf-c-dropdown__toggle-text {
12661
+ flex: 0 1 auto;
12662
+ }
12663
+
12654
12664
  .pf-c-dropdown__toggle-icon {
12655
12665
  margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
12656
12666
  margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
@@ -12662,6 +12672,7 @@ label.pf-c-check, .pf-c-check__label,
12662
12672
 
12663
12673
  .pf-c-dropdown__toggle-image {
12664
12674
  display: inline-flex;
12675
+ flex-shrink: 0;
12665
12676
  margin-top: var(--pf-c-dropdown__toggle-image--MarginTop);
12666
12677
  margin-right: var(--pf-c-dropdown__toggle-image--MarginRight);
12667
12678
  margin-bottom: var(--pf-c-dropdown__toggle-image--MarginBottom);
@@ -15592,13 +15603,8 @@ ul.pf-c-list {
15592
15603
  padding-left: var(--pf-c-masthead--PaddingLeft);
15593
15604
  background-color: var(--pf-c-masthead--BackgroundColor);
15594
15605
  }
15595
- @media screen and (min-width: 1200px) {
15596
- .pf-c-masthead {
15597
- --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15598
- }
15599
- }
15600
15606
  @media screen and (min-width: 768px) {
15601
- .pf-c-masthead {
15607
+ .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
15602
15608
  --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
15603
15609
  --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
15604
15610
  --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
@@ -15618,6 +15624,14 @@ ul.pf-c-list {
15618
15624
  --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
15619
15625
  }
15620
15626
  }
15627
+ @media screen and (min-width: 1200px) {
15628
+ .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
15629
+ --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15630
+ }
15631
+ }
15632
+ .pf-c-page:where(.pf-m-breakpoint-xl) .pf-c-masthead {
15633
+ --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15634
+ }
15621
15635
  .pf-c-masthead.pf-m-light {
15622
15636
  color: var(--pf-global--Color--100);
15623
15637
  --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light--BackgroundColor);
@@ -15674,6 +15688,9 @@ ul.pf-c-list {
15674
15688
  --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor);
15675
15689
  --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor);
15676
15690
  }
15691
+ .pf-c-masthead .pf-c-nav {
15692
+ align-self: stretch;
15693
+ }
15677
15694
 
15678
15695
  .pf-c-masthead__main {
15679
15696
  position: relative;
@@ -24261,6 +24278,7 @@ svg.pf-c-spinner.pf-m-xl {
24261
24278
  --pf-c-table--thead--m-nested-column-header--tr--PaddingTop: var(--pf-global--spacer--xs);
24262
24279
  --pf-c-table--thead--m-nested-column-header--tr--PaddingBottom: var(--pf-global--spacer--xs);
24263
24280
  --pf-c-table__subhead--Color: var(--pf-global--Color--200);
24281
+ --pf-c-table--m-striped__tr--BackgroundColor: var(--pf-global--BackgroundColor--light-200);
24264
24282
  color: var(--pf-global--Color--100);
24265
24283
  width: 100%;
24266
24284
  background-color: var(--pf-c-table--BackgroundColor);
@@ -24302,6 +24320,13 @@ svg.pf-c-spinner.pf-m-xl {
24302
24320
  content: "";
24303
24321
  border-bottom: var(--pf-c-table--border-width--base) solid var(--pf-c-table--BorderColor);
24304
24322
  }
24323
+ .pf-c-table.pf-m-striped:not(.pf-m-expandable) > tbody > tr:nth-child(odd), .pf-c-table.pf-m-striped.pf-m-expandable > tbody:nth-of-type(odd) > tr:not(.pf-c-table__expandable-row),
24324
+ .pf-c-table > .pf-m-striped > tr:nth-child(odd),
24325
+ .pf-c-table > .pf-m-striped-even > tr:nth-child(even),
24326
+ .pf-c-table tr.pf-m-striped {
24327
+ --pf-c-table__sticky-column--BackgroundColor: var(--pf-c-table--m-striped__tr--BackgroundColor);
24328
+ background: var(--pf-c-table--m-striped__tr--BackgroundColor);
24329
+ }
24305
24330
  .pf-c-table tr:not(.pf-c-table__expandable-row) {
24306
24331
  border-bottom: var(--pf-c-table--border-width--base) solid var(--pf-c-table--BorderColor);
24307
24332
  }
package/patternfly.css CHANGED
@@ -10486,6 +10486,12 @@ label.pf-c-check, .pf-c-check__label,
10486
10486
  --pf-c-toolbar--spacer: 0;
10487
10487
  }
10488
10488
 
10489
+ .pf-c-toolbar__group.pf-m-overflow-container,
10490
+ .pf-c-toolbar__item.pf-m-overflow-container {
10491
+ flex: 1;
10492
+ overflow: hidden;
10493
+ }
10494
+
10489
10495
  .pf-c-toolbar__expand-all-icon {
10490
10496
  display: inline-block;
10491
10497
  transition: var(--pf-c-toolbar__expand-all-icon--Transition);
@@ -12773,6 +12779,10 @@ label.pf-c-check, .pf-c-check__label,
12773
12779
  white-space: nowrap;
12774
12780
  }
12775
12781
 
12782
+ .pf-c-dropdown__toggle-text {
12783
+ flex: 0 1 auto;
12784
+ }
12785
+
12776
12786
  .pf-c-dropdown__toggle-icon {
12777
12787
  margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
12778
12788
  margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
@@ -12784,6 +12794,7 @@ label.pf-c-check, .pf-c-check__label,
12784
12794
 
12785
12795
  .pf-c-dropdown__toggle-image {
12786
12796
  display: inline-flex;
12797
+ flex-shrink: 0;
12787
12798
  margin-top: var(--pf-c-dropdown__toggle-image--MarginTop);
12788
12799
  margin-right: var(--pf-c-dropdown__toggle-image--MarginRight);
12789
12800
  margin-bottom: var(--pf-c-dropdown__toggle-image--MarginBottom);
@@ -15714,13 +15725,8 @@ ul.pf-c-list {
15714
15725
  padding-left: var(--pf-c-masthead--PaddingLeft);
15715
15726
  background-color: var(--pf-c-masthead--BackgroundColor);
15716
15727
  }
15717
- @media screen and (min-width: 1200px) {
15718
- .pf-c-masthead {
15719
- --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15720
- }
15721
- }
15722
15728
  @media screen and (min-width: 768px) {
15723
- .pf-c-masthead {
15729
+ .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
15724
15730
  --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
15725
15731
  --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
15726
15732
  --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
@@ -15740,6 +15746,14 @@ ul.pf-c-list {
15740
15746
  --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
15741
15747
  }
15742
15748
  }
15749
+ @media screen and (min-width: 1200px) {
15750
+ .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
15751
+ --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15752
+ }
15753
+ }
15754
+ .pf-c-page:where(.pf-m-breakpoint-xl) .pf-c-masthead {
15755
+ --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15756
+ }
15743
15757
  .pf-c-masthead.pf-m-light {
15744
15758
  color: var(--pf-global--Color--100);
15745
15759
  --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light--BackgroundColor);
@@ -15796,6 +15810,9 @@ ul.pf-c-list {
15796
15810
  --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor);
15797
15811
  --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor);
15798
15812
  }
15813
+ .pf-c-masthead .pf-c-nav {
15814
+ align-self: stretch;
15815
+ }
15799
15816
 
15800
15817
  .pf-c-masthead__main {
15801
15818
  position: relative;
@@ -24383,6 +24400,7 @@ svg.pf-c-spinner.pf-m-xl {
24383
24400
  --pf-c-table--thead--m-nested-column-header--tr--PaddingTop: var(--pf-global--spacer--xs);
24384
24401
  --pf-c-table--thead--m-nested-column-header--tr--PaddingBottom: var(--pf-global--spacer--xs);
24385
24402
  --pf-c-table__subhead--Color: var(--pf-global--Color--200);
24403
+ --pf-c-table--m-striped__tr--BackgroundColor: var(--pf-global--BackgroundColor--light-200);
24386
24404
  color: var(--pf-global--Color--100);
24387
24405
  width: 100%;
24388
24406
  background-color: var(--pf-c-table--BackgroundColor);
@@ -24424,6 +24442,13 @@ svg.pf-c-spinner.pf-m-xl {
24424
24442
  content: "";
24425
24443
  border-bottom: var(--pf-c-table--border-width--base) solid var(--pf-c-table--BorderColor);
24426
24444
  }
24445
+ .pf-c-table.pf-m-striped:not(.pf-m-expandable) > tbody > tr:nth-child(odd), .pf-c-table.pf-m-striped.pf-m-expandable > tbody:nth-of-type(odd) > tr:not(.pf-c-table__expandable-row),
24446
+ .pf-c-table > .pf-m-striped > tr:nth-child(odd),
24447
+ .pf-c-table > .pf-m-striped-even > tr:nth-child(even),
24448
+ .pf-c-table tr.pf-m-striped {
24449
+ --pf-c-table__sticky-column--BackgroundColor: var(--pf-c-table--m-striped__tr--BackgroundColor);
24450
+ background: var(--pf-c-table--m-striped__tr--BackgroundColor);
24451
+ }
24427
24452
  .pf-c-table tr:not(.pf-c-table__expandable-row) {
24428
24453
  border-bottom: var(--pf-c-table--border-width--base) solid var(--pf-c-table--BorderColor);
24429
24454
  }