@patternfly/patternfly 6.0.0-alpha.223 → 6.0.0-alpha.225

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 (17) hide show
  1. package/base/patternfly-variables.css +1 -0
  2. package/base/tokens/tokens-local.scss +8 -0
  3. package/components/Banner/banner.css +2 -11
  4. package/components/Banner/banner.scss +2 -15
  5. package/components/Content/content.css +5 -3
  6. package/components/Content/content.scss +5 -3
  7. package/components/Timestamp/timestamp.css +3 -1
  8. package/components/Timestamp/timestamp.scss +4 -1
  9. package/components/_index.css +10 -15
  10. package/docs/components/Timestamp/examples/Timestamp.md +7 -0
  11. package/package.json +1 -1
  12. package/patternfly-base-no-globals.css +1 -0
  13. package/patternfly-base.css +1 -0
  14. package/patternfly-no-globals.css +11 -15
  15. package/patternfly.css +11 -15
  16. package/patternfly.min.css +1 -1
  17. package/patternfly.min.css.map +1 -1
package/base/patternfly-variables.css CHANGED
@@ -831,6 +831,7 @@
831
831
  --pf-t--global--transition--timing-function: cubic-bezier(.645, .045, .355, 1);
832
832
  --pf-t--global--transition--duration: 250ms;
833
833
  --pf-t--global--list-style: disc outside;
834
+ --pf-t--temp--dev--tbd: #BC11E0;
834
835
  }
835
836
 
836
837
  :where(.pf-v6-theme-dark) {
package/base/tokens/tokens-local.scss CHANGED
@@ -122,4 +122,12 @@
122
122
 
123
123
  // List bullet/marker
124
124
  --pf-t--global--list-style: disc outside;
125
+
126
+ // Token to be used temporarily as a placeholder for a color to be determined
127
+ // Used by code mods to provide a valid value without guessing at the correct color
128
+
129
+ // stylelint-disable custom-property-pattern
130
+ --pf-t--temp--dev--tbd: #BC11E0;
131
+
132
+ // styleline-enable custom-property-pattern
125
133
  }
package/components/Banner/banner.css CHANGED
@@ -11,9 +11,7 @@
11
11
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
12
12
  --pf-v6-c-banner--link--TextDecoration: underline;
13
13
  --pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
14
- --pf-v6-c-banner--link--hover--FontWeight: var(--pf-t--global--font--weight--body--bold);
15
- --pf-v6-c-banner--link--disabled--Color: var(--pf-v6-c-banner--Color);
16
- --pf-v6-c-banner--link--disabled--TextDecoration: none;
14
+ --pf-v6-c-banner--link--disabled--Color: var(--pf-t--global--text--color--disabled);
17
15
  --pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
18
16
  --pf-v6-c-banner--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md);
19
17
  --pf-v6-c-banner--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
@@ -125,24 +123,17 @@
125
123
  }
126
124
  .pf-v6-c-banner a:hover:not(.pf-m-disabled) {
127
125
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
128
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
129
126
  }
130
127
  .pf-v6-c-banner a.pf-m-disabled {
131
128
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--disabled--Color);
132
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
133
129
  cursor: not-allowed;
134
130
  }
135
131
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
136
132
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-banner--link--Color);
137
- --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
133
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
138
134
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
139
135
  text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
140
136
  }
141
- .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:hover {
142
- --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
143
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
144
- }
145
137
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {
146
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
147
138
  cursor: not-allowed;
148
139
  }
package/components/Banner/banner.scss CHANGED
@@ -20,9 +20,7 @@
20
20
  --#{$banner}--link--Color: var(--#{$banner}--Color);
21
21
  --#{$banner}--link--TextDecoration: underline;
22
22
  --#{$banner}--link--hover--Color: var(--#{$banner}--Color);
23
- --#{$banner}--link--hover--FontWeight: var(--pf-t--global--font--weight--body--bold);
24
- --#{$banner}--link--disabled--Color: var(--#{$banner}--Color);
25
- --#{$banner}--link--disabled--TextDecoration: none;
23
+ --#{$banner}--link--disabled--Color: var(--pf-t--global--text--color--disabled);
26
24
 
27
25
  // modifier variables
28
26
  --#{$banner}--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
@@ -148,14 +146,11 @@
148
146
 
149
147
  &:hover:not(.pf-m-disabled) {
150
148
  --#{$banner}--link--Color: var(--#{$banner}--link--hover--Color);
151
-
152
- font-weight: var(--#{$banner}--link--hover--FontWeight);
153
149
  }
154
150
 
155
151
  // stylelint-disable selector-no-qualifying-type
156
152
  &.pf-m-disabled {
157
153
  --#{$banner}--link--Color: var(--#{$banner}--link--disabled--Color);
158
- --#{$banner}--link--TextDecoration: var(--#{$banner}--link--disabled--TextDecoration);
159
154
 
160
155
  cursor: not-allowed;
161
156
  }
@@ -164,21 +159,13 @@
164
159
 
165
160
  .#{$button}.pf-m-inline {
166
161
  --#{$button}--m-link--Color: var(--#{$banner}--link--Color);
167
- --#{$button}--m-link--m-inline--hover--Color: var(--#{$banner}--link--hover--Color);
162
+ --#{$button}--m-link--hover--Color: var(--#{$banner}--link--hover--Color);
168
163
  --#{$button}--disabled--Color: var(--#{$banner}--link--disabled--Color);
169
164
 
170
165
  text-decoration: var(--#{$banner}--link--TextDecoration);
171
166
 
172
- &:hover {
173
- --#{$banner}--link--Color: var(--#{$banner}--link--hover--Color);
174
-
175
- font-weight: var(--#{$banner}--link--hover--FontWeight);
176
- }
177
-
178
167
  &:disabled,
179
168
  &.pf-m-disabled {
180
- --#{$banner}--link--TextDecoration: var(--#{$banner}--link--disabled--TextDecoration);
181
-
182
169
  cursor: not-allowed;
183
170
  }
184
171
  }
package/components/Content/content.css CHANGED
@@ -59,8 +59,10 @@
59
59
  --pf-v6-c-content--list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
60
60
  --pf-v6-c-content--list--nested--MarginBlockStart: var(--pf-v6-c-content--list--Gap);
61
61
  --pf-v6-c-content--ul--ListStyle: var(--pf-t--global--list-style);
62
- --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--2xl);
63
- --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--md);
62
+ --pf-v6-c-content--dl--GridTemplateColumns--dt: 12ch;
63
+ --pf-v6-c-content--dl--GridTemplateColumns--dd: 1fr;
64
+ --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
65
+ --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
64
66
  --pf-v6-c-content--dt--FontWeight: var(--pf-t--global--font--weight--body--bold);
65
67
  --pf-v6-c-content--dt--MarginBlockStart: var(--pf-t--global--spacer--md);
66
68
  --pf-v6-c-content--dt--sm--MarginBlockStart: 0;
@@ -237,7 +239,7 @@ ul) {
237
239
  }
238
240
  @media screen and (min-width: 36rem) {
239
241
  :is(.pf-v6-c-content--dl, .pf-v6-c-content dl) {
240
- grid-template: auto/auto 1fr;
242
+ grid-template: auto/var(--pf-v6-c-content--dl--GridTemplateColumns--dt) var(--pf-v6-c-content--dl--GridTemplateColumns--dd);
241
243
  grid-row-gap: var(--pf-v6-c-content--dl--RowGap);
242
244
  grid-column-gap: var(--pf-v6-c-content--dl--ColumnGap);
243
245
  }
package/components/Content/content.scss CHANGED
@@ -86,8 +86,10 @@
86
86
  --#{$content}--list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
87
87
  --#{$content}--list--nested--MarginBlockStart: var(--#{$content}--list--Gap);
88
88
  --#{$content}--ul--ListStyle: var(--pf-t--global--list-style);
89
- --#{$content}--dl--ColumnGap: var(--pf-t--global--spacer--2xl);
90
- --#{$content}--dl--RowGap: var(--pf-t--global--spacer--md);
89
+ --#{$content}--dl--GridTemplateColumns--dt: 12ch;
90
+ --#{$content}--dl--GridTemplateColumns--dd: 1fr;
91
+ --#{$content}--dl--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
92
+ --#{$content}--dl--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
91
93
  --#{$content}--dt--FontWeight: var(--pf-t--global--font--weight--body--bold);
92
94
  --#{$content}--dt--MarginBlockStart: var(--pf-t--global--spacer--md);
93
95
  --#{$content}--dt--sm--MarginBlockStart: 0;
@@ -336,7 +338,7 @@
336
338
  grid-template-columns: 1fr;
337
339
 
338
340
  @media screen and (min-width: $pf-v6-global--breakpoint--sm) {
339
- grid-template: auto / auto 1fr;
341
+ grid-template: auto / var(--#{$content}--dl--GridTemplateColumns--dt) var(--#{$content}--dl--GridTemplateColumns--dd);
340
342
  grid-row-gap: var(--#{$content}--dl--RowGap);
341
343
  grid-column-gap: var(--#{$content}--dl--ColumnGap);
342
344
  }
package/components/Timestamp/timestamp.css CHANGED
@@ -1,10 +1,11 @@
1
1
  :where(:root, .pf-v6-c-timestamp) {
2
2
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
3
- --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
3
+ --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--regular);
4
4
  --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
5
5
  --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
6
6
  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
7
7
  --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
8
+ --pf-v6-c-timestamp--m-help-text--Color: var(--pf-t--global--text--color--subtle);
8
9
  --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
9
10
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
10
11
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
@@ -17,6 +18,7 @@
17
18
  outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
18
19
  }
19
20
  .pf-v6-c-timestamp.pf-m-help-text {
21
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--Color);
20
22
  text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
21
23
  text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
22
24
  cursor: pointer;
package/components/Timestamp/timestamp.scss CHANGED
@@ -2,13 +2,14 @@
2
2
 
3
3
  :where(:root, .#{$timestamp}) {
4
4
  --#{$timestamp}--FontSize: var(--pf-t--global--font--size--body--sm);
5
- --#{$timestamp}--Color: var(--pf-t--global--text--color--subtle);
5
+ --#{$timestamp}--Color: var(--pf-t--global--text--color--regular);
6
6
  --#{$timestamp}--OutlineOffset: #{pf-size-prem(3px)};
7
7
 
8
8
  // Help text variables for the timestamp
9
9
  --#{$timestamp}--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
10
10
  --#{$timestamp}--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
11
11
  --#{$timestamp}--m-help-text--TextUnderlineOffset: #{pf-size-prem(4px)};
12
+ --#{$timestamp}--m-help-text--Color: var(--pf-t--global--text--color--subtle);
12
13
  --#{$timestamp}--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
13
14
  --#{$timestamp}--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
14
15
  --#{$timestamp}--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
@@ -21,6 +22,8 @@
21
22
  outline-offset: var(--#{$timestamp}--OutlineOffset);
22
23
 
23
24
  &.pf-m-help-text {
25
+ --#{$timestamp}--Color: var(--#{$timestamp}--m-help-text--Color);
26
+
24
27
  text-decoration: var(--#{$timestamp}--m-help-text--TextDecorationLine) var(--#{$timestamp}--m-help-text--TextDecorationStyle);
25
28
  text-underline-offset: var(--#{$timestamp}--m-help-text--TextUnderlineOffset);
26
29
  cursor: pointer;
package/components/_index.css CHANGED
@@ -1094,9 +1094,7 @@
1094
1094
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
1095
1095
  --pf-v6-c-banner--link--TextDecoration: underline;
1096
1096
  --pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
1097
- --pf-v6-c-banner--link--hover--FontWeight: var(--pf-t--global--font--weight--body--bold);
1098
- --pf-v6-c-banner--link--disabled--Color: var(--pf-v6-c-banner--Color);
1099
- --pf-v6-c-banner--link--disabled--TextDecoration: none;
1097
+ --pf-v6-c-banner--link--disabled--Color: var(--pf-t--global--text--color--disabled);
1100
1098
  --pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
1101
1099
  --pf-v6-c-banner--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md);
1102
1100
  --pf-v6-c-banner--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
@@ -1208,25 +1206,18 @@
1208
1206
  }
1209
1207
  .pf-v6-c-banner a:hover:not(.pf-m-disabled) {
1210
1208
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
1211
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
1212
1209
  }
1213
1210
  .pf-v6-c-banner a.pf-m-disabled {
1214
1211
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--disabled--Color);
1215
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
1216
1212
  cursor: not-allowed;
1217
1213
  }
1218
1214
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
1219
1215
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-banner--link--Color);
1220
- --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
1216
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
1221
1217
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
1222
1218
  text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
1223
1219
  }
1224
- .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:hover {
1225
- --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
1226
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
1227
- }
1228
1220
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {
1229
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
1230
1221
  cursor: not-allowed;
1231
1222
  }
1232
1223
 
@@ -2998,8 +2989,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2998
2989
  --pf-v6-c-content--list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2999
2990
  --pf-v6-c-content--list--nested--MarginBlockStart: var(--pf-v6-c-content--list--Gap);
3000
2991
  --pf-v6-c-content--ul--ListStyle: var(--pf-t--global--list-style);
3001
- --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--2xl);
3002
- --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--md);
2992
+ --pf-v6-c-content--dl--GridTemplateColumns--dt: 12ch;
2993
+ --pf-v6-c-content--dl--GridTemplateColumns--dd: 1fr;
2994
+ --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
2995
+ --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
3003
2996
  --pf-v6-c-content--dt--FontWeight: var(--pf-t--global--font--weight--body--bold);
3004
2997
  --pf-v6-c-content--dt--MarginBlockStart: var(--pf-t--global--spacer--md);
3005
2998
  --pf-v6-c-content--dt--sm--MarginBlockStart: 0;
@@ -3176,7 +3169,7 @@ ul) {
3176
3169
  }
3177
3170
  @media screen and (min-width: 36rem) {
3178
3171
  :is(.pf-v6-c-content--dl, .pf-v6-c-content dl) {
3179
- grid-template: auto/auto 1fr;
3172
+ grid-template: auto/var(--pf-v6-c-content--dl--GridTemplateColumns--dt) var(--pf-v6-c-content--dl--GridTemplateColumns--dd);
3180
3173
  grid-row-gap: var(--pf-v6-c-content--dl--RowGap);
3181
3174
  grid-column-gap: var(--pf-v6-c-content--dl--ColumnGap);
3182
3175
  }
@@ -18957,11 +18950,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18957
18950
 
18958
18951
  :where(:root, .pf-v6-c-timestamp) {
18959
18952
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
18960
- --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
18953
+ --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--regular);
18961
18954
  --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
18962
18955
  --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
18963
18956
  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
18964
18957
  --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
18958
+ --pf-v6-c-timestamp--m-help-text--Color: var(--pf-t--global--text--color--subtle);
18965
18959
  --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
18966
18960
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
18967
18961
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
@@ -18974,6 +18968,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18974
18968
  outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
18975
18969
  }
18976
18970
  .pf-v6-c-timestamp.pf-m-help-text {
18971
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--Color);
18977
18972
  text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
18978
18973
  text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
18979
18974
  cursor: pointer;
package/docs/components/Timestamp/examples/Timestamp.md CHANGED
@@ -48,6 +48,13 @@ cssPrefix: pf-v6-c-timestamp
48
48
  <time class="pf-v6-c-timestamp__text" datetime="2022-07-21">Tomorrow</time>
49
49
  </span>
50
50
 
51
+ <br />
52
+ <br />
53
+
54
+ <span class="pf-v6-c-timestamp pf-m-help-text">
55
+ <time class="pf-v6-c-timestamp__text" datetime="2022-07-21">Tomorrow</time>
56
+ </span>
57
+
51
58
  ```
52
59
 
53
60
  ## Documentation
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.223",
4
+ "version": "6.0.0-alpha.225",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
package/patternfly-base-no-globals.css CHANGED
@@ -5685,6 +5685,7 @@
5685
5685
  --pf-t--global--transition--timing-function: cubic-bezier(.645, .045, .355, 1);
5686
5686
  --pf-t--global--transition--duration: 250ms;
5687
5687
  --pf-t--global--list-style: disc outside;
5688
+ --pf-t--temp--dev--tbd: #BC11E0;
5688
5689
  }
5689
5690
 
5690
5691
  :where(.pf-v6-theme-dark) {
package/patternfly-base.css CHANGED
@@ -5806,6 +5806,7 @@ button) {
5806
5806
  --pf-t--global--transition--timing-function: cubic-bezier(.645, .045, .355, 1);
5807
5807
  --pf-t--global--transition--duration: 250ms;
5808
5808
  --pf-t--global--list-style: disc outside;
5809
+ --pf-t--temp--dev--tbd: #BC11E0;
5809
5810
  }
5810
5811
 
5811
5812
  :where(.pf-v6-theme-dark) {
package/patternfly-no-globals.css CHANGED
@@ -5686,6 +5686,7 @@
5686
5686
  --pf-t--global--transition--timing-function: cubic-bezier(.645, .045, .355, 1);
5687
5687
  --pf-t--global--transition--duration: 250ms;
5688
5688
  --pf-t--global--list-style: disc outside;
5689
+ --pf-t--temp--dev--tbd: #BC11E0;
5689
5690
  }
5690
5691
 
5691
5692
  :where(.pf-v6-theme-dark) {
@@ -7157,9 +7158,7 @@
7157
7158
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
7158
7159
  --pf-v6-c-banner--link--TextDecoration: underline;
7159
7160
  --pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
7160
- --pf-v6-c-banner--link--hover--FontWeight: var(--pf-t--global--font--weight--body--bold);
7161
- --pf-v6-c-banner--link--disabled--Color: var(--pf-v6-c-banner--Color);
7162
- --pf-v6-c-banner--link--disabled--TextDecoration: none;
7161
+ --pf-v6-c-banner--link--disabled--Color: var(--pf-t--global--text--color--disabled);
7163
7162
  --pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
7164
7163
  --pf-v6-c-banner--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md);
7165
7164
  --pf-v6-c-banner--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
@@ -7271,25 +7270,18 @@
7271
7270
  }
7272
7271
  .pf-v6-c-banner a:hover:not(.pf-m-disabled) {
7273
7272
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
7274
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
7275
7273
  }
7276
7274
  .pf-v6-c-banner a.pf-m-disabled {
7277
7275
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--disabled--Color);
7278
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
7279
7276
  cursor: not-allowed;
7280
7277
  }
7281
7278
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
7282
7279
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-banner--link--Color);
7283
- --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
7280
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
7284
7281
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
7285
7282
  text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
7286
7283
  }
7287
- .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:hover {
7288
- --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
7289
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
7290
- }
7291
7284
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {
7292
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
7293
7285
  cursor: not-allowed;
7294
7286
  }
7295
7287
 
@@ -9061,8 +9053,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
9061
9053
  --pf-v6-c-content--list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9062
9054
  --pf-v6-c-content--list--nested--MarginBlockStart: var(--pf-v6-c-content--list--Gap);
9063
9055
  --pf-v6-c-content--ul--ListStyle: var(--pf-t--global--list-style);
9064
- --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--2xl);
9065
- --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--md);
9056
+ --pf-v6-c-content--dl--GridTemplateColumns--dt: 12ch;
9057
+ --pf-v6-c-content--dl--GridTemplateColumns--dd: 1fr;
9058
+ --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
9059
+ --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
9066
9060
  --pf-v6-c-content--dt--FontWeight: var(--pf-t--global--font--weight--body--bold);
9067
9061
  --pf-v6-c-content--dt--MarginBlockStart: var(--pf-t--global--spacer--md);
9068
9062
  --pf-v6-c-content--dt--sm--MarginBlockStart: 0;
@@ -9239,7 +9233,7 @@ ul) {
9239
9233
  }
9240
9234
  @media screen and (min-width: 36rem) {
9241
9235
  :is(.pf-v6-c-content--dl, .pf-v6-c-content dl) {
9242
- grid-template: auto/auto 1fr;
9236
+ grid-template: auto/var(--pf-v6-c-content--dl--GridTemplateColumns--dt) var(--pf-v6-c-content--dl--GridTemplateColumns--dd);
9243
9237
  grid-row-gap: var(--pf-v6-c-content--dl--RowGap);
9244
9238
  grid-column-gap: var(--pf-v6-c-content--dl--ColumnGap);
9245
9239
  }
@@ -25020,11 +25014,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25020
25014
 
25021
25015
  :where(:root, .pf-v6-c-timestamp) {
25022
25016
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
25023
- --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
25017
+ --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--regular);
25024
25018
  --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
25025
25019
  --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
25026
25020
  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
25027
25021
  --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
25022
+ --pf-v6-c-timestamp--m-help-text--Color: var(--pf-t--global--text--color--subtle);
25028
25023
  --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
25029
25024
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
25030
25025
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
@@ -25037,6 +25032,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25037
25032
  outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
25038
25033
  }
25039
25034
  .pf-v6-c-timestamp.pf-m-help-text {
25035
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--Color);
25040
25036
  text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
25041
25037
  text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
25042
25038
  cursor: pointer;
package/patternfly.css CHANGED
@@ -5807,6 +5807,7 @@ button) {
5807
5807
  --pf-t--global--transition--timing-function: cubic-bezier(.645, .045, .355, 1);
5808
5808
  --pf-t--global--transition--duration: 250ms;
5809
5809
  --pf-t--global--list-style: disc outside;
5810
+ --pf-t--temp--dev--tbd: #BC11E0;
5810
5811
  }
5811
5812
 
5812
5813
  :where(.pf-v6-theme-dark) {
@@ -7278,9 +7279,7 @@ button) {
7278
7279
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
7279
7280
  --pf-v6-c-banner--link--TextDecoration: underline;
7280
7281
  --pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
7281
- --pf-v6-c-banner--link--hover--FontWeight: var(--pf-t--global--font--weight--body--bold);
7282
- --pf-v6-c-banner--link--disabled--Color: var(--pf-v6-c-banner--Color);
7283
- --pf-v6-c-banner--link--disabled--TextDecoration: none;
7282
+ --pf-v6-c-banner--link--disabled--Color: var(--pf-t--global--text--color--disabled);
7284
7283
  --pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
7285
7284
  --pf-v6-c-banner--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md);
7286
7285
  --pf-v6-c-banner--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
@@ -7392,25 +7391,18 @@ button) {
7392
7391
  }
7393
7392
  .pf-v6-c-banner a:hover:not(.pf-m-disabled) {
7394
7393
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
7395
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
7396
7394
  }
7397
7395
  .pf-v6-c-banner a.pf-m-disabled {
7398
7396
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--disabled--Color);
7399
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
7400
7397
  cursor: not-allowed;
7401
7398
  }
7402
7399
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
7403
7400
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-banner--link--Color);
7404
- --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
7401
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
7405
7402
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
7406
7403
  text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
7407
7404
  }
7408
- .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:hover {
7409
- --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
7410
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
7411
- }
7412
7405
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {
7413
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
7414
7406
  cursor: not-allowed;
7415
7407
  }
7416
7408
 
@@ -9182,8 +9174,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
9182
9174
  --pf-v6-c-content--list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9183
9175
  --pf-v6-c-content--list--nested--MarginBlockStart: var(--pf-v6-c-content--list--Gap);
9184
9176
  --pf-v6-c-content--ul--ListStyle: var(--pf-t--global--list-style);
9185
- --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--2xl);
9186
- --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--md);
9177
+ --pf-v6-c-content--dl--GridTemplateColumns--dt: 12ch;
9178
+ --pf-v6-c-content--dl--GridTemplateColumns--dd: 1fr;
9179
+ --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
9180
+ --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
9187
9181
  --pf-v6-c-content--dt--FontWeight: var(--pf-t--global--font--weight--body--bold);
9188
9182
  --pf-v6-c-content--dt--MarginBlockStart: var(--pf-t--global--spacer--md);
9189
9183
  --pf-v6-c-content--dt--sm--MarginBlockStart: 0;
@@ -9360,7 +9354,7 @@ ul) {
9360
9354
  }
9361
9355
  @media screen and (min-width: 36rem) {
9362
9356
  :is(.pf-v6-c-content--dl, .pf-v6-c-content dl) {
9363
- grid-template: auto/auto 1fr;
9357
+ grid-template: auto/var(--pf-v6-c-content--dl--GridTemplateColumns--dt) var(--pf-v6-c-content--dl--GridTemplateColumns--dd);
9364
9358
  grid-row-gap: var(--pf-v6-c-content--dl--RowGap);
9365
9359
  grid-column-gap: var(--pf-v6-c-content--dl--ColumnGap);
9366
9360
  }
@@ -25141,11 +25135,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25141
25135
 
25142
25136
  :where(:root, .pf-v6-c-timestamp) {
25143
25137
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
25144
- --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
25138
+ --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--regular);
25145
25139
  --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
25146
25140
  --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
25147
25141
  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
25148
25142
  --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
25143
+ --pf-v6-c-timestamp--m-help-text--Color: var(--pf-t--global--text--color--subtle);
25149
25144
  --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
25150
25145
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
25151
25146
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
@@ -25158,6 +25153,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25158
25153
  outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
25159
25154
  }
25160
25155
  .pf-v6-c-timestamp.pf-m-help-text {
25156
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--Color);
25161
25157
  text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
25162
25158
  text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
25163
25159
  cursor: pointer;