@patternfly/patternfly 6.0.0-alpha.21 → 6.0.0-alpha.23

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 (12) hide show
  1. package/components/ExpandableSection/expandable-section.css +64 -55
  2. package/components/ExpandableSection/expandable-section.scss +72 -68
  3. package/components/Tooltip/tooltip.css +16 -16
  4. package/components/Tooltip/tooltip.scss +18 -22
  5. package/docs/components/ExpandableSection/examples/ExpandableSection.md +47 -24
  6. package/package.json +1 -1
  7. package/patternfly-no-globals.css +80 -75
  8. package/patternfly-theme-dark-unversioned.css +80 -75
  9. package/patternfly.css +80 -75
  10. package/patternfly.min.css +1 -1
  11. package/patternfly.min.css.map +1 -1
  12. package/components/Tooltip/themes/dark/tooltip.scss +0 -8
package/docs/components/ExpandableSection/examples/ExpandableSection.md CHANGED
@@ -47,6 +47,27 @@ cssPrefix: pf-v5-c-expandable-section
47
47
 
48
48
  ```
49
49
 
50
+ ### Indented
51
+
52
+ ```html
53
+ <div class="pf-v5-c-expandable-section pf-m-expanded pf-m-indented">
54
+ <button
55
+ type="button"
56
+ class="pf-v5-c-expandable-section__toggle"
57
+ aria-expanded="true"
58
+ >
59
+ <span class="pf-v5-c-expandable-section__toggle-icon">
60
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
61
+ </span>
62
+ <span class="pf-v5-c-expandable-section__toggle-text">Show less</span>
63
+ </button>
64
+ <div
65
+ class="pf-v5-c-expandable-section__content"
66
+ >This content is visible only when the component is expanded.</div>
67
+ </div>
68
+
69
+ ```
70
+
50
71
  ### Disclosure variation (hidden)
51
72
 
52
73
  ```html
@@ -92,7 +113,30 @@ cssPrefix: pf-v5-c-expandable-section
92
113
 
93
114
  ```
94
115
 
95
- ### Detached toggle
116
+ ### Disclosure variation (indented)
117
+
118
+ ```html
119
+ <div
120
+ class="pf-v5-c-expandable-section pf-m-expanded pf-m-display-lg pf-m-limit-width pf-m-indented"
121
+ >
122
+ <button
123
+ type="button"
124
+ class="pf-v5-c-expandable-section__toggle"
125
+ aria-expanded="true"
126
+ >
127
+ <span class="pf-v5-c-expandable-section__toggle-icon">
128
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
129
+ </span>
130
+ <span class="pf-v5-c-expandable-section__toggle-text">Show less</span>
131
+ </button>
132
+ <div
133
+ class="pf-v5-c-expandable-section__content"
134
+ >This content is visible only when the component is expanded.</div>
135
+ </div>
136
+
137
+ ```
138
+
139
+ ### Detached
96
140
 
97
141
  ```html
98
142
  <div class="pf-v5-l-stack pf-m-gutter">
@@ -124,28 +168,7 @@ cssPrefix: pf-v5-c-expandable-section
124
168
 
125
169
  ```
126
170
 
127
- ### Indented
128
-
129
- ```html
130
- <div class="pf-v5-c-expandable-section pf-m-expanded pf-m-indented">
131
- <button
132
- type="button"
133
- class="pf-v5-c-expandable-section__toggle"
134
- aria-expanded="true"
135
- >
136
- <span class="pf-v5-c-expandable-section__toggle-icon">
137
- <i class="fas fa-angle-right" aria-hidden="true"></i>
138
- </span>
139
- <span class="pf-v5-c-expandable-section__toggle-text">Show less</span>
140
- </button>
141
- <div
142
- class="pf-v5-c-expandable-section__content"
143
- >This content is visible only when the component is expanded.</div>
144
- </div>
145
-
146
- ```
147
-
148
- ### Truncate expansion
171
+ ### Truncate expansion (hidden)
149
172
 
150
173
  ```html
151
174
  <div class="pf-v5-c-expandable-section pf-m-truncate">
@@ -163,7 +186,7 @@ cssPrefix: pf-v5-c-expandable-section
163
186
 
164
187
  ```
165
188
 
166
- ### Truncate expansion expanded
189
+ ### Truncate expansion (expanded)
167
190
 
168
191
  ```html
169
192
  <div class="pf-v5-c-expandable-section pf-m-expanded pf-m-truncate">
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": "6.0.0-alpha.21",
4
+ "version": "6.0.0-alpha.23",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
package/patternfly-no-globals.css CHANGED
@@ -14945,53 +14945,64 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
14945
14945
  justify-content: center;
14946
14946
  }
14947
14947
 
14948
- .pf-v5-c-expandable-section {
14949
- --pf-v5-c-expandable-section__toggle--PaddingTop: var(--pf-v5-global--spacer--form-element);
14950
- --pf-v5-c-expandable-section__toggle--PaddingRight: var(--pf-v5-global--spacer--md);
14951
- --pf-v5-c-expandable-section__toggle--PaddingBottom: var(--pf-v5-global--spacer--form-element);
14952
- --pf-v5-c-expandable-section__toggle--PaddingLeft: 0;
14953
- --pf-v5-c-expandable-section__toggle--MarginTop: 0;
14954
- --pf-v5-c-expandable-section__toggle--Color: var(--pf-v5-global--link--Color);
14955
- --pf-v5-c-expandable-section__toggle--hover--Color: var(--pf-v5-global--link--Color--hover);
14956
- --pf-v5-c-expandable-section__toggle--active--Color: var(--pf-v5-global--link--Color--hover);
14957
- --pf-v5-c-expandable-section__toggle--focus--Color: var(--pf-v5-global--link--Color--hover);
14958
- --pf-v5-c-expandable-section__toggle--m-expanded--Color: var(--pf-v5-global--link--Color--hover);
14948
+ :root {
14949
+ --pf-v5-c-expandable-section__toggle--PaddingTop: var(--pf-t--global--spacer--sm);
14950
+ --pf-v5-c-expandable-section__toggle--PaddingRight: var(--pf-t--global--spacer--md);
14951
+ --pf-v5-c-expandable-section__toggle--PaddingBottom: var(--pf-t--global--spacer--sm);
14952
+ --pf-v5-c-expandable-section__toggle--PaddingLeft: var(--pf-t--global--spacer--sm);
14953
+ --pf-v5-c-expandable-section__toggle--Color: var(--pf-t--global--color--brand--default);
14954
+ --pf-v5-c-expandable-section__toggle--hover--Color: var(--pf-t--global--color--brand--hover);
14955
+ --pf-v5-c-expandable-section__toggle--active--Color: var(--pf-t--global--color--brand--hover);
14956
+ --pf-v5-c-expandable-section__toggle--focus--Color: var(--pf-t--global--color--brand--hover);
14957
+ --pf-v5-c-expandable-section__toggle--m-expanded--Color: var(--pf-t--global--color--brand--hover);
14959
14958
  --pf-v5-c-expandable-section__toggle--BackgroundColor: transparent;
14959
+ --pf-v5-c-expandable-section__toggle--ColumnGap: calc(var(--pf-t--global--spacer--xs) + var(--pf-t--global--spacer--sm));
14960
14960
  --pf-v5-c-expandable-section__toggle-icon--MinWidth: 1em;
14961
- --pf-v5-c-expandable-section__toggle-icon--Color: var(--pf-v5-global--Color--100);
14961
+ --pf-v5-c-expandable-section__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
14962
14962
  --pf-v5-c-expandable-section__toggle-icon--Transition: .2s ease-in 0s;
14963
14963
  --pf-v5-c-expandable-section__toggle-icon--Rotate: 0;
14964
14964
  --pf-v5-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
14965
14965
  --pf-v5-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
14966
14966
  --pf-v5-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate: -90deg;
14967
- --pf-v5-c-expandable-section__toggle-text--MarginLeft: calc(var(--pf-v5-global--spacer--xs) + var(--pf-v5-global--spacer--sm));
14968
- --pf-v5-c-expandable-section__content--MarginTop: var(--pf-v5-global--spacer--md);
14967
+ --pf-v5-c-expandable-section__content--PaddingTop: var(--pf-t--global--spacer--sm);
14968
+ --pf-v5-c-expandable-section__content--PaddingRight: var(--pf-t--global--spacer--sm);
14969
+ --pf-v5-c-expandable-section__content--PaddingBottom: var(--pf-t--global--spacer--sm);
14970
+ --pf-v5-c-expandable-section__content--PaddingLeft: var(--pf-t--global--spacer--sm);
14969
14971
  --pf-v5-c-expandable-section__content--MaxWidth: auto;
14970
14972
  --pf-v5-c-expandable-section--m-limit-width__content--MaxWidth: 46.875rem;
14971
- --pf-v5-c-expandable-section--m-display-lg--BoxShadow: var(--pf-v5-global--BoxShadow--md);
14972
- --pf-v5-c-expandable-section--m-display-lg__toggle--PaddingTop: var(--pf-v5-global--spacer--md);
14973
- --pf-v5-c-expandable-section--m-display-lg__toggle--PaddingRight: var(--pf-v5-global--spacer--md);
14974
- --pf-v5-c-expandable-section--m-display-lg__toggle--PaddingBottom: var(--pf-v5-global--spacer--md);
14975
- --pf-v5-c-expandable-section--m-display-lg__toggle--PaddingLeft: var(--pf-v5-global--spacer--md);
14976
- --pf-v5-c-expandable-section--m-display-lg__content--MarginTop: 0;
14977
- --pf-v5-c-expandable-section--m-display-lg__content--PaddingRight: var(--pf-v5-global--spacer--lg);
14978
- --pf-v5-c-expandable-section--m-display-lg__content--PaddingBottom: var(--pf-v5-global--spacer--lg);
14979
- --pf-v5-c-expandable-section--m-display-lg__content--PaddingLeft: var(--pf-v5-global--spacer--lg);
14980
- --pf-v5-c-expandable-section--m-display-lg--after--BackgroundColor: transparent;
14981
- --pf-v5-c-expandable-section--m-display-lg--after--Width: var(--pf-v5-global--BorderWidth--lg);
14982
- --pf-v5-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor: var(--pf-v5-global--primary-color--100);
14983
- --pf-v5-c-expandable-section--m-indented__content--PaddingLeft: calc(var(--pf-v5-c-expandable-section__toggle-text--MarginLeft) + var(--pf-v5-c-expandable-section__toggle-icon--MinWidth));
14973
+ --pf-v5-c-expandable-section--m-display-lg--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
14974
+ --pf-v5-c-expandable-section--m-display-lg--BorderColor: var(--pf-t--global--border--color--default);
14975
+ --pf-v5-c-expandable-section--m-display-lg--BorderRadius: var(--pf-t--global--border--radius--medium);
14976
+ --pf-v5-c-expandable-section--m-display-lg__toggle--PaddingTop: var(--pf-t--global--spacer--md);
14977
+ --pf-v5-c-expandable-section--m-display-lg__toggle--PaddingRight: var(--pf-t--global--spacer--lg);
14978
+ --pf-v5-c-expandable-section--m-display-lg__toggle--PaddingBottom: var(--pf-t--global--spacer--md);
14979
+ --pf-v5-c-expandable-section--m-display-lg__toggle--PaddingLeft: var(--pf-t--global--spacer--lg);
14980
+ --pf-v5-c-expandable-section--m-display-lg__toggle--BorderRadius: var(--pf-t--global--border--radius--medium);
14981
+ --pf-v5-c-expandable-section--m-display-lg__toggle--Width: 100%;
14982
+ --pf-v5-c-expandable-section--m-display-lg__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
14983
+ --pf-v5-c-expandable-section--m-display-lg__toggle--active--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
14984
+ --pf-v5-c-expandable-section--m-display-lg__toggle--focus--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
14985
+ --pf-v5-c-expandable-section--m-display-lg__content--PaddingRight: var(--pf-t--global--spacer--lg);
14986
+ --pf-v5-c-expandable-section--m-display-lg__content--PaddingBottom: var(--pf-t--global--spacer--md);
14987
+ --pf-v5-c-expandable-section--m-display-lg__content--PaddingLeft: var(--pf-t--global--spacer--lg);
14988
+ --pf-v5-c-expandable-section--m-expanded--m-display-lg__toggle--BorderRadius: var(--pf-t--global--border--radius--medium) var(--pf-t--global--border--radius--medium) 0 0;
14989
+ --pf-v5-c-expandable-section--m-indented__content--PaddingLeft--base: calc(var(--pf-v5-c-expandable-section__toggle--ColumnGap) + var(--pf-v5-c-expandable-section__toggle-icon--MinWidth));
14990
+ --pf-v5-c-expandable-section--m-indented__content--PaddingLeft: calc(var(--pf-v5-c-expandable-section--m-indented__content--PaddingLeft--base) + var(--pf-v5-c-expandable-section__toggle--PaddingLeft));
14991
+ --pf-v5-c-expandable-section--m-display-lg--m-indented__content--PaddingLeft: calc(var(--pf-v5-c-expandable-section--m-indented__content--PaddingLeft--base) + var(--pf-v5-c-expandable-section--m-display-lg__content--PaddingLeft));
14992
+ --pf-v5-c-expandable-section--m-truncate--PaddingTop: var(--pf-t--global--spacer--sm);
14993
+ --pf-v5-c-expandable-section--m-truncate--PaddingRight: var(--pf-t--global--spacer--md);
14994
+ --pf-v5-c-expandable-section--m-truncate--PaddingBottom: var(--pf-t--global--spacer--sm);
14995
+ --pf-v5-c-expandable-section--m-truncate--PaddingLeft: var(--pf-t--global--spacer--md);
14996
+ --pf-v5-c-expandable-section--m-truncate__toggle--PaddingBottom: var(--pf-t--global--spacer--sm);
14984
14997
  --pf-v5-c-expandable-section--m-truncate__content--LineClamp: 3;
14985
- --pf-v5-c-expandable-section--m-truncate__toggle--MarginTop: var(--pf-v5-global--spacer--xs);
14986
14998
  }
14999
+
14987
15000
  .pf-v5-c-expandable-section.pf-m-expanded {
14988
15001
  --pf-v5-c-expandable-section__toggle--Color: var(--pf-v5-c-expandable-section__toggle--m-expanded--Color);
14989
15002
  --pf-v5-c-expandable-section__toggle-icon--Rotate: var(--pf-v5-c-expandable-section--m-expanded__toggle-icon--Rotate);
14990
15003
  --pf-v5-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-v5-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
14991
15004
  --pf-v5-c-expandable-section--m-display-lg--after--BackgroundColor: var(--pf-v5-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor);
14992
- }
14993
- .pf-v5-c-expandable-section.pf-m-detached, .pf-v5-c-expandable-section.pf-m-truncate {
14994
- --pf-v5-c-expandable-section__content--MarginTop: 0;
15005
+ --pf-v5-c-expandable-section--m-display-lg__toggle--BorderRadius: var(--pf-v5-c-expandable-section--m-expanded--m-display-lg__toggle--BorderRadius);
14995
15006
  }
14996
15007
  .pf-v5-c-expandable-section.pf-m-limit-width {
14997
15008
  --pf-v5-c-expandable-section__content--MaxWidth: var(--pf-v5-c-expandable-section--m-limit-width__content--MaxWidth);
@@ -15001,31 +15012,31 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
15001
15012
  --pf-v5-c-expandable-section__toggle--PaddingRight: var(--pf-v5-c-expandable-section--m-display-lg__toggle--PaddingRight);
15002
15013
  --pf-v5-c-expandable-section__toggle--PaddingBottom: var(--pf-v5-c-expandable-section--m-display-lg__toggle--PaddingBottom);
15003
15014
  --pf-v5-c-expandable-section__toggle--PaddingLeft: var(--pf-v5-c-expandable-section--m-display-lg__toggle--PaddingLeft);
15015
+ --pf-v5-c-expandable-section__toggle--hover--BackgroundColor: var(--pf-v5-c-expandable-section--m-display-lg__toggle--hover--BackgroundColor);
15016
+ --pf-v5-c-expandable-section__toggle--active--BackgroundColor: var(--pf-v5-c-expandable-section--m-display-lg__toggle--active--BackgroundColor);
15017
+ --pf-v5-c-expandable-section__toggle--focus--BackgroundColor: var(--pf-v5-c-expandable-section--m-display-lg__toggle--focus--BackgroundColor);
15018
+ --pf-v5-c-expandable-section__toggle--BorderRadius: var(--pf-v5-c-expandable-section--m-display-lg__toggle--BorderRadius);
15019
+ --pf-v5-c-expandable-section__toggle--Width: var(--pf-v5-c-expandable-section--m-display-lg__toggle--Width);
15004
15020
  --pf-v5-c-expandable-section__content--PaddingRight: var(--pf-v5-c-expandable-section--m-display-lg__content--PaddingRight);
15005
15021
  --pf-v5-c-expandable-section__content--PaddingBottom: var(--pf-v5-c-expandable-section--m-display-lg__content--PaddingBottom);
15006
15022
  --pf-v5-c-expandable-section__content--PaddingLeft: var(--pf-v5-c-expandable-section--m-display-lg__content--PaddingLeft);
15007
- --pf-v5-c-expandable-section__content--MarginTop: var(--pf-v5-c-expandable-section--m-display-lg__content--MarginTop);
15008
- position: relative;
15009
- box-shadow: var(--pf-v5-c-expandable-section--m-display-lg--BoxShadow);
15010
- }
15011
- .pf-v5-c-expandable-section.pf-m-display-lg::after {
15012
- position: absolute;
15013
- inset-block-start: 0;
15014
- inset-block-end: 0;
15015
- inset-inline-start: 0;
15016
- width: var(--pf-v5-c-expandable-section--m-display-lg--after--Width);
15017
- content: "";
15018
- background-color: var(--pf-v5-c-expandable-section--m-display-lg--after--BackgroundColor);
15023
+ --pf-v5-c-expandable-section--m-indented__content--PaddingLeft: var(--pf-v5-c-expandable-section--m-display-lg--m-indented__content--PaddingLeft);
15024
+ background-color: var(--pf-v5-c-expandable-section--m-display-lg--BackgroundColor);
15025
+ border: solid 1px var(--pf-v5-c-expandable-section--m-display-lg--BorderColor);
15026
+ border-radius: var(--pf-v5-c-expandable-section--m-display-lg--BorderRadius);
15019
15027
  }
15020
15028
  .pf-v5-c-expandable-section.pf-m-indented {
15021
15029
  --pf-v5-c-expandable-section__content--PaddingLeft: var(--pf-v5-c-expandable-section--m-indented__content--PaddingLeft);
15022
15030
  }
15023
15031
  .pf-v5-c-expandable-section.pf-m-truncate {
15024
- --pf-v5-c-expandable-section__toggle--MarginTop: var(--pf-v5-c-expandable-section--m-truncate__toggle--MarginTop);
15025
15032
  --pf-v5-c-expandable-section__toggle--PaddingTop: 0;
15026
15033
  --pf-v5-c-expandable-section__toggle--PaddingRight: 0;
15027
- --pf-v5-c-expandable-section__toggle--PaddingBottom: 0;
15028
- --pf-v5-c-expandable-section__toggle-text--MarginLeft: 0;
15034
+ --pf-v5-c-expandable-section__toggle--PaddingBottom: var(--pf-v5-c-expandable-section--m-truncate__toggle--PaddingBottom);
15035
+ --pf-v5-c-expandable-section__toggle--PaddingLeft: 0;
15036
+ --pf-v5-c-expandable-section__content--PaddingTop: 0;
15037
+ --pf-v5-c-expandable-section__content--PaddingRight: 0;
15038
+ --pf-v5-c-expandable-section__content--PaddingBottom: 0;
15039
+ --pf-v5-c-expandable-section__content--PaddingLeft: 0;
15029
15040
  }
15030
15041
  .pf-v5-c-expandable-section.pf-m-truncate:not(.pf-m-expanded) .pf-v5-c-expandable-section__content {
15031
15042
  display: -webkit-box;
@@ -15033,29 +15044,31 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
15033
15044
  -webkit-line-clamp: var(--pf-v5-c-expandable-section--m-truncate__content--LineClamp);
15034
15045
  overflow: hidden;
15035
15046
  }
15036
- .pf-v5-c-expandable-section.pf-m-detached {
15037
- --pf-v5-c-expandable-section--m-truncate__toggle--MarginTop: 0;
15038
- }
15039
15047
 
15040
15048
  .pf-v5-c-expandable-section__toggle {
15041
15049
  display: flex;
15050
+ column-gap: var(--pf-v5-c-expandable-section__toggle--ColumnGap);
15051
+ width: var(--pf-v5-c-expandable-section__toggle--Width, initial);
15042
15052
  padding-block-start: var(--pf-v5-c-expandable-section__toggle--PaddingTop);
15043
15053
  padding-block-end: var(--pf-v5-c-expandable-section__toggle--PaddingBottom);
15044
15054
  padding-inline-start: var(--pf-v5-c-expandable-section__toggle--PaddingLeft);
15045
15055
  padding-inline-end: var(--pf-v5-c-expandable-section__toggle--PaddingRight);
15046
- margin-block-start: var(--pf-v5-c-expandable-section__toggle--MarginTop);
15047
15056
  color: var(--pf-v5-c-expandable-section__toggle--Color);
15048
15057
  background-color: var(--pf-v5-c-expandable-section__toggle--BackgroundColor);
15049
15058
  border: none;
15059
+ border-radius: var(--pf-v5-c-expandable-section__toggle--BorderRadius, 0);
15050
15060
  }
15051
15061
  .pf-v5-c-expandable-section__toggle:hover {
15052
15062
  --pf-v5-c-expandable-section__toggle--Color: var(--pf-v5-c-expandable-section__toggle--hover--Color);
15063
+ --pf-v5-c-expandable-section__toggle--BackgroundColor: var(--pf-v5-c-expandable-section__toggle--hover--BackgroundColor, initial);
15053
15064
  }
15054
15065
  .pf-v5-c-expandable-section__toggle:active, .pf-v5-c-expandable-section__toggle.pf-m-active {
15055
15066
  --pf-v5-c-expandable-section__toggle--Color: var(--pf-v5-c-expandable-section__toggle--active--Color);
15067
+ --pf-v5-c-expandable-section__toggle--BackgroundColor: var(--pf-v5-c-expandable-section__toggle--active--BackgroundColor, initial);
15056
15068
  }
15057
15069
  .pf-v5-c-expandable-section__toggle:focus {
15058
15070
  --pf-v5-c-expandable-section__toggle--Color: var(--pf-v5-c-expandable-section__toggle--focus--Color);
15071
+ --pf-v5-c-expandable-section__toggle--BackgroundColor: var(--pf-v5-c-expandable-section__toggle--focus--BackgroundColor, initial);
15059
15072
  }
15060
15073
 
15061
15074
  .pf-v5-c-expandable-section__toggle-icon {
@@ -15072,16 +15085,12 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
15072
15085
  --pf-v5-c-expandable-section__toggle-icon--Rotate: var(--pf-v5-c-expandable-section__toggle-icon--m-expand-top--Rotate);
15073
15086
  }
15074
15087
 
15075
- .pf-v5-c-expandable-section__toggle-text {
15076
- margin-inline-start: var(--pf-v5-c-expandable-section__toggle-text--MarginLeft);
15077
- }
15078
-
15079
15088
  .pf-v5-c-expandable-section__content {
15080
15089
  max-width: var(--pf-v5-c-expandable-section__content--MaxWidth);
15090
+ padding-block-start: var(--pf-v5-c-expandable-section__content--PaddingTop);
15081
15091
  padding-block-end: var(--pf-v5-c-expandable-section__content--PaddingBottom);
15082
15092
  padding-inline-start: var(--pf-v5-c-expandable-section__content--PaddingLeft);
15083
15093
  padding-inline-end: var(--pf-v5-c-expandable-section__content--PaddingRight);
15084
- margin-block-start: var(--pf-v5-c-expandable-section__content--MarginTop);
15085
15094
  }
15086
15095
 
15087
15096
  .pf-v5-c-file-upload {
@@ -30761,20 +30770,21 @@ svg.pf-v5-c-spinner.pf-m-xl {
30761
30770
  --pf-v5-c-toggle-group__button--m-selected--Color: var(--pf-v5-global--primary-color--400);
30762
30771
  }
30763
30772
 
30764
- .pf-v5-c-tooltip {
30773
+ :root {
30765
30774
  --pf-v5-c-tooltip--MaxWidth: 18.75rem;
30766
- --pf-v5-c-tooltip--BoxShadow: var(--pf-v5-global--BoxShadow--md);
30767
- --pf-v5-c-tooltip__content--PaddingTop: var(--pf-v5-global--spacer--sm);
30768
- --pf-v5-c-tooltip__content--PaddingRight: var(--pf-v5-global--spacer--sm);
30769
- --pf-v5-c-tooltip__content--PaddingBottom: var(--pf-v5-global--spacer--sm);
30770
- --pf-v5-c-tooltip__content--PaddingLeft: var(--pf-v5-global--spacer--sm);
30771
- --pf-v5-c-tooltip__content--Color: var(--pf-v5-global--Color--light-100);
30772
- --pf-v5-c-tooltip__content--BackgroundColor: var(--pf-v5-global--BackgroundColor--dark-100);
30773
- --pf-v5-c-tooltip__content--FontSize: var(--pf-v5-global--FontSize--sm);
30775
+ --pf-v5-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
30776
+ --pf-v5-c-tooltip__content--PaddingTop: var(--pf-t--global--spacer--sm);
30777
+ --pf-v5-c-tooltip__content--PaddingRight: var(--pf-t--global--spacer--md);
30778
+ --pf-v5-c-tooltip__content--PaddingBottom: var(--pf-t--global--spacer--sm);
30779
+ --pf-v5-c-tooltip__content--PaddingLeft: var(--pf-t--global--spacer--md);
30780
+ --pf-v5-c-tooltip__content--Color: var(--pf-t--global--text--color--inverse);
30781
+ --pf-v5-c-tooltip__content--BackgroundColor: var(--pf-t--global--background--color--inverse--default);
30782
+ --pf-v5-c-tooltip__content--FontSize: var(--pf-t--global--font--size--body--sm);
30783
+ --pf-v5-c-tooltip__content--BorderRadius: var(--pf-t--global--border--radius--small);
30774
30784
  --pf-v5-c-tooltip__arrow--Width: 0.9375rem;
30775
30785
  --pf-v5-c-tooltip__arrow--Height: 0.9375rem;
30776
- --pf-v5-c-tooltip__arrow--BackgroundColor: var(--pf-v5-global--BackgroundColor--dark-100);
30777
- --pf-v5-c-tooltip__arrow--BoxShadow: var(--pf-v5-global--BoxShadow--md);
30786
+ --pf-v5-c-tooltip__arrow--BackgroundColor: var(--pf-t--global--background--color--inverse--default);
30787
+ --pf-v5-c-tooltip__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
30778
30788
  --pf-v5-c-tooltip__arrow--m-top--TranslateX: -50%;
30779
30789
  --pf-v5-c-tooltip__arrow--m-top--TranslateY: 50%;
30780
30790
  --pf-v5-c-tooltip__arrow--m-top--Rotate: 45deg;
@@ -30787,6 +30797,9 @@ svg.pf-v5-c-spinner.pf-m-xl {
30787
30797
  --pf-v5-c-tooltip__arrow--m-left--TranslateX: 50%;
30788
30798
  --pf-v5-c-tooltip__arrow--m-left--TranslateY: -50%;
30789
30799
  --pf-v5-c-tooltip__arrow--m-left--Rotate: 45deg;
30800
+ }
30801
+
30802
+ .pf-v5-c-tooltip {
30790
30803
  position: relative;
30791
30804
  max-width: var(--pf-v5-c-tooltip--MaxWidth);
30792
30805
  box-shadow: var(--pf-v5-c-tooltip--BoxShadow);
@@ -30859,6 +30872,7 @@ svg.pf-v5-c-spinner.pf-m-xl {
30859
30872
  text-align: center;
30860
30873
  word-break: break-word;
30861
30874
  background-color: var(--pf-v5-c-tooltip__content--BackgroundColor);
30875
+ border-radius: var(--pf-v5-c-tooltip__content--BorderRadius);
30862
30876
  }
30863
30877
  .pf-v5-c-tooltip__content.pf-m-text-align-left {
30864
30878
  text-align: start;
@@ -30880,15 +30894,6 @@ svg.pf-v5-c-spinner.pf-m-xl {
30880
30894
  transform: translateX(var(--pf-v5-c-tooltip__arrow--TranslateX, 0)) translateY(var(--pf-v5-c-tooltip__arrow--TranslateY, 0)) rotate(var(--pf-v5-c-tooltip__arrow--Rotate, 0));
30881
30895
  }
30882
30896
 
30883
- :where(.pf-v5-theme-dark) .pf-v5-c-wizard__header .pf-v5-c-button, :where(.pf-v5-theme-dark) .pf-v5-c-banner .pf-v5-c-button, :where(.pf-v5-theme-dark) .pf-v5-c-log-viewer.pf-m-dark .pf-v5-c-log-viewer__main .pf-v5-c-button {
30884
- --pf-v5-c-button--m-primary--BackgroundColor: var(--pf-v5-global--primary-color--300);
30885
- }
30886
-
30887
- :where(.pf-v5-theme-dark) .pf-v5-c-tooltip {
30888
- --pf-v5-c-tooltip__content--BackgroundColor: var(--pf-v5-global--BackgroundColor--300);
30889
- --pf-v5-c-tooltip__arrow--BackgroundColor: var(--pf-v5-global--BackgroundColor--300);
30890
- }
30891
-
30892
30897
  .pf-v5-c-truncate {
30893
30898
  --pf-v5-c-truncate--MinWidth: 12ch;
30894
30899
  --pf-v5-c-truncate__start--MinWidth: 6ch;