@patternfly/react-styles 6.0.0-prerelease.4 → 6.0.0-prerelease.5

Sign up to get free protection for your applications and to get access to all the features.
Files changed (96) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/css/components/AboutModalBox/about-modal-box.css +0 -7
  3. package/css/components/Accordion/accordion.css +0 -1
  4. package/css/components/ActionList/action-list.css +1 -2
  5. package/css/components/Alert/alert-group.css +0 -1
  6. package/css/components/Alert/alert.css +0 -1
  7. package/css/components/Avatar/avatar.css +0 -1
  8. package/css/components/BackToTop/back-to-top.css +0 -2
  9. package/css/components/Backdrop/backdrop.css +0 -1
  10. package/css/components/BackgroundImage/background-image.css +0 -1
  11. package/css/components/Badge/badge.css +0 -1
  12. package/css/components/Banner/banner.css +0 -2
  13. package/css/components/Brand/brand.css +0 -1
  14. package/css/components/Breadcrumb/breadcrumb.css +0 -1
  15. package/css/components/Button/button.css +0 -1
  16. package/css/components/CalendarMonth/calendar-month.css +0 -1
  17. package/css/components/Card/card.css +0 -1
  18. package/css/components/Check/check.css +0 -1
  19. package/css/components/ClipboardCopy/clipboard-copy.css +0 -1
  20. package/css/components/CodeBlock/code-block.css +0 -1
  21. package/css/components/CodeEditor/code-editor.css +0 -1
  22. package/css/components/Content/content.css +2 -3
  23. package/css/components/DataList/data-list.css +0 -3
  24. package/css/components/DatePicker/date-picker.css +0 -1
  25. package/css/components/DescriptionList/description-list.css +2 -9
  26. package/css/components/Divider/divider.css +0 -1
  27. package/css/components/DragDrop/drag-drop.css +0 -2
  28. package/css/components/Drawer/drawer.css +5 -4
  29. package/css/components/Drawer/drawer.d.ts +1 -1
  30. package/css/components/Drawer/drawer.js +1 -1
  31. package/css/components/Drawer/drawer.mjs +1 -1
  32. package/css/components/DualListSelector/dual-list-selector.css +0 -1
  33. package/css/components/EmptyState/empty-state.css +1 -2
  34. package/css/components/ExpandableSection/expandable-section.css +0 -1
  35. package/css/components/FileUpload/file-upload.css +0 -1
  36. package/css/components/Form/form.css +1 -2
  37. package/css/components/FormControl/form-control.css +9 -6
  38. package/css/components/HelperText/helper-text.css +0 -1
  39. package/css/components/Hint/hint.css +0 -1
  40. package/css/components/Icon/icon.css +0 -1
  41. package/css/components/InlineEdit/inline-edit.css +0 -1
  42. package/css/components/InputGroup/input-group.css +0 -1
  43. package/css/components/JumpLinks/jump-links.css +0 -1
  44. package/css/components/Label/label-group.css +0 -1
  45. package/css/components/Label/label.css +0 -1
  46. package/css/components/List/list.css +0 -1
  47. package/css/components/Login/login.css +0 -9
  48. package/css/components/Masthead/masthead.css +0 -1
  49. package/css/components/Menu/menu.css +0 -1
  50. package/css/components/MenuToggle/menu-toggle.css +0 -1
  51. package/css/components/ModalBox/modal-box.css +0 -2
  52. package/css/components/MultipleFileUpload/multiple-file-upload.css +0 -1
  53. package/css/components/Nav/nav.css +0 -1
  54. package/css/components/NotificationDrawer/notification-drawer.css +0 -1
  55. package/css/components/NumberInput/number-input.css +0 -1
  56. package/css/components/OverflowMenu/overflow-menu.css +0 -1
  57. package/css/components/Page/page.css +0 -2
  58. package/css/components/Pagination/pagination.css +0 -3
  59. package/css/components/Panel/panel.css +0 -1
  60. package/css/components/Popover/popover.css +0 -1
  61. package/css/components/Progress/progress.css +0 -1
  62. package/css/components/ProgressStepper/progress-stepper.css +0 -2
  63. package/css/components/Radio/radio.css +0 -1
  64. package/css/components/Sidebar/sidebar.css +0 -1
  65. package/css/components/SimpleList/simple-list.css +0 -1
  66. package/css/components/Skeleton/skeleton.css +0 -1
  67. package/css/components/SkipToContent/skip-to-content.css +0 -1
  68. package/css/components/Slider/slider.css +0 -1
  69. package/css/components/Spinner/spinner.css +0 -1
  70. package/css/components/Switch/switch.css +0 -1
  71. package/css/components/TabContent/tab-content.css +0 -1
  72. package/css/components/Table/table-grid.css +0 -1
  73. package/css/components/Table/table-scrollable.css +0 -1
  74. package/css/components/Table/table-tree-view.css +0 -1
  75. package/css/components/Table/table.css +0 -1
  76. package/css/components/Tabs/tabs.css +0 -1
  77. package/css/components/TextInputGroup/text-input-group.css +2 -3
  78. package/css/components/Tile/tile.css +0 -1
  79. package/css/components/Timestamp/timestamp.css +0 -1
  80. package/css/components/Title/title.css +0 -1
  81. package/css/components/ToggleGroup/toggle-group.css +0 -1
  82. package/css/components/Toolbar/toolbar.css +0 -1
  83. package/css/components/Tooltip/tooltip.css +0 -1
  84. package/css/components/TreeView/tree-view.css +0 -1
  85. package/css/components/Truncate/truncate.css +0 -1
  86. package/css/components/Wizard/wizard.css +0 -2
  87. package/css/components/_index.css +23 -130
  88. package/css/layouts/Bullseye/bullseye.css +0 -1
  89. package/css/layouts/Flex/flex.css +0 -1
  90. package/css/layouts/Gallery/gallery.css +0 -1
  91. package/css/layouts/Grid/grid.css +0 -1
  92. package/css/layouts/Level/level.css +0 -1
  93. package/css/layouts/Split/split.css +0 -1
  94. package/css/layouts/Stack/stack.css +0 -1
  95. package/css/layouts/_index.css +0 -7
  96. package/package.json +3 -3
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-multiple-file-upload {
3
2
  --pf-v6-c-multiple-file-upload--GridTemplateColumns: 1fr;
4
3
  --pf-v6-c-multiple-file-upload--Gap: var(--pf-t--global--spacer--md);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-nav {
3
2
  --pf-v6-c-nav__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
4
3
  --pf-v6-c-nav__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-notification-drawer {
3
2
  --pf-v6-c-notification-drawer--BackgroundColor: var(--pf-t--global--background--color--floating--default);
4
3
  --pf-v6-c-notification-drawer__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-number-input {
3
2
  --pf-v6-c-number-input__unit--c-input-group--MarginInlineStart: var(--pf-t--global--spacer--sm);
4
3
  --pf-v6-c-number-input__icon--FontSize: var(--pf-t--global--font--size--xs);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-overflow-menu {
3
2
  --pf-v6-c-overflow-menu--ColumnGap: var(--pf-t--global--spacer--md);
4
3
  --pf-v6-c-overflow-menu__group--ColumnGap: var(--pf-t--global--spacer--md);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-page {
3
2
  --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
4
3
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
@@ -80,7 +79,6 @@
80
79
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
81
80
  }
82
81
  @media screen and (min-width: 75rem) {
83
- :root,
84
82
  .pf-v6-c-page {
85
83
  --pf-v6-c-page__sidebar--TranslateX: var(--pf-v6-c-page__sidebar--xl--TranslateX);
86
84
  }
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-pagination {
3
2
  --pf-v6-c-pagination--inset: 0;
4
3
  --pf-v6-c-pagination--ColumnGap: var(--pf-t--global--spacer--lg);
@@ -37,7 +36,6 @@
37
36
  --pf-v6-c-pagination__page-menu--md--Display: var(--pf-v6-c-pagination__page-menu--Display--base);
38
37
  }
39
38
  @media screen and (min-width: 48rem) {
40
- :root,
41
39
  .pf-v6-c-pagination {
42
40
  --pf-v6-c-pagination--m-bottom--BoxShadow: none;
43
41
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination__page-menu--md--Display);
@@ -46,7 +44,6 @@
46
44
  }
47
45
  }
48
46
  @media screen and (min-width: 75rem) {
49
- :root,
50
47
  .pf-v6-c-pagination {
51
48
  --pf-v6-c-pagination__scroll-button--Width: var(--pf-v6-c-pagination__scroll-button--xl--Width);
52
49
  }
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-panel {
3
2
  --pf-v6-c-panel--Width: auto;
4
3
  --pf-v6-c-panel--MinWidth: auto;
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-popover {
3
2
  --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
4
3
  --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-progress {
3
2
  --pf-v6-c-progress--GridGap: var(--pf-t--global--spacer--md);
4
3
  --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-progress-stepper {
3
2
  --pf-v6-c-progress-stepper--m-vertical--GridAutoFlow: row;
4
3
  --pf-v6-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
@@ -120,7 +119,6 @@
120
119
  --pf-v6-c-progress-stepper--m-center__step-main--before--Content: "";
121
120
  }
122
121
  @media screen and (min-width: 48rem) {
123
- :root,
124
122
  .pf-v6-c-progress-stepper {
125
123
  --pf-v6-c-progress-stepper--GridAutoFlow: var(--pf-v6-c-progress-stepper--m-horizontal--GridAutoFlow);
126
124
  --pf-v6-c-progress-stepper--GridTemplateColumns: var(--pf-v6-c-progress-stepper--m-horizontal--GridTemplateColumns);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-radio {
3
2
  --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
4
3
  --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-sidebar {
3
2
  --pf-v6-c-sidebar--inset: var(--pf-t--global--spacer--md);
4
3
  --pf-v6-c-sidebar--xl--inset: var(--pf-t--global--spacer--lg);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-simple-list {
3
2
  --pf-v6-c-simple-list__item-link--PaddingBlockStart: var(--pf-t--global--spacer--xs);
4
3
  --pf-v6-c-simple-list__item-link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -1,5 +1,4 @@
1
1
  @charset "UTF-8";
2
- :root,
3
2
  .pf-v6-c-skeleton {
4
3
  --pf-v6-c-skeleton--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
5
4
  --pf-v6-c-skeleton--Width: auto;
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-skip-to-content {
3
2
  --pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
4
3
  --pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-slider {
3
2
  --pf-v6-c-slider--value: 0;
4
3
  --pf-v6-c-slider__step--InsetInlineStart: 0;
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-spinner {
3
2
  --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
4
3
  --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-switch {
3
2
  --pf-v6-c-switch--FontSize: var(--pf-t--global--font--size--sm);
4
3
  --pf-v6-c-switch--ColumnGap: var(--pf-t--global--spacer--sm);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-tab-content {
3
2
  --pf-v6-c-tab-content__body--PaddingBlockStart: 0;
4
3
  --pf-v6-c-tab-content__body--PaddingInlineEnd: 0;
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-table {
3
2
  --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
4
3
  --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-table {
3
2
  --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
4
3
  --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-table {
3
2
  --pf-v6-c-table__tree-view-main--indent--base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-table__tree-view-icon--MinWidth));
4
3
  --pf-v6-c-table__tree-view-main--nested-indent--base: calc(var(--pf-v6-c-table__tree-view-main--indent--base) - var(--pf-t--global--spacer--md));
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-table {
3
2
  --pf-v6-c-table--BackgroundColor: var(--pf-t--global--background--color--primary--default);
4
3
  --pf-v6-c-table--BorderColor: var(--pf-t--global--border--color--default);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-tabs {
3
2
  --pf-v6-c-tabs--inset: 0;
4
3
  --pf-v6-c-tabs--Width: auto;
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-text-input-group {
3
2
  --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
4
3
  --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
@@ -40,9 +39,9 @@
40
39
  --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
41
40
  --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
42
41
  --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
43
- --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
42
+ --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
44
43
  --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
45
- --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--disabled);
44
+ --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
46
45
  --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
47
46
  --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
48
47
  --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-tile {
3
2
  --pf-v6-c-tile--PaddingBlockStart: var(--pf-t--global--spacer--lg);
4
3
  --pf-v6-c-tile--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-timestamp {
3
2
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
4
3
  --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--regular);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-title {
3
2
  --pf-v6-c-title--FontFamily: var(--pf-t--global--font--family--heading);
4
3
  --pf-v6-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-toggle-group {
3
2
  --pf-v6-c-toggle-group__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
4
3
  --pf-v6-c-toggle-group__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-toolbar {
3
2
  --pf-v6-c-toolbar--RowGap: var(--pf-t--global--spacer--md);
4
3
  --pf-v6-c-toolbar--PaddingBlockStart: 0;
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-tooltip {
3
2
  --pf-v6-c-tooltip--MaxWidth: 18.75rem;
4
3
  --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-tree-view {
3
2
  --pf-v6-c-tree-view__node--indent--base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-tree-view__node-toggle-icon--MinWidth));
4
3
  --pf-v6-c-tree-view__node--nested-indent--base: calc(var(--pf-v6-c-tree-view__node--indent--base) - var(--pf-t--global--spacer--md));
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-truncate {
3
2
  --pf-v6-c-truncate--MinWidth: 6ch;
4
3
  --pf-v6-c-truncate__start--MinWidth: 6ch;
@@ -1,4 +1,3 @@
1
- :root,
2
1
  .pf-v6-c-wizard {
3
2
  --pf-v6-c-wizard--Height: initial;
4
3
  --pf-v6-c-wizard--Height--base: 100%;
@@ -115,7 +114,6 @@
115
114
  --pf-v6-c-wizard__footer--BorderBlockStartColor: var(--pf-t--global--border--color--default);
116
115
  }
117
116
  @media screen and (min-width: 62rem) {
118
- :root,
119
117
  .pf-v6-c-wizard {
120
118
  --pf-v6-c-wizard__nav--Width: var(--pf-v6-c-wizard__nav--lg--Width);
121
119
  --pf-v6-c-wizard__nav--BoxShadow: none;