@patternfly/patternfly 4.176.0 → 4.176.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/components/Label/label.css +43 -12
  2. package/components/Label/label.scss +45 -13
  3. package/docs/components/Label/examples/Label.md +33 -67
  4. package/docs/components/LabelGroup/examples/LabelGroup.md +64 -107
  5. package/docs/demos/Card/examples/Card.md +0 -22
  6. package/docs/demos/Tabs/examples/Tabs.md +0 -2
  7. package/package.json +1 -1
  8. package/patternfly-no-reset.css +43 -12
  9. package/patternfly.css +43 -12
  10. package/patternfly.min.css +1 -1
  11. package/patternfly.min.css.map +1 -1
package/patternfly-no-reset.css CHANGED
@@ -14671,7 +14671,9 @@ label.pf-c-input-group__text {
14671
14671
  --pf-c-label--m-compact--FontSize: var(--pf-global--FontSize--xs);
14672
14672
  --pf-c-label--m-compact--m-editable--TextDecorationOffset: 0.0625rem;
14673
14673
  --pf-c-label__content--Color: var(--pf-global--Color--100);
14674
+ --pf-c-label__content--MaxWidth: 100%;
14674
14675
  --pf-c-label--m-outline__content--Color: var(--pf-global--Color--100);
14676
+ --pf-c-label--m-editable__content--MaxWidth: 16ch;
14675
14677
  --pf-c-label__text--MaxWidth: 16ch;
14676
14678
  --pf-c-label__icon--Color: var(--pf-global--Color--100);
14677
14679
  --pf-c-label__icon--MarginRight: var(--pf-global--spacer--xs);
@@ -14684,8 +14686,6 @@ label.pf-c-input-group__text {
14684
14686
  --pf-c-label__c-button--PaddingRight: var(--pf-global--spacer--sm);
14685
14687
  --pf-c-label__c-button--PaddingBottom: var(--pf-global--spacer--xs);
14686
14688
  --pf-c-label__c-button--PaddingLeft: var(--pf-global--spacer--sm);
14687
- --pf-c-label__editable-text--MaxWidth: 16ch;
14688
- --pf-c-label__editable-text--BorderWidth: 0;
14689
14689
  --pf-c-label--m-editable--Cursor: pointer;
14690
14690
  --pf-c-label--m-editable--TextDecoration: underline;
14691
14691
  --pf-c-label--m-editable--TextDecorationStyle: dashed;
@@ -14694,6 +14694,12 @@ label.pf-c-input-group__text {
14694
14694
  --pf-c-label--m-editable--TextDecorationColor: var(--pf-global--BorderColor--200);
14695
14695
  --pf-c-label--m-editable--hover--TextDecorationColor: var(--pf-global--Color--100);
14696
14696
  --pf-c-label--m-editable--focus--TextDecorationColor: var(--pf-global--Color--100);
14697
+ --pf-c-label--m-editable__content--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14698
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-global--BorderColor--100);
14699
+ --pf-c-label--m-editable__content--hover--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14700
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-global--BorderColor--100);
14701
+ --pf-c-label--m-editable__content--focus--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14702
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-global--BorderColor--100);
14697
14703
  --pf-c-label--m-editable--m-editable-active--Cursor: auto;
14698
14704
  --pf-c-label--m-editable--m-editable-active--TextDecoration: none;
14699
14705
  --pf-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
@@ -14727,6 +14733,9 @@ label.pf-c-input-group__text {
14727
14733
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--before--BorderColor);
14728
14734
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--link--hover--before--BorderColor);
14729
14735
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--link--focus--before--BorderColor);
14736
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14737
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14738
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14730
14739
  }
14731
14740
  .pf-c-label.pf-m-green {
14732
14741
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-green--BackgroundColor);
@@ -14739,6 +14748,9 @@ label.pf-c-input-group__text {
14739
14748
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--before--BorderColor);
14740
14749
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor);
14741
14750
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor);
14751
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14752
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14753
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14742
14754
  }
14743
14755
  .pf-c-label.pf-m-orange {
14744
14756
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-orange--BackgroundColor);
@@ -14751,6 +14763,9 @@ label.pf-c-input-group__text {
14751
14763
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--before--BorderColor);
14752
14764
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--link--hover--before--BorderColor);
14753
14765
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--link--focus--before--BorderColor);
14766
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14767
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14768
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14754
14769
  }
14755
14770
  .pf-c-label.pf-m-red {
14756
14771
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-red--BackgroundColor);
@@ -14763,6 +14778,9 @@ label.pf-c-input-group__text {
14763
14778
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--before--BorderColor);
14764
14779
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--link--hover--before--BorderColor);
14765
14780
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--link--focus--before--BorderColor);
14781
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14782
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14783
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14766
14784
  }
14767
14785
  .pf-c-label.pf-m-purple {
14768
14786
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-purple--BackgroundColor);
@@ -14775,6 +14793,9 @@ label.pf-c-input-group__text {
14775
14793
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--before--BorderColor);
14776
14794
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--link--hover--before--BorderColor);
14777
14795
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--link--focus--before--BorderColor);
14796
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14797
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14798
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14778
14799
  }
14779
14800
  .pf-c-label.pf-m-cyan {
14780
14801
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-cyan--BackgroundColor);
@@ -14787,12 +14808,18 @@ label.pf-c-input-group__text {
14787
14808
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--before--BorderColor);
14788
14809
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor);
14789
14810
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor);
14811
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14812
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14813
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14790
14814
  }
14791
14815
  .pf-c-label.pf-m-outline {
14792
14816
  --pf-c-label__content--Color: var(--pf-c-label--m-outline__content--Color);
14793
14817
  --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-outline__content--before--BorderWidth);
14794
14818
  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14795
14819
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-outline--BackgroundColor);
14820
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14821
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14822
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14796
14823
  }
14797
14824
  .pf-c-label.pf-m-overflow:hover, .pf-c-label.pf-m-outline a.pf-c-label__content:hover,
14798
14825
  .pf-c-label.pf-m-outline button.pf-c-label__content:hover {
@@ -14812,6 +14839,15 @@ label.pf-c-input-group__text {
14812
14839
  text-decoration-thickness: var(--pf-c-label--m-editable--TextDecorationThickness);
14813
14840
  text-underline-offset: var(--pf-c-label--m-editable--TextDecorationOffset);
14814
14841
  text-decoration-color: var(--pf-c-label--m-editable--TextDecorationColor);
14842
+ --pf-c-label__content--MaxWidth: var(--pf-c-label--m-editable__content--MaxWidth);
14843
+ --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14844
+ --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable__content--before--BorderColor);
14845
+ --pf-c-label__content--link--hover--before--BorderWidth: var(--pf-c-label--m-editable__content--hover--before--BorderWidth);
14846
+ --pf-c-label__content--link--hover--before--BorderColor: var(--pf-c-label--m-editable__content--hover--before--BorderColor);
14847
+ --pf-c-label__content--link--focus--before--BorderWidth: var(--pf-c-label--m-editable__content--focus--before--BorderWidth);
14848
+ --pf-c-label__content--link--focus--before--BorderColor: var(--pf-c-label--m-editable__content--focus--before--BorderColor);
14849
+ --pf-c-label--m-outline__content--link--hover--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14850
+ --pf-c-label--m-outline__content--link--focus--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14815
14851
  }
14816
14852
  .pf-c-label.pf-m-editable:hover {
14817
14853
  --pf-c-label--m-editable--TextDecorationColor: var(--pf-c-label--m-editable--hover--TextDecorationColor);
@@ -14823,19 +14859,10 @@ label.pf-c-input-group__text {
14823
14859
  --pf-c-label--m-editable--Cursor: var(--pf-c-label--m-editable--m-editable-active--Cursor);
14824
14860
  --pf-c-label--m-editable--TextDecoration: var(--pf-c-label--m-editable--m-editable-active--TextDecoration);
14825
14861
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-editable--m-editable-active--BackgroundColor);
14826
- --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderWidth);
14827
- --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderColor);
14828
14862
  }
14829
14863
  .pf-c-label.pf-m-editable-active .pf-c-button {
14830
14864
  visibility: hidden;
14831
14865
  }
14832
- .pf-c-label .pf-c-label__editable-text {
14833
- overflow: hidden;
14834
- text-overflow: ellipsis;
14835
- white-space: nowrap;
14836
- max-width: var(--pf-c-label__editable-text--MaxWidth);
14837
- border-width: var(--pf-c-label__editable-text--BorderWidth);
14838
- }
14839
14866
  .pf-c-label .pf-c-button {
14840
14867
  --pf-c-button--FontSize: var(--pf-c-label__c-button--FontSize);
14841
14868
  --pf-c-button--PaddingTop: var(--pf-c-label__c-button--PaddingTop);
@@ -14872,8 +14899,12 @@ label.pf-c-input-group__text {
14872
14899
  }
14873
14900
 
14874
14901
  .pf-c-label__content {
14902
+ overflow: hidden;
14903
+ text-overflow: ellipsis;
14904
+ white-space: nowrap;
14905
+ max-width: var(--pf-c-label__content--MaxWidth);
14875
14906
  color: var(--pf-c-label__content--Color);
14876
- border: 0;
14907
+ border-width: 0;
14877
14908
  }
14878
14909
  .pf-c-label__content::before {
14879
14910
  position: absolute;
package/patternfly.css CHANGED
@@ -14793,7 +14793,9 @@ label.pf-c-input-group__text {
14793
14793
  --pf-c-label--m-compact--FontSize: var(--pf-global--FontSize--xs);
14794
14794
  --pf-c-label--m-compact--m-editable--TextDecorationOffset: 0.0625rem;
14795
14795
  --pf-c-label__content--Color: var(--pf-global--Color--100);
14796
+ --pf-c-label__content--MaxWidth: 100%;
14796
14797
  --pf-c-label--m-outline__content--Color: var(--pf-global--Color--100);
14798
+ --pf-c-label--m-editable__content--MaxWidth: 16ch;
14797
14799
  --pf-c-label__text--MaxWidth: 16ch;
14798
14800
  --pf-c-label__icon--Color: var(--pf-global--Color--100);
14799
14801
  --pf-c-label__icon--MarginRight: var(--pf-global--spacer--xs);
@@ -14806,8 +14808,6 @@ label.pf-c-input-group__text {
14806
14808
  --pf-c-label__c-button--PaddingRight: var(--pf-global--spacer--sm);
14807
14809
  --pf-c-label__c-button--PaddingBottom: var(--pf-global--spacer--xs);
14808
14810
  --pf-c-label__c-button--PaddingLeft: var(--pf-global--spacer--sm);
14809
- --pf-c-label__editable-text--MaxWidth: 16ch;
14810
- --pf-c-label__editable-text--BorderWidth: 0;
14811
14811
  --pf-c-label--m-editable--Cursor: pointer;
14812
14812
  --pf-c-label--m-editable--TextDecoration: underline;
14813
14813
  --pf-c-label--m-editable--TextDecorationStyle: dashed;
@@ -14816,6 +14816,12 @@ label.pf-c-input-group__text {
14816
14816
  --pf-c-label--m-editable--TextDecorationColor: var(--pf-global--BorderColor--200);
14817
14817
  --pf-c-label--m-editable--hover--TextDecorationColor: var(--pf-global--Color--100);
14818
14818
  --pf-c-label--m-editable--focus--TextDecorationColor: var(--pf-global--Color--100);
14819
+ --pf-c-label--m-editable__content--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14820
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-global--BorderColor--100);
14821
+ --pf-c-label--m-editable__content--hover--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14822
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-global--BorderColor--100);
14823
+ --pf-c-label--m-editable__content--focus--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14824
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-global--BorderColor--100);
14819
14825
  --pf-c-label--m-editable--m-editable-active--Cursor: auto;
14820
14826
  --pf-c-label--m-editable--m-editable-active--TextDecoration: none;
14821
14827
  --pf-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
@@ -14849,6 +14855,9 @@ label.pf-c-input-group__text {
14849
14855
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--before--BorderColor);
14850
14856
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--link--hover--before--BorderColor);
14851
14857
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--link--focus--before--BorderColor);
14858
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14859
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14860
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14852
14861
  }
14853
14862
  .pf-c-label.pf-m-green {
14854
14863
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-green--BackgroundColor);
@@ -14861,6 +14870,9 @@ label.pf-c-input-group__text {
14861
14870
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--before--BorderColor);
14862
14871
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor);
14863
14872
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor);
14873
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14874
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14875
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14864
14876
  }
14865
14877
  .pf-c-label.pf-m-orange {
14866
14878
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-orange--BackgroundColor);
@@ -14873,6 +14885,9 @@ label.pf-c-input-group__text {
14873
14885
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--before--BorderColor);
14874
14886
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--link--hover--before--BorderColor);
14875
14887
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--link--focus--before--BorderColor);
14888
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14889
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14890
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14876
14891
  }
14877
14892
  .pf-c-label.pf-m-red {
14878
14893
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-red--BackgroundColor);
@@ -14885,6 +14900,9 @@ label.pf-c-input-group__text {
14885
14900
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--before--BorderColor);
14886
14901
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--link--hover--before--BorderColor);
14887
14902
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--link--focus--before--BorderColor);
14903
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14904
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14905
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14888
14906
  }
14889
14907
  .pf-c-label.pf-m-purple {
14890
14908
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-purple--BackgroundColor);
@@ -14897,6 +14915,9 @@ label.pf-c-input-group__text {
14897
14915
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--before--BorderColor);
14898
14916
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--link--hover--before--BorderColor);
14899
14917
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--link--focus--before--BorderColor);
14918
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14919
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14920
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14900
14921
  }
14901
14922
  .pf-c-label.pf-m-cyan {
14902
14923
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-cyan--BackgroundColor);
@@ -14909,12 +14930,18 @@ label.pf-c-input-group__text {
14909
14930
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--before--BorderColor);
14910
14931
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor);
14911
14932
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor);
14933
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14934
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14935
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14912
14936
  }
14913
14937
  .pf-c-label.pf-m-outline {
14914
14938
  --pf-c-label__content--Color: var(--pf-c-label--m-outline__content--Color);
14915
14939
  --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-outline__content--before--BorderWidth);
14916
14940
  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14917
14941
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-outline--BackgroundColor);
14942
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14943
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14944
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14918
14945
  }
14919
14946
  .pf-c-label.pf-m-overflow:hover, .pf-c-label.pf-m-outline a.pf-c-label__content:hover,
14920
14947
  .pf-c-label.pf-m-outline button.pf-c-label__content:hover {
@@ -14934,6 +14961,15 @@ label.pf-c-input-group__text {
14934
14961
  text-decoration-thickness: var(--pf-c-label--m-editable--TextDecorationThickness);
14935
14962
  text-underline-offset: var(--pf-c-label--m-editable--TextDecorationOffset);
14936
14963
  text-decoration-color: var(--pf-c-label--m-editable--TextDecorationColor);
14964
+ --pf-c-label__content--MaxWidth: var(--pf-c-label--m-editable__content--MaxWidth);
14965
+ --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14966
+ --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable__content--before--BorderColor);
14967
+ --pf-c-label__content--link--hover--before--BorderWidth: var(--pf-c-label--m-editable__content--hover--before--BorderWidth);
14968
+ --pf-c-label__content--link--hover--before--BorderColor: var(--pf-c-label--m-editable__content--hover--before--BorderColor);
14969
+ --pf-c-label__content--link--focus--before--BorderWidth: var(--pf-c-label--m-editable__content--focus--before--BorderWidth);
14970
+ --pf-c-label__content--link--focus--before--BorderColor: var(--pf-c-label--m-editable__content--focus--before--BorderColor);
14971
+ --pf-c-label--m-outline__content--link--hover--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14972
+ --pf-c-label--m-outline__content--link--focus--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14937
14973
  }
14938
14974
  .pf-c-label.pf-m-editable:hover {
14939
14975
  --pf-c-label--m-editable--TextDecorationColor: var(--pf-c-label--m-editable--hover--TextDecorationColor);
@@ -14945,19 +14981,10 @@ label.pf-c-input-group__text {
14945
14981
  --pf-c-label--m-editable--Cursor: var(--pf-c-label--m-editable--m-editable-active--Cursor);
14946
14982
  --pf-c-label--m-editable--TextDecoration: var(--pf-c-label--m-editable--m-editable-active--TextDecoration);
14947
14983
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-editable--m-editable-active--BackgroundColor);
14948
- --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderWidth);
14949
- --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderColor);
14950
14984
  }
14951
14985
  .pf-c-label.pf-m-editable-active .pf-c-button {
14952
14986
  visibility: hidden;
14953
14987
  }
14954
- .pf-c-label .pf-c-label__editable-text {
14955
- overflow: hidden;
14956
- text-overflow: ellipsis;
14957
- white-space: nowrap;
14958
- max-width: var(--pf-c-label__editable-text--MaxWidth);
14959
- border-width: var(--pf-c-label__editable-text--BorderWidth);
14960
- }
14961
14988
  .pf-c-label .pf-c-button {
14962
14989
  --pf-c-button--FontSize: var(--pf-c-label__c-button--FontSize);
14963
14990
  --pf-c-button--PaddingTop: var(--pf-c-label__c-button--PaddingTop);
@@ -14994,8 +15021,12 @@ label.pf-c-input-group__text {
14994
15021
  }
14995
15022
 
14996
15023
  .pf-c-label__content {
15024
+ overflow: hidden;
15025
+ text-overflow: ellipsis;
15026
+ white-space: nowrap;
15027
+ max-width: var(--pf-c-label__content--MaxWidth);
14997
15028
  color: var(--pf-c-label__content--Color);
14998
- border: 0;
15029
+ border-width: 0;
14999
15030
  }
15000
15031
  .pf-c-label__content::before {
15001
15032
  position: absolute;