@patternfly/patternfly 6.0.0-alpha.84 → 6.0.0-alpha.85

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 (31) hide show
  1. package/components/Accordion/accordion.css +1 -1
  2. package/components/Accordion/accordion.scss +1 -1
  3. package/components/Button/button.css +21 -21
  4. package/components/Button/button.scss +21 -21
  5. package/components/DataList/data-list.css +1 -1
  6. package/components/DataList/data-list.scss +1 -1
  7. package/components/Form/form.css +3 -7
  8. package/components/Form/form.scss +3 -7
  9. package/components/FormControl/form-control.css +3 -3
  10. package/components/FormControl/form-control.scss +3 -3
  11. package/components/Login/login.css +2 -24
  12. package/components/Login/login.scss +2 -29
  13. package/components/NotificationBadge/notification-badge.css +4 -4
  14. package/components/NotificationBadge/notification-badge.scss +4 -4
  15. package/components/Pagination/pagination.css +1 -1
  16. package/components/Pagination/pagination.scss +1 -1
  17. package/components/Table/table-grid.css +3 -3
  18. package/components/Table/table-grid.scss +3 -3
  19. package/components/Table/table-tree-view.css +5 -5
  20. package/components/Table/table-tree-view.scss +1 -1
  21. package/components/Table/table.css +8 -8
  22. package/components/Table/table.scss +8 -8
  23. package/components/Tabs/tabs.css +1 -1
  24. package/components/Tabs/tabs.scss +1 -1
  25. package/docs/components/Login/examples/Login.md +150 -100
  26. package/package.json +1 -1
  27. package/patternfly-no-globals.css +53 -79
  28. package/patternfly-theme-dark-unversioned.css +53 -79
  29. package/patternfly.css +53 -79
  30. package/patternfly.min.css +1 -1
  31. package/patternfly.min.css.map +1 -1
package/components/Table/table.css CHANGED
@@ -151,7 +151,7 @@
151
151
  --pf-v5-c-table__expandable-row--after--Bottom: calc(var(--pf-v5-c-table--border-width--base) * -1);
152
152
  --pf-v5-c-table__expandable-row--after--border-width--base: var(--pf-t--global--border--width--strong);
153
153
  --pf-v5-c-table__expandable-row--after--BorderLeftWidth: 0;
154
- --pf-v5-c-table__expandable-row--after--BorderColor: var(--pf-t--global--border--color--active);
154
+ --pf-v5-c-table__expandable-row--after--BorderColor: var(--pf-t--global--border--color--clicked);
155
155
  --pf-v5-c-table__icon-inline--MarginRight: var(--pf-t--global--spacer--sm);
156
156
  --pf-v5-c-table__sort--MinWidth: calc(6ch + var(--pf-v5-c-table--cell--PaddingRight) + var(--pf-v5-c-table--cell--PaddingLeft) + var(--pf-v5-c-table__sort-indicator--MarginLeft));
157
157
  --pf-v5-c-table__sort__button--PaddingTop: var(--pf-t--global--spacer--control--vertical);
@@ -162,7 +162,7 @@
162
162
  --pf-v5-c-table__sort__button--MarginBottom: calc(var(--pf-v5-c-table__sort__button--PaddingBottom) * -1);
163
163
  --pf-v5-c-table__sort__button--MarginLeft: calc(var(--pf-v5-c-table__sort__button--PaddingLeft) * -1);
164
164
  --pf-v5-c-table__sort__button--Color: var(--pf-t--global--text--color--regular);
165
- --pf-v5-c-table__sort--m-selected__button--Color: var(--pf-t--global--border--color--active);
165
+ --pf-v5-c-table__sort--m-selected__button--Color: var(--pf-t--global--border--color--clicked);
166
166
  --pf-v5-c-table__sort--m-help--MinWidth: 15ch;
167
167
  --pf-v5-c-table__sort__button__text--Color: currentcolor;
168
168
  --pf-v5-c-table__sort__button--hover__text--Color: currentcolor;
@@ -170,7 +170,7 @@
170
170
  --pf-v5-c-table__sort__button--active__text--Color: currentcolor;
171
171
  --pf-v5-c-table__sort-indicator--Color: var(--pf-t--global--icon--color--subtle);
172
172
  --pf-v5-c-table__sort-indicator--MarginLeft: var(--pf-t--global--spacer--md);
173
- --pf-v5-c-table__sort--m-selected__sort-indicator--Color: var(--pf-t--global--border--color--active);
173
+ --pf-v5-c-table__sort--m-selected__sort-indicator--Color: var(--pf-t--global--border--color--clicked);
174
174
  --pf-v5-c-table__sort__button--hover__sort-indicator--Color: var(--pf-t--global--text--color--regular);
175
175
  --pf-v5-c-table__sort__button--active__sort-indicator--Color: var(--pf-t--global--text--color--regular);
176
176
  --pf-v5-c-table__sort__button--focus__sort-indicator--Color: var(--pf-t--global--text--color--regular);
@@ -184,7 +184,7 @@
184
184
  --pf-v5-c-table__compound-expansion-toggle__button--Color: var(--pf-t--global--icon--color--brand--default);
185
185
  --pf-v5-c-table__compound-expansion-toggle__button--hover--Color: var(--pf-t--global--icon--color--brand--hover);
186
186
  --pf-v5-c-table__compound-expansion-toggle__button--focus--Color: var(--pf-t--global--icon--color--brand--hover);
187
- --pf-v5-c-table__compound-expansion-toggle__button--active--Color: var(--pf-t--global--icon--color--brand--active);
187
+ --pf-v5-c-table__compound-expansion-toggle__button--active--Color: var(--pf-t--global--icon--color--brand--clicked);
188
188
  --pf-v5-c-table__compound-expansion-toggle__button--before--border-width--base: var(--pf-t--global--border--width--button--default);
189
189
  --pf-v5-c-table__compound-expansion-toggle__button--before--BorderColor: var(--pf-t--global--border--color--default);
190
190
  --pf-v5-c-table__compound-expansion-toggle__button--before--BorderRightWidth: 0;
@@ -192,7 +192,7 @@
192
192
  --pf-v5-c-table__compound-expansion-toggle__button--before--Bottom: calc(var(--pf-v5-c-table__compound-expansion-toggle__button--before--border-width--base) * -1);
193
193
  --pf-v5-c-table__compound-expansion-toggle__button--before--Left: calc(var(--pf-v5-c-table__compound-expansion-toggle__button--before--border-width--base) * -1);
194
194
  --pf-v5-c-table__compound-expansion-toggle__button--after--border-width--base: var(--pf-t--global--border--width--strong);
195
- --pf-v5-c-table__compound-expansion-toggle__button--after--BorderColor: var(--pf-t--global--border--color--active);
195
+ --pf-v5-c-table__compound-expansion-toggle__button--after--BorderColor: var(--pf-t--global--border--color--clicked);
196
196
  --pf-v5-c-table__compound-expansion-toggle__button--after--BorderTopWidth: 0;
197
197
  --pf-v5-c-table__compound-expansion-toggle__button--after--Top: calc(var(--pf-v5-c-table__compound-expansion-toggle__button--before--border-width--base) * -1);
198
198
  --pf-v5-c-table__compound-expansion-toggle__button--after--Left: calc(var(--pf-v5-c-table__compound-expansion-toggle__button--before--border-width--base) * -1);
@@ -221,7 +221,7 @@
221
221
  --pf-v5-c-table__tr--m-clickable--focus--BoxShadow: var(--pf-v5-c-table__tr--m-clickable--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
222
222
  --pf-v5-c-table__tr--m-clickable--focus--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
223
223
  --pf-v5-c-table__tr--m-clickable--active--BoxShadow: var(--pf-v5-c-table__tr--m-clickable--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
224
- --pf-v5-c-table__tr--m-clickable--active--BackgroundColor: var(--pf-t--global--background--color--primary--selected);
224
+ --pf-v5-c-table__tr--m-clickable--active--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
225
225
  --pf-v5-c-table__tr--m-clickable--m-selected--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom) inset, var(--pf-t--global--box-shadow--sm--bottom);
226
226
  --pf-v5-c-table__tr--m-selected--BoxShadow--top: var(--pf-v5-c-table__tr--BoxShadow--top--base);
227
227
  --pf-v5-c-table__tr--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
@@ -242,14 +242,14 @@
242
242
  --pf-v5-c-table__tbody--m-clickable--focus--BackgroundColor: var(--pf-t--global--background--color--primary--default);
243
243
  --pf-v5-c-table__tbody--m-clickable--active--BoxShadow: var(--pf-v5-c-table__tbody--m-clickable--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
244
244
  --pf-v5-c-table__tbody--m-clickable--active--BackgroundColor: var(--pf-t--global--background--color--primary--default);
245
- --pf-v5-c-table__tbody--m-clickable--m-expanded--BorderColor: var(--pf-t--global--border--color--active);
245
+ --pf-v5-c-table__tbody--m-clickable--m-expanded--BorderColor: var(--pf-t--global--border--color--clicked);
246
246
  --pf-v5-c-table__tbody--m-clickable--m-selected--hover__tr--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom) inset, var(--pf-t--global--box-shadow--sm--bottom);
247
247
  --pf-v5-c-table__tbody--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--default);
248
248
  --pf-v5-c-table__tbody--m-selected--BoxShadow--top: var(--pf-v5-c-table__tr--BoxShadow--top--base);
249
249
  --pf-v5-c-table__tbody--m-selected--BoxShadow: var(--pf-v5-c-table__tbody--m-selected--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
250
250
  --pf-v5-c-table__tbody--m-selected--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
251
251
  --pf-v5-c-table__tbody--m-selected--after--BorderLeftWidth: calc(2 * var(--pf-v5-c-table__expandable-row--after--border-width--base));
252
- --pf-v5-c-table__tbody--m-selected--after--BorderLeftColor: var(--pf-t--global--border--color--active);
252
+ --pf-v5-c-table__tbody--m-selected--after--BorderLeftColor: var(--pf-t--global--border--color--clicked);
253
253
  --pf-v5-c-table__tbody--m-selected--m-selected--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
254
254
  --pf-v5-c-table__tbody--m-selected--hover__tbody--m-selected--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom) inset, var(--pf-t--global--box-shadow--sm--bottom);
255
255
  --pf-v5-c-table__tbody--m-selected__tbody--m-selected--hover--BoxShadow: var(--pf-v5-c-table__tr--m-selected--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
package/components/Table/table.scss CHANGED
@@ -150,7 +150,7 @@
150
150
  --#{$table}__expandable-row--after--Bottom: calc(var(--#{$table}--border-width--base) * -1);
151
151
  --#{$table}__expandable-row--after--border-width--base: var(--pf-t--global--border--width--strong);
152
152
  --#{$table}__expandable-row--after--BorderLeftWidth: 0;
153
- --#{$table}__expandable-row--after--BorderColor: var(--pf-t--global--border--color--active);
153
+ --#{$table}__expandable-row--after--BorderColor: var(--pf-t--global--border--color--clicked);
154
154
 
155
155
  // Icon inline
156
156
  --#{$table}__icon-inline--MarginRight: var(--pf-t--global--spacer--sm);
@@ -167,7 +167,7 @@
167
167
  --#{$table}__sort__button--MarginBottom: calc(var(--#{$table}__sort__button--PaddingBottom) * -1);
168
168
  --#{$table}__sort__button--MarginLeft: calc(var(--#{$table}__sort__button--PaddingLeft) * -1);
169
169
  --#{$table}__sort__button--Color: var(--pf-t--global--text--color--regular);
170
- --#{$table}__sort--m-selected__button--Color: var(--pf-t--global--border--color--active);
170
+ --#{$table}__sort--m-selected__button--Color: var(--pf-t--global--border--color--clicked);
171
171
  --#{$table}__sort--m-help--MinWidth: 15ch;
172
172
 
173
173
  // Sort text
@@ -179,7 +179,7 @@
179
179
  // Sort indicator
180
180
  --#{$table}__sort-indicator--Color: var(--pf-t--global--icon--color--subtle);
181
181
  --#{$table}__sort-indicator--MarginLeft: var(--pf-t--global--spacer--md);
182
- --#{$table}__sort--m-selected__sort-indicator--Color: var(--pf-t--global--border--color--active);
182
+ --#{$table}__sort--m-selected__sort-indicator--Color: var(--pf-t--global--border--color--clicked);
183
183
  --#{$table}__sort__button--hover__sort-indicator--Color: var(--pf-t--global--text--color--regular);
184
184
  --#{$table}__sort__button--active__sort-indicator--Color: var(--pf-t--global--text--color--regular);
185
185
  --#{$table}__sort__button--focus__sort-indicator--Color: var(--pf-t--global--text--color--regular);
@@ -199,7 +199,7 @@
199
199
  --#{$table}__compound-expansion-toggle__button--Color: var(--pf-t--global--icon--color--brand--default);
200
200
  --#{$table}__compound-expansion-toggle__button--hover--Color: var(--pf-t--global--icon--color--brand--hover);
201
201
  --#{$table}__compound-expansion-toggle__button--focus--Color: var(--pf-t--global--icon--color--brand--hover);
202
- --#{$table}__compound-expansion-toggle__button--active--Color: var(--pf-t--global--icon--color--brand--active);
202
+ --#{$table}__compound-expansion-toggle__button--active--Color: var(--pf-t--global--icon--color--brand--clicked);
203
203
 
204
204
  // ::before border treatment
205
205
  --#{$table}__compound-expansion-toggle__button--before--border-width--base: var(--pf-t--global--border--width--button--default);
@@ -211,7 +211,7 @@
211
211
 
212
212
  // ::before border treatment
213
213
  --#{$table}__compound-expansion-toggle__button--after--border-width--base: var(--pf-t--global--border--width--strong);
214
- --#{$table}__compound-expansion-toggle__button--after--BorderColor: var(--pf-t--global--border--color--active);
214
+ --#{$table}__compound-expansion-toggle__button--after--BorderColor: var(--pf-t--global--border--color--clicked);
215
215
  --#{$table}__compound-expansion-toggle__button--after--BorderTopWidth: 0;
216
216
  --#{$table}__compound-expansion-toggle__button--after--Top: calc(var(--#{$table}__compound-expansion-toggle__button--before--border-width--base) * -1);
217
217
  --#{$table}__compound-expansion-toggle__button--after--Left: calc(var(--#{$table}__compound-expansion-toggle__button--before--border-width--base) * -1);
@@ -250,7 +250,7 @@
250
250
  --#{$table}__tr--m-clickable--focus--BoxShadow: var(--#{$table}__tr--m-clickable--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
251
251
  --#{$table}__tr--m-clickable--focus--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
252
252
  --#{$table}__tr--m-clickable--active--BoxShadow: var(--#{$table}__tr--m-clickable--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
253
- --#{$table}__tr--m-clickable--active--BackgroundColor: var(--pf-t--global--background--color--primary--selected);
253
+ --#{$table}__tr--m-clickable--active--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
254
254
  --#{$table}__tr--m-clickable--m-selected--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom) inset, var(--pf-t--global--box-shadow--sm--bottom);
255
255
 
256
256
  // tr selected
@@ -275,7 +275,7 @@
275
275
  --#{$table}__tbody--m-clickable--focus--BackgroundColor: var(--pf-t--global--background--color--primary--default);
276
276
  --#{$table}__tbody--m-clickable--active--BoxShadow: var(--#{$table}__tbody--m-clickable--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
277
277
  --#{$table}__tbody--m-clickable--active--BackgroundColor: var(--pf-t--global--background--color--primary--default);
278
- --#{$table}__tbody--m-clickable--m-expanded--BorderColor: var(--pf-t--global--border--color--active);
278
+ --#{$table}__tbody--m-clickable--m-expanded--BorderColor: var(--pf-t--global--border--color--clicked);
279
279
  --#{$table}__tbody--m-clickable--m-selected--hover__tr--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom) inset, var(--pf-t--global--box-shadow--sm--bottom);
280
280
 
281
281
  // tbody selected
@@ -284,7 +284,7 @@
284
284
  --#{$table}__tbody--m-selected--BoxShadow: var(--#{$table}__tbody--m-selected--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
285
285
  --#{$table}__tbody--m-selected--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
286
286
  --#{$table}__tbody--m-selected--after--BorderLeftWidth: calc(2 * var(--#{$table}__expandable-row--after--border-width--base));
287
- --#{$table}__tbody--m-selected--after--BorderLeftColor: var(--pf-t--global--border--color--active);
287
+ --#{$table}__tbody--m-selected--after--BorderLeftColor: var(--pf-t--global--border--color--clicked);
288
288
  --#{$table}__tbody--m-selected--m-selected--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
289
289
  --#{$table}__tbody--m-selected--hover__tbody--m-selected--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom) inset, var(--pf-t--global--box-shadow--sm--bottom);
290
290
  --#{$table}__tbody--m-selected__tbody--m-selected--hover--BoxShadow: var(--#{$table}__tr--m-selected--BoxShadow--top), var(--pf-t--global--box-shadow--sm--bottom);
package/components/Tabs/tabs.css CHANGED
@@ -132,7 +132,7 @@
132
132
  --pf-v5-c-tabs__link-toggle-icon--Color: var(--pf-t--global--icon--color--regular);
133
133
  --pf-v5-c-tabs__link-toggle-icon--Transition: .2s ease-in 0s;
134
134
  --pf-v5-c-tabs__link-toggle-icon--Rotate: 0;
135
- --pf-v5-c-tabs__link-toggle-icon--FontSize: var(--pf-t--global--FontSize--sm);
135
+ --pf-v5-c-tabs__link-toggle-icon--FontSize: var(--pf-t--global--font--size--sm);
136
136
  --pf-v5-c-tabs__link--m-expanded__toggle-icon--Rotate: 90deg;
137
137
  }
138
138
 
package/components/Tabs/tabs.scss CHANGED
@@ -166,7 +166,7 @@ $pf-v5-c-tabs--spacer-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl
166
166
  --#{$tabs}__link-toggle-icon--Color: var(--pf-t--global--icon--color--regular);
167
167
  --#{$tabs}__link-toggle-icon--Transition: .2s ease-in 0s;
168
168
  --#{$tabs}__link-toggle-icon--Rotate: 0;
169
- --#{$tabs}__link-toggle-icon--FontSize: var(--pf-t--global--FontSize--sm);
169
+ --#{$tabs}__link-toggle-icon--FontSize: var(--pf-t--global--font--size--sm);
170
170
  --#{$tabs}__link--m-expanded__toggle-icon--Rotate: 90deg;
171
171
  }
172
172