@patternfly/react-core 4.233.1 → 4.234.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.
Files changed (66) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/esm/components/MenuToggle/MenuToggle.js +1 -1
  3. package/dist/esm/components/MenuToggle/MenuToggle.js.map +1 -1
  4. package/dist/esm/components/Timestamp/Timestamp.d.ts +72 -0
  5. package/dist/esm/components/Timestamp/Timestamp.d.ts.map +1 -0
  6. package/dist/esm/components/Timestamp/Timestamp.js +33 -0
  7. package/dist/esm/components/Timestamp/Timestamp.js.map +1 -0
  8. package/dist/esm/components/Timestamp/index.d.ts +2 -0
  9. package/dist/esm/components/Timestamp/index.d.ts.map +1 -0
  10. package/dist/esm/components/Timestamp/index.js +2 -0
  11. package/dist/esm/components/Timestamp/index.js.map +1 -0
  12. package/dist/esm/components/index.d.ts +1 -0
  13. package/dist/esm/components/index.d.ts.map +1 -1
  14. package/dist/esm/components/index.js +1 -0
  15. package/dist/esm/components/index.js.map +1 -1
  16. package/dist/js/components/MenuToggle/MenuToggle.js +1 -1
  17. package/dist/js/components/MenuToggle/MenuToggle.js.map +1 -1
  18. package/dist/js/components/Timestamp/Timestamp.d.ts +72 -0
  19. package/dist/js/components/Timestamp/Timestamp.d.ts.map +1 -0
  20. package/dist/js/components/Timestamp/Timestamp.js +37 -0
  21. package/dist/js/components/Timestamp/Timestamp.js.map +1 -0
  22. package/dist/js/components/Timestamp/index.d.ts +2 -0
  23. package/dist/js/components/Timestamp/index.d.ts.map +1 -0
  24. package/dist/js/components/Timestamp/index.js +5 -0
  25. package/dist/js/components/Timestamp/index.js.map +1 -0
  26. package/dist/js/components/index.d.ts +1 -0
  27. package/dist/js/components/index.d.ts.map +1 -1
  28. package/dist/js/components/index.js +1 -0
  29. package/dist/js/components/index.js.map +1 -1
  30. package/dist/umd/react-core.css +22392 -22354
  31. package/dist/umd/react-core.js +798 -757
  32. package/dist/umd/react-core.min.css +372 -334
  33. package/dist/umd/react-core.min.js +4 -4
  34. package/package.json +5 -5
  35. package/src/components/Button/examples/Button.md +55 -24
  36. package/src/components/ContextSelector/examples/ContextSelectorBasic.tsx +4 -4
  37. package/src/components/ContextSelector/examples/ContextSelectorPlainText.tsx +3 -3
  38. package/src/components/ContextSelector/examples/ContextSelectorWithFooter.tsx +4 -4
  39. package/src/components/DualListSelector/examples/DualListSelectorComposable.tsx +8 -2
  40. package/src/components/DualListSelector/examples/DualListSelectorComposableDragDrop.tsx +3 -9
  41. package/src/components/DualListSelector/examples/DualListSelectorComposableTree.tsx +3 -3
  42. package/src/components/DualListSelector/examples/DualListSelectorTreeExample.tsx +8 -5
  43. package/src/components/MenuToggle/MenuToggle.tsx +2 -2
  44. package/src/components/Timestamp/Timestamp.tsx +134 -0
  45. package/src/components/Timestamp/__tests__/Timestamp.test.tsx +177 -0
  46. package/src/components/Timestamp/__tests__/__snapshots__/Timestamp.test.tsx.snap +17 -0
  47. package/src/components/Timestamp/examples/Timestamp.md +57 -0
  48. package/src/components/Timestamp/examples/TimestampBasicFormats.tsx +26 -0
  49. package/src/components/Timestamp/examples/TimestampCustomContent.tsx +20 -0
  50. package/src/components/Timestamp/examples/TimestampCustomFormat.tsx +6 -0
  51. package/src/components/Timestamp/examples/TimestampCustomTooltip.tsx +19 -0
  52. package/src/components/Timestamp/examples/TimestampDefault.tsx +4 -0
  53. package/src/components/Timestamp/examples/TimestampDefaultTooltip.tsx +18 -0
  54. package/src/components/Timestamp/index.ts +1 -0
  55. package/src/components/index.ts +1 -0
  56. package/src/demos/Button.md +5 -1
  57. package/src/demos/ComposableMenu/examples/ComposableActionsMenu.tsx +12 -8
  58. package/src/demos/ComposableMenu/examples/ComposableApplicationLauncher.tsx +12 -11
  59. package/src/demos/ComposableMenu/examples/ComposableContextSelector.tsx +10 -12
  60. package/src/demos/ComposableMenu/examples/ComposableDrilldownMenu.tsx +7 -7
  61. package/src/demos/ComposableMenu/examples/ComposableFlyout.tsx +8 -8
  62. package/src/demos/ComposableMenu/examples/ComposableSimpleCheckboxSelect.tsx +11 -8
  63. package/src/demos/ComposableMenu/examples/ComposableSimpleDropdown.tsx +7 -7
  64. package/src/demos/ComposableMenu/examples/ComposableSimpleSelect.tsx +17 -8
  65. package/src/demos/ComposableMenu/examples/ComposableTreeViewMenu.tsx +11 -10
  66. package/src/demos/ComposableMenu/examples/ComposableTypeaheadSelect.tsx +2 -2
@@ -16804,6 +16804,212 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16804
16804
  --pf-c-pagination--m-sticky--BackgroundColor: var(--pf-global--BackgroundColor--300);
16805
16805
  }
16806
16806
 
16807
+ .pf-c-popover {
16808
+ --pf-c-popover--FontSize: var(--pf-global--FontSize--sm);
16809
+ --pf-c-popover--MinWidth: calc(var(--pf-c-popover__content--PaddingLeft) + var(--pf-c-popover__content--PaddingRight) + 18.75rem);
16810
+ --pf-c-popover--MaxWidth: calc(var(--pf-c-popover__content--PaddingLeft) + var(--pf-c-popover__content--PaddingRight) + 18.75rem);
16811
+ --pf-c-popover--BoxShadow: var(--pf-global--BoxShadow--lg);
16812
+ --pf-c-popover--m-danger__title-icon--Color: var(--pf-global--danger-color--100);
16813
+ --pf-c-popover--m-warning__title-icon--Color: var(--pf-global--warning-color--100);
16814
+ --pf-c-popover--m-success__title-icon--Color: var(--pf-global--success-color--100);
16815
+ --pf-c-popover--m-info__title-icon--Color: var(--pf-global--info-color--100);
16816
+ --pf-c-popover--m-default__title-icon--Color: var(--pf-global--default-color--200);
16817
+ --pf-c-popover--m-danger__title-text--Color: var(--pf-global--danger-color--200);
16818
+ --pf-c-popover--m-warning__title-text--Color: var(--pf-global--warning-color--200);
16819
+ --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--200);
16820
+ --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--200);
16821
+ --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--300);
16822
+ --pf-c-popover__content--BackgroundColor: var(--pf-global--BackgroundColor--100);
16823
+ --pf-c-popover__content--PaddingTop: var(--pf-global--spacer--md);
16824
+ --pf-c-popover__content--PaddingRight: var(--pf-global--spacer--md);
16825
+ --pf-c-popover__content--PaddingBottom: var(--pf-global--spacer--md);
16826
+ --pf-c-popover__content--PaddingLeft: var(--pf-global--spacer--md);
16827
+ --pf-c-popover__arrow--Width: var(--pf-global--arrow--width-lg);
16828
+ --pf-c-popover__arrow--Height: var(--pf-global--arrow--width-lg);
16829
+ --pf-c-popover__arrow--BoxShadow: var(--pf-global--BoxShadow--lg);
16830
+ --pf-c-popover__arrow--BackgroundColor: var(--pf-global--BackgroundColor--100);
16831
+ --pf-c-popover__arrow--m-top--TranslateX: -50%;
16832
+ --pf-c-popover__arrow--m-top--TranslateY: 50%;
16833
+ --pf-c-popover__arrow--m-top--Rotate: 45deg;
16834
+ --pf-c-popover__arrow--m-right--TranslateX: -50%;
16835
+ --pf-c-popover__arrow--m-right--TranslateY: -50%;
16836
+ --pf-c-popover__arrow--m-right--Rotate: 45deg;
16837
+ --pf-c-popover__arrow--m-bottom--TranslateX: -50%;
16838
+ --pf-c-popover__arrow--m-bottom--TranslateY: -50%;
16839
+ --pf-c-popover__arrow--m-bottom--Rotate: 45deg;
16840
+ --pf-c-popover__arrow--m-left--TranslateX: 50%;
16841
+ --pf-c-popover__arrow--m-left--TranslateY: -50%;
16842
+ --pf-c-popover__arrow--m-left--Rotate: 45deg;
16843
+ --pf-c-popover--c-button--MarginLeft: var(--pf-global--spacer--sm);
16844
+ --pf-c-popover--c-button--Top: calc(var(--pf-c-popover__content--PaddingTop) - var(--pf-global--spacer--form-element));
16845
+ --pf-c-popover--c-button--Right: calc(var(--pf-c-popover__content--PaddingRight) - var(--pf-global--spacer--md));
16846
+ --pf-c-popover--c-button--sibling--PaddingRight: var(--pf-global--spacer--2xl);
16847
+ --pf-c-popover--c-title--MarginBottom: var(--pf-global--spacer--sm);
16848
+ --pf-c-popover__title--MarginBottom: var(--pf-global--spacer--sm);
16849
+ --pf-c-popover__title--LineHeight: var(--pf-global--LineHeight--md);
16850
+ --pf-c-popover__title--FontFamily: var(--pf-global--FontFamily--heading--sans-serif);
16851
+ --pf-c-popover__title--FontSize: var(--pf-global--FontSize--md);
16852
+ --pf-c-popover__title-icon--MarginRight: var(--pf-global--spacer--sm);
16853
+ --pf-c-popover__title-icon--Color: var(--pf-global--Color--100);
16854
+ --pf-c-popover__footer--MarginTop: var(--pf-global--spacer--md);
16855
+ position: relative;
16856
+ min-width: var(--pf-c-popover--MinWidth);
16857
+ max-width: var(--pf-c-popover--MaxWidth);
16858
+ font-size: var(--pf-c-popover--FontSize);
16859
+ box-shadow: var(--pf-c-popover--BoxShadow);
16860
+ }
16861
+
16862
+ .pf-c-popover.pf-m-no-padding {
16863
+ --pf-c-popover__content--PaddingTop: 0px;
16864
+ --pf-c-popover__content--PaddingRight: 0px;
16865
+ --pf-c-popover__content--PaddingBottom: 0px;
16866
+ --pf-c-popover__content--PaddingLeft: 0px;
16867
+ }
16868
+
16869
+ .pf-c-popover.pf-m-width-auto {
16870
+ --pf-c-popover--MinWidth: auto;
16871
+ --pf-c-popover--MaxWidth: none;
16872
+ }
16873
+
16874
+ .pf-c-popover.pf-m-top .pf-c-popover__arrow, .pf-c-popover.pf-m-top-left .pf-c-popover__arrow, .pf-c-popover.pf-m-top-right .pf-c-popover__arrow {
16875
+ bottom: 0;
16876
+ left: 50%;
16877
+ transform: translateX(var(--pf-c-popover__arrow--m-top--TranslateX)) translateY(var(--pf-c-popover__arrow--m-top--TranslateY)) rotate(var(--pf-c-popover__arrow--m-top--Rotate));
16878
+ }
16879
+
16880
+ .pf-c-popover.pf-m-bottom .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-left .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-right .pf-c-popover__arrow {
16881
+ top: 0;
16882
+ left: 50%;
16883
+ transform: translateX(var(--pf-c-popover__arrow--m-bottom--TranslateX)) translateY(var(--pf-c-popover__arrow--m-bottom--TranslateY)) rotate(var(--pf-c-popover__arrow--m-bottom--Rotate));
16884
+ }
16885
+
16886
+ .pf-c-popover.pf-m-left .pf-c-popover__arrow, .pf-c-popover.pf-m-left-top .pf-c-popover__arrow, .pf-c-popover.pf-m-left-bottom .pf-c-popover__arrow {
16887
+ top: 50%;
16888
+ right: 0;
16889
+ transform: translateX(var(--pf-c-popover__arrow--m-left--TranslateX)) translateY(var(--pf-c-popover__arrow--m-left--TranslateY)) rotate(var(--pf-c-popover__arrow--m-left--Rotate));
16890
+ }
16891
+
16892
+ .pf-c-popover.pf-m-right .pf-c-popover__arrow, .pf-c-popover.pf-m-right-top .pf-c-popover__arrow, .pf-c-popover.pf-m-right-bottom .pf-c-popover__arrow {
16893
+ top: 50%;
16894
+ left: 0;
16895
+ transform: translateX(var(--pf-c-popover__arrow--m-right--TranslateX)) translateY(var(--pf-c-popover__arrow--m-right--TranslateY)) rotate(var(--pf-c-popover__arrow--m-right--Rotate));
16896
+ }
16897
+
16898
+ .pf-c-popover.pf-m-left-top .pf-c-popover__arrow, .pf-c-popover.pf-m-right-top .pf-c-popover__arrow {
16899
+ top: var(--pf-c-popover__arrow--Height);
16900
+ }
16901
+
16902
+ .pf-c-popover.pf-m-left-bottom .pf-c-popover__arrow, .pf-c-popover.pf-m-right-bottom .pf-c-popover__arrow {
16903
+ top: auto;
16904
+ bottom: 0;
16905
+ }
16906
+
16907
+ .pf-c-popover.pf-m-top-left .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-left .pf-c-popover__arrow {
16908
+ left: var(--pf-c-popover__arrow--Width);
16909
+ }
16910
+
16911
+ .pf-c-popover.pf-m-top-right .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-right .pf-c-popover__arrow {
16912
+ right: 0;
16913
+ left: auto;
16914
+ }
16915
+
16916
+ .pf-c-popover.pf-m-danger {
16917
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-danger__title-icon--Color);
16918
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-danger__title-text--Color);
16919
+ }
16920
+
16921
+ .pf-c-popover.pf-m-warning {
16922
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-warning__title-icon--Color);
16923
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-warning__title-text--Color);
16924
+ }
16925
+
16926
+ .pf-c-popover.pf-m-success {
16927
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-success__title-icon--Color);
16928
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-success__title-text--Color);
16929
+ }
16930
+
16931
+ .pf-c-popover.pf-m-default {
16932
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-default__title-icon--Color);
16933
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-default__title-text--Color);
16934
+ }
16935
+
16936
+ .pf-c-popover.pf-m-info {
16937
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-info__title-icon--Color);
16938
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-info__title-text--Color);
16939
+ }
16940
+
16941
+ .pf-c-popover__content {
16942
+ position: relative;
16943
+ padding: var(--pf-c-popover__content--PaddingTop) var(--pf-c-popover__content--PaddingRight) var(--pf-c-popover__content--PaddingBottom) var(--pf-c-popover__content--PaddingLeft);
16944
+ background-color: var(--pf-c-popover__content--BackgroundColor);
16945
+ }
16946
+
16947
+ .pf-c-popover__content > .pf-c-title {
16948
+ margin-bottom: var(--pf-c-popover--c-title--MarginBottom);
16949
+ }
16950
+
16951
+ .pf-c-popover__content > .pf-c-button {
16952
+ position: absolute;
16953
+ top: var(--pf-c-popover--c-button--Top);
16954
+ right: var(--pf-c-popover--c-button--Right);
16955
+ }
16956
+
16957
+ .pf-c-popover__content > .pf-c-button + * {
16958
+ padding-right: var(--pf-c-popover--c-button--sibling--PaddingRight);
16959
+ }
16960
+
16961
+ .pf-c-popover__arrow {
16962
+ position: absolute;
16963
+ width: var(--pf-c-popover__arrow--Width);
16964
+ height: var(--pf-c-popover__arrow--Height);
16965
+ pointer-events: none;
16966
+ background-color: var(--pf-c-popover__arrow--BackgroundColor);
16967
+ box-shadow: var(--pf-c-popover__arrow--BoxShadow);
16968
+ }
16969
+
16970
+ .pf-c-popover__title {
16971
+ flex: 0 0 auto;
16972
+ margin-bottom: var(--pf-c-popover__title--MarginBottom);
16973
+ font-family: var(--pf-c-popover__title--FontFamily);
16974
+ font-size: var(--pf-c-popover__title--FontSize);
16975
+ line-height: var(--pf-c-popover__title--LineHeight);
16976
+ }
16977
+
16978
+ .pf-c-popover__title.pf-m-icon {
16979
+ display: flex;
16980
+ }
16981
+
16982
+ .pf-c-popover__title-icon {
16983
+ margin-right: var(--pf-c-popover__title-icon--MarginRight);
16984
+ color: var(--pf-c-popover__title-icon--Color);
16985
+ }
16986
+
16987
+ .pf-c-popover__title-text {
16988
+ color: var(--pf-c-popover__title-text--Color, inherit);
16989
+ }
16990
+
16991
+ .pf-c-popover__body {
16992
+ word-wrap: break-word;
16993
+ }
16994
+
16995
+ .pf-c-popover__footer {
16996
+ margin-top: var(--pf-c-popover__footer--MarginTop);
16997
+ }
16998
+
16999
+ :where(.pf-theme-dark) .pf-c-popover {
17000
+ --pf-c-popover--BoxShadow: none;
17001
+ --pf-c-popover__arrow--BoxShadow: none;
17002
+ --pf-c-popover__arrow--BackgroundColor: var(--pf-c-popover__content--BackgroundColor);
17003
+ --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--200);
17004
+ --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--100);
17005
+ --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--100);
17006
+ }
17007
+
17008
+ :where(.pf-theme-dark) .pf-c-popover,
17009
+ :where(.pf-theme-dark) .pf-c-popover .pf-c-popover__arrow {
17010
+ border: 4px solid var(--pf-global--BorderColor--400);
17011
+ }
17012
+
16807
17013
  .pf-c-progress {
16808
17014
  --pf-c-progress--GridGap: var(--pf-global--spacer--md);
16809
17015
  --pf-c-progress__bar--before--BackgroundColor: var(--pf-global--primary-color--100);
@@ -17673,227 +17879,21 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17673
17879
  color: var(--pf-c-radio__description--Color);
17674
17880
  }
17675
17881
 
17676
- .pf-c-radio__body {
17677
- grid-column: 2;
17678
- margin-top: var(--pf-c-radio__body--MarginTop);
17679
- }
17680
-
17681
- label.pf-c-radio, .pf-c-radio__label,
17682
- .pf-c-radio__input {
17683
- cursor: pointer;
17684
- }
17685
-
17686
- .pf-c-radio__label:disabled, .pf-c-radio__label.pf-m-disabled,
17687
- .pf-c-radio__input:disabled,
17688
- .pf-c-radio__input.pf-m-disabled {
17689
- --pf-c-radio__label--Color: var(--pf-c-radio__label--disabled--Color);
17690
- cursor: not-allowed;
17691
- }
17692
-
17693
- .pf-c-popover {
17694
- --pf-c-popover--FontSize: var(--pf-global--FontSize--sm);
17695
- --pf-c-popover--MinWidth: calc(var(--pf-c-popover__content--PaddingLeft) + var(--pf-c-popover__content--PaddingRight) + 18.75rem);
17696
- --pf-c-popover--MaxWidth: calc(var(--pf-c-popover__content--PaddingLeft) + var(--pf-c-popover__content--PaddingRight) + 18.75rem);
17697
- --pf-c-popover--BoxShadow: var(--pf-global--BoxShadow--lg);
17698
- --pf-c-popover--m-danger__title-icon--Color: var(--pf-global--danger-color--100);
17699
- --pf-c-popover--m-warning__title-icon--Color: var(--pf-global--warning-color--100);
17700
- --pf-c-popover--m-success__title-icon--Color: var(--pf-global--success-color--100);
17701
- --pf-c-popover--m-info__title-icon--Color: var(--pf-global--info-color--100);
17702
- --pf-c-popover--m-default__title-icon--Color: var(--pf-global--default-color--200);
17703
- --pf-c-popover--m-danger__title-text--Color: var(--pf-global--danger-color--200);
17704
- --pf-c-popover--m-warning__title-text--Color: var(--pf-global--warning-color--200);
17705
- --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--200);
17706
- --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--200);
17707
- --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--300);
17708
- --pf-c-popover__content--BackgroundColor: var(--pf-global--BackgroundColor--100);
17709
- --pf-c-popover__content--PaddingTop: var(--pf-global--spacer--md);
17710
- --pf-c-popover__content--PaddingRight: var(--pf-global--spacer--md);
17711
- --pf-c-popover__content--PaddingBottom: var(--pf-global--spacer--md);
17712
- --pf-c-popover__content--PaddingLeft: var(--pf-global--spacer--md);
17713
- --pf-c-popover__arrow--Width: var(--pf-global--arrow--width-lg);
17714
- --pf-c-popover__arrow--Height: var(--pf-global--arrow--width-lg);
17715
- --pf-c-popover__arrow--BoxShadow: var(--pf-global--BoxShadow--lg);
17716
- --pf-c-popover__arrow--BackgroundColor: var(--pf-global--BackgroundColor--100);
17717
- --pf-c-popover__arrow--m-top--TranslateX: -50%;
17718
- --pf-c-popover__arrow--m-top--TranslateY: 50%;
17719
- --pf-c-popover__arrow--m-top--Rotate: 45deg;
17720
- --pf-c-popover__arrow--m-right--TranslateX: -50%;
17721
- --pf-c-popover__arrow--m-right--TranslateY: -50%;
17722
- --pf-c-popover__arrow--m-right--Rotate: 45deg;
17723
- --pf-c-popover__arrow--m-bottom--TranslateX: -50%;
17724
- --pf-c-popover__arrow--m-bottom--TranslateY: -50%;
17725
- --pf-c-popover__arrow--m-bottom--Rotate: 45deg;
17726
- --pf-c-popover__arrow--m-left--TranslateX: 50%;
17727
- --pf-c-popover__arrow--m-left--TranslateY: -50%;
17728
- --pf-c-popover__arrow--m-left--Rotate: 45deg;
17729
- --pf-c-popover--c-button--MarginLeft: var(--pf-global--spacer--sm);
17730
- --pf-c-popover--c-button--Top: calc(var(--pf-c-popover__content--PaddingTop) - var(--pf-global--spacer--form-element));
17731
- --pf-c-popover--c-button--Right: calc(var(--pf-c-popover__content--PaddingRight) - var(--pf-global--spacer--md));
17732
- --pf-c-popover--c-button--sibling--PaddingRight: var(--pf-global--spacer--2xl);
17733
- --pf-c-popover--c-title--MarginBottom: var(--pf-global--spacer--sm);
17734
- --pf-c-popover__title--MarginBottom: var(--pf-global--spacer--sm);
17735
- --pf-c-popover__title--LineHeight: var(--pf-global--LineHeight--md);
17736
- --pf-c-popover__title--FontFamily: var(--pf-global--FontFamily--heading--sans-serif);
17737
- --pf-c-popover__title--FontSize: var(--pf-global--FontSize--md);
17738
- --pf-c-popover__title-icon--MarginRight: var(--pf-global--spacer--sm);
17739
- --pf-c-popover__title-icon--Color: var(--pf-global--Color--100);
17740
- --pf-c-popover__footer--MarginTop: var(--pf-global--spacer--md);
17741
- position: relative;
17742
- min-width: var(--pf-c-popover--MinWidth);
17743
- max-width: var(--pf-c-popover--MaxWidth);
17744
- font-size: var(--pf-c-popover--FontSize);
17745
- box-shadow: var(--pf-c-popover--BoxShadow);
17746
- }
17747
-
17748
- .pf-c-popover.pf-m-no-padding {
17749
- --pf-c-popover__content--PaddingTop: 0px;
17750
- --pf-c-popover__content--PaddingRight: 0px;
17751
- --pf-c-popover__content--PaddingBottom: 0px;
17752
- --pf-c-popover__content--PaddingLeft: 0px;
17753
- }
17754
-
17755
- .pf-c-popover.pf-m-width-auto {
17756
- --pf-c-popover--MinWidth: auto;
17757
- --pf-c-popover--MaxWidth: none;
17758
- }
17759
-
17760
- .pf-c-popover.pf-m-top .pf-c-popover__arrow, .pf-c-popover.pf-m-top-left .pf-c-popover__arrow, .pf-c-popover.pf-m-top-right .pf-c-popover__arrow {
17761
- bottom: 0;
17762
- left: 50%;
17763
- transform: translateX(var(--pf-c-popover__arrow--m-top--TranslateX)) translateY(var(--pf-c-popover__arrow--m-top--TranslateY)) rotate(var(--pf-c-popover__arrow--m-top--Rotate));
17764
- }
17765
-
17766
- .pf-c-popover.pf-m-bottom .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-left .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-right .pf-c-popover__arrow {
17767
- top: 0;
17768
- left: 50%;
17769
- transform: translateX(var(--pf-c-popover__arrow--m-bottom--TranslateX)) translateY(var(--pf-c-popover__arrow--m-bottom--TranslateY)) rotate(var(--pf-c-popover__arrow--m-bottom--Rotate));
17770
- }
17771
-
17772
- .pf-c-popover.pf-m-left .pf-c-popover__arrow, .pf-c-popover.pf-m-left-top .pf-c-popover__arrow, .pf-c-popover.pf-m-left-bottom .pf-c-popover__arrow {
17773
- top: 50%;
17774
- right: 0;
17775
- transform: translateX(var(--pf-c-popover__arrow--m-left--TranslateX)) translateY(var(--pf-c-popover__arrow--m-left--TranslateY)) rotate(var(--pf-c-popover__arrow--m-left--Rotate));
17776
- }
17777
-
17778
- .pf-c-popover.pf-m-right .pf-c-popover__arrow, .pf-c-popover.pf-m-right-top .pf-c-popover__arrow, .pf-c-popover.pf-m-right-bottom .pf-c-popover__arrow {
17779
- top: 50%;
17780
- left: 0;
17781
- transform: translateX(var(--pf-c-popover__arrow--m-right--TranslateX)) translateY(var(--pf-c-popover__arrow--m-right--TranslateY)) rotate(var(--pf-c-popover__arrow--m-right--Rotate));
17782
- }
17783
-
17784
- .pf-c-popover.pf-m-left-top .pf-c-popover__arrow, .pf-c-popover.pf-m-right-top .pf-c-popover__arrow {
17785
- top: var(--pf-c-popover__arrow--Height);
17786
- }
17787
-
17788
- .pf-c-popover.pf-m-left-bottom .pf-c-popover__arrow, .pf-c-popover.pf-m-right-bottom .pf-c-popover__arrow {
17789
- top: auto;
17790
- bottom: 0;
17791
- }
17792
-
17793
- .pf-c-popover.pf-m-top-left .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-left .pf-c-popover__arrow {
17794
- left: var(--pf-c-popover__arrow--Width);
17795
- }
17796
-
17797
- .pf-c-popover.pf-m-top-right .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-right .pf-c-popover__arrow {
17798
- right: 0;
17799
- left: auto;
17800
- }
17801
-
17802
- .pf-c-popover.pf-m-danger {
17803
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-danger__title-icon--Color);
17804
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-danger__title-text--Color);
17805
- }
17806
-
17807
- .pf-c-popover.pf-m-warning {
17808
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-warning__title-icon--Color);
17809
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-warning__title-text--Color);
17810
- }
17811
-
17812
- .pf-c-popover.pf-m-success {
17813
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-success__title-icon--Color);
17814
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-success__title-text--Color);
17815
- }
17816
-
17817
- .pf-c-popover.pf-m-default {
17818
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-default__title-icon--Color);
17819
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-default__title-text--Color);
17820
- }
17821
-
17822
- .pf-c-popover.pf-m-info {
17823
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-info__title-icon--Color);
17824
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-info__title-text--Color);
17825
- }
17826
-
17827
- .pf-c-popover__content {
17828
- position: relative;
17829
- padding: var(--pf-c-popover__content--PaddingTop) var(--pf-c-popover__content--PaddingRight) var(--pf-c-popover__content--PaddingBottom) var(--pf-c-popover__content--PaddingLeft);
17830
- background-color: var(--pf-c-popover__content--BackgroundColor);
17831
- }
17832
-
17833
- .pf-c-popover__content > .pf-c-title {
17834
- margin-bottom: var(--pf-c-popover--c-title--MarginBottom);
17835
- }
17836
-
17837
- .pf-c-popover__content > .pf-c-button {
17838
- position: absolute;
17839
- top: var(--pf-c-popover--c-button--Top);
17840
- right: var(--pf-c-popover--c-button--Right);
17841
- }
17842
-
17843
- .pf-c-popover__content > .pf-c-button + * {
17844
- padding-right: var(--pf-c-popover--c-button--sibling--PaddingRight);
17845
- }
17846
-
17847
- .pf-c-popover__arrow {
17848
- position: absolute;
17849
- width: var(--pf-c-popover__arrow--Width);
17850
- height: var(--pf-c-popover__arrow--Height);
17851
- pointer-events: none;
17852
- background-color: var(--pf-c-popover__arrow--BackgroundColor);
17853
- box-shadow: var(--pf-c-popover__arrow--BoxShadow);
17854
- }
17855
-
17856
- .pf-c-popover__title {
17857
- flex: 0 0 auto;
17858
- margin-bottom: var(--pf-c-popover__title--MarginBottom);
17859
- font-family: var(--pf-c-popover__title--FontFamily);
17860
- font-size: var(--pf-c-popover__title--FontSize);
17861
- line-height: var(--pf-c-popover__title--LineHeight);
17862
- }
17863
-
17864
- .pf-c-popover__title.pf-m-icon {
17865
- display: flex;
17866
- }
17867
-
17868
- .pf-c-popover__title-icon {
17869
- margin-right: var(--pf-c-popover__title-icon--MarginRight);
17870
- color: var(--pf-c-popover__title-icon--Color);
17871
- }
17872
-
17873
- .pf-c-popover__title-text {
17874
- color: var(--pf-c-popover__title-text--Color, inherit);
17875
- }
17876
-
17877
- .pf-c-popover__body {
17878
- word-wrap: break-word;
17879
- }
17880
-
17881
- .pf-c-popover__footer {
17882
- margin-top: var(--pf-c-popover__footer--MarginTop);
17883
- }
17884
-
17885
- :where(.pf-theme-dark) .pf-c-popover {
17886
- --pf-c-popover--BoxShadow: none;
17887
- --pf-c-popover__arrow--BoxShadow: none;
17888
- --pf-c-popover__arrow--BackgroundColor: var(--pf-c-popover__content--BackgroundColor);
17889
- --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--200);
17890
- --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--100);
17891
- --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--100);
17882
+ .pf-c-radio__body {
17883
+ grid-column: 2;
17884
+ margin-top: var(--pf-c-radio__body--MarginTop);
17892
17885
  }
17893
17886
 
17894
- :where(.pf-theme-dark) .pf-c-popover,
17895
- :where(.pf-theme-dark) .pf-c-popover .pf-c-popover__arrow {
17896
- border: 4px solid var(--pf-global--BorderColor--400);
17887
+ label.pf-c-radio, .pf-c-radio__label,
17888
+ .pf-c-radio__input {
17889
+ cursor: pointer;
17890
+ }
17891
+
17892
+ .pf-c-radio__label:disabled, .pf-c-radio__label.pf-m-disabled,
17893
+ .pf-c-radio__input:disabled,
17894
+ .pf-c-radio__input.pf-m-disabled {
17895
+ --pf-c-radio__label--Color: var(--pf-c-radio__label--disabled--Color);
17896
+ cursor: not-allowed;
17897
17897
  }
17898
17898
 
17899
17899
  .pf-c-select {
@@ -20894,6 +20894,44 @@ svg.pf-c-spinner.pf-m-xl {
20894
20894
  --pf-c-tile--m-disabled__body--Color: var(--pf-global--disabled-color--300);
20895
20895
  }
20896
20896
 
20897
+ .pf-c-timestamp {
20898
+ --pf-c-timestamp--FontSize: var(--pf-global--FontSize--sm);
20899
+ --pf-c-timestamp--Color: var(--pf-global--Color--200);
20900
+ --pf-c-timestamp--OutlineOffset: 0.1875rem;
20901
+ --pf-c-timestamp--m-help-text--TextDecorationLine: underline;
20902
+ --pf-c-timestamp--m-help-text--TextDecorationStyle: dashed;
20903
+ --pf-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
20904
+ --pf-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
20905
+ --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-global--BorderColor--200);
20906
+ --pf-c-timestamp--m-help-text--hover--Color: var(--pf-global--Color--100);
20907
+ --pf-c-timestamp--m-help-text--focus--Color: var(--pf-global--Color--100);
20908
+ --pf-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
20909
+ --pf-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
20910
+ display: inline-block;
20911
+ font-size: var(--pf-c-timestamp--FontSize);
20912
+ color: var(--pf-c-timestamp--Color);
20913
+ outline-offset: var(--pf-c-timestamp--OutlineOffset);
20914
+ }
20915
+
20916
+ .pf-c-timestamp.pf-m-help-text {
20917
+ cursor: pointer;
20918
+ text-decoration-line: var(--pf-c-timestamp--m-help-text--TextDecorationLine);
20919
+ text-decoration-style: var(--pf-c-timestamp--m-help-text--TextDecorationStyle);
20920
+ text-decoration-thickness: var(--pf-c-timestamp--m-help-text--TextDecorationThickness);
20921
+ text-underline-offset: var(--pf-c-timestamp--m-help-text--TextUnderlineOffset);
20922
+ text-decoration-color: var(--pf-c-timestamp--m-help-text--TextDecorationColor);
20923
+ }
20924
+
20925
+ .pf-c-timestamp.pf-m-help-text:hover {
20926
+ --pf-c-timestamp--Color: var(--pf-c-timestamp--m-help-text--hover--Color);
20927
+ --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-c-timestamp--m-help-text--hover--TextDecorationColor);
20928
+ }
20929
+
20930
+ .pf-c-timestamp.pf-m-help-text:focus {
20931
+ --pf-c-timestamp--Color: var(--pf-c-timestamp--m-help-text--focus--Color);
20932
+ --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-c-timestamp--m-help-text--focus--TextDecorationColor);
20933
+ }
20934
+
20897
20935
  .pf-c-title {
20898
20936
  --pf-c-title--FontFamily: var(--pf-global--FontFamily--heading--sans-serif);
20899
20937
  --pf-c-title--m-4xl--LineHeight: var(--pf-global--LineHeight--sm);
@@ -22460,6 +22498,52 @@ svg.pf-c-spinner.pf-m-xl {
22460
22498
  --pf-c-toolbar--spacer: 0;
22461
22499
  }
22462
22500
 
22501
+ .pf-c-number-input .pf-c-form-control {
22502
+ appearance: textfield;
22503
+ }
22504
+
22505
+ .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
22506
+ appearance: none;
22507
+ margin: 0;
22508
+ }
22509
+
22510
+ .pf-c-number-input {
22511
+ --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
22512
+ --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
22513
+ --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
22514
+ --pf-c-number-input--c-form-control--width-icon: 0px;
22515
+ --pf-c-number-input--m-status--c-form-control--width-icon: var(--pf-global--spacer--xl);
22516
+ --pf-c-number-input--c-form-control--width-chars: 4;
22517
+ --pf-c-number-input--c-form-control--Width:
22518
+ calc(
22519
+ calc(
22520
+ var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch
22521
+ ) + var(--pf-c-number-input--c-form-control--width-icon)
22522
+ );
22523
+ display: inline-flex;
22524
+ align-items: center;
22525
+ }
22526
+
22527
+ .pf-c-number-input.pf-m-status {
22528
+ --pf-c-number-input--c-form-control--width-icon: var(--pf-c-number-input--m-status--c-form-control--width-icon);
22529
+ }
22530
+
22531
+ .pf-c-number-input .pf-c-form-control {
22532
+ display: inline-flex;
22533
+ width: var(--pf-c-number-input--c-form-control--Width);
22534
+ text-align: right;
22535
+ }
22536
+
22537
+ .pf-c-input-group + .pf-c-number-input__unit,
22538
+ .pf-c-number-input__unit + .pf-c-input-group {
22539
+ margin-left: var(--pf-c-number-input__unit--c-input-group--MarginLeft);
22540
+ }
22541
+
22542
+ .pf-c-number-input__icon {
22543
+ display: flex;
22544
+ font-size: var(--pf-c-number-input__icon--FontSize);
22545
+ }
22546
+
22463
22547
  .pf-c-tooltip {
22464
22548
  --pf-c-tooltip--MaxWidth: 18.75rem;
22465
22549
  --pf-c-tooltip--BoxShadow: var(--pf-global--BoxShadow--md);
@@ -22568,52 +22652,6 @@ svg.pf-c-spinner.pf-m-xl {
22568
22652
  --pf-c-tooltip__arrow--Height: 0.9375rem;
22569
22653
  }
22570
22654
 
22571
- .pf-c-number-input .pf-c-form-control {
22572
- appearance: textfield;
22573
- }
22574
-
22575
- .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
22576
- appearance: none;
22577
- margin: 0;
22578
- }
22579
-
22580
- .pf-c-number-input {
22581
- --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
22582
- --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
22583
- --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
22584
- --pf-c-number-input--c-form-control--width-icon: 0px;
22585
- --pf-c-number-input--m-status--c-form-control--width-icon: var(--pf-global--spacer--xl);
22586
- --pf-c-number-input--c-form-control--width-chars: 4;
22587
- --pf-c-number-input--c-form-control--Width:
22588
- calc(
22589
- calc(
22590
- var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch
22591
- ) + var(--pf-c-number-input--c-form-control--width-icon)
22592
- );
22593
- display: inline-flex;
22594
- align-items: center;
22595
- }
22596
-
22597
- .pf-c-number-input.pf-m-status {
22598
- --pf-c-number-input--c-form-control--width-icon: var(--pf-c-number-input--m-status--c-form-control--width-icon);
22599
- }
22600
-
22601
- .pf-c-number-input .pf-c-form-control {
22602
- display: inline-flex;
22603
- width: var(--pf-c-number-input--c-form-control--Width);
22604
- text-align: right;
22605
- }
22606
-
22607
- .pf-c-input-group + .pf-c-number-input__unit,
22608
- .pf-c-number-input__unit + .pf-c-input-group {
22609
- margin-left: var(--pf-c-number-input__unit--c-input-group--MarginLeft);
22610
- }
22611
-
22612
- .pf-c-number-input__icon {
22613
- display: flex;
22614
- font-size: var(--pf-c-number-input__icon--FontSize);
22615
- }
22616
-
22617
22655
  .pf-c-tree-view {
22618
22656
  --pf-c-tree-view--PaddingTop: var(--pf-global--spacer--sm);
22619
22657
  --pf-c-tree-view--PaddingBottom: var(--pf-global--spacer--sm);
@@ -26125,75 +26163,6 @@ label.pf-c-tree-view__node-text {
26125
26163
  --pf-l-flex--spacer: var(--pf-l-flex--spacer--4xl);
26126
26164
  }
26127
26165
  }
26128
- .pf-l-gallery {
26129
- --pf-l-gallery--m-gutter--GridGap: var(--pf-global--gutter);
26130
- --pf-l-gallery--GridTemplateColumns--min: 250px;
26131
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
26132
- --pf-l-gallery--GridTemplateColumns--max: 1fr;
26133
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
26134
- --pf-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-l-gallery--GridTemplateColumns--minmax--min), var(--pf-l-gallery--GridTemplateColumns--minmax--max)));
26135
- --pf-l-gallery--GridTemplateRows: auto;
26136
- display: grid;
26137
- grid-template-columns: var(--pf-l-gallery--GridTemplateColumns);
26138
- grid-template-rows: var(--pf-l-gallery--GridTemplateRows);
26139
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
26140
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
26141
- }
26142
-
26143
- .pf-l-gallery.pf-m-gutter {
26144
- grid-gap: var(--pf-l-gallery--m-gutter--GridGap);
26145
- }
26146
-
26147
- @media (min-width: 576px) {
26148
- .pf-l-gallery {
26149
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min));
26150
- }
26151
- }
26152
- @media (min-width: 768px) {
26153
- .pf-l-gallery {
26154
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)));
26155
- }
26156
- }
26157
- @media (min-width: 992px) {
26158
- .pf-l-gallery {
26159
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))));
26160
- }
26161
- }
26162
- @media (min-width: 1200px) {
26163
- .pf-l-gallery {
26164
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)))));
26165
- }
26166
- }
26167
- @media (min-width: 1450px) {
26168
- .pf-l-gallery {
26169
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-2xl, var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))))));
26170
- }
26171
- }
26172
- @media (min-width: 576px) {
26173
- .pf-l-gallery {
26174
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max));
26175
- }
26176
- }
26177
- @media (min-width: 768px) {
26178
- .pf-l-gallery {
26179
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)));
26180
- }
26181
- }
26182
- @media (min-width: 992px) {
26183
- .pf-l-gallery {
26184
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))));
26185
- }
26186
- }
26187
- @media (min-width: 1200px) {
26188
- .pf-l-gallery {
26189
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)))));
26190
- }
26191
- }
26192
- @media (min-width: 1450px) {
26193
- .pf-l-gallery {
26194
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))))));
26195
- }
26196
- }
26197
26166
  .pf-l-grid {
26198
26167
  --pf-l-grid--m-gutter--GridGap: var(--pf-global--gutter);
26199
26168
  --pf-l-grid__item--GridColumnStart: auto;
@@ -27408,6 +27377,75 @@ label.pf-c-tree-view__node-text {
27408
27377
  grid-gap: var(--pf-l-grid--m-gutter--GridGap);
27409
27378
  }
27410
27379
 
27380
+ .pf-l-gallery {
27381
+ --pf-l-gallery--m-gutter--GridGap: var(--pf-global--gutter);
27382
+ --pf-l-gallery--GridTemplateColumns--min: 250px;
27383
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
27384
+ --pf-l-gallery--GridTemplateColumns--max: 1fr;
27385
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
27386
+ --pf-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-l-gallery--GridTemplateColumns--minmax--min), var(--pf-l-gallery--GridTemplateColumns--minmax--max)));
27387
+ --pf-l-gallery--GridTemplateRows: auto;
27388
+ display: grid;
27389
+ grid-template-columns: var(--pf-l-gallery--GridTemplateColumns);
27390
+ grid-template-rows: var(--pf-l-gallery--GridTemplateRows);
27391
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
27392
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
27393
+ }
27394
+
27395
+ .pf-l-gallery.pf-m-gutter {
27396
+ grid-gap: var(--pf-l-gallery--m-gutter--GridGap);
27397
+ }
27398
+
27399
+ @media (min-width: 576px) {
27400
+ .pf-l-gallery {
27401
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min));
27402
+ }
27403
+ }
27404
+ @media (min-width: 768px) {
27405
+ .pf-l-gallery {
27406
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)));
27407
+ }
27408
+ }
27409
+ @media (min-width: 992px) {
27410
+ .pf-l-gallery {
27411
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))));
27412
+ }
27413
+ }
27414
+ @media (min-width: 1200px) {
27415
+ .pf-l-gallery {
27416
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)))));
27417
+ }
27418
+ }
27419
+ @media (min-width: 1450px) {
27420
+ .pf-l-gallery {
27421
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-2xl, var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))))));
27422
+ }
27423
+ }
27424
+ @media (min-width: 576px) {
27425
+ .pf-l-gallery {
27426
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max));
27427
+ }
27428
+ }
27429
+ @media (min-width: 768px) {
27430
+ .pf-l-gallery {
27431
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)));
27432
+ }
27433
+ }
27434
+ @media (min-width: 992px) {
27435
+ .pf-l-gallery {
27436
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))));
27437
+ }
27438
+ }
27439
+ @media (min-width: 1200px) {
27440
+ .pf-l-gallery {
27441
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)))));
27442
+ }
27443
+ }
27444
+ @media (min-width: 1450px) {
27445
+ .pf-l-gallery {
27446
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))))));
27447
+ }
27448
+ }
27411
27449
  .pf-l-level {
27412
27450
  --pf-l-level--m-gutter--MarginRight: var(--pf-global--gutter);
27413
27451
  display: flex;