@patternfly/react-styles 6.0.0-prerelease.3 → 6.0.0-prerelease.5
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +10 -0
- package/css/components/AboutModalBox/about-modal-box.css +0 -7
- package/css/components/Accordion/accordion.css +0 -1
- package/css/components/ActionList/action-list.css +1 -2
- package/css/components/Alert/alert-group.css +0 -1
- package/css/components/Alert/alert.css +0 -1
- package/css/components/Avatar/avatar.css +0 -1
- package/css/components/BackToTop/back-to-top.css +0 -2
- package/css/components/Backdrop/backdrop.css +0 -1
- package/css/components/BackgroundImage/background-image.css +0 -1
- package/css/components/Badge/badge.css +0 -1
- package/css/components/Banner/banner.css +0 -2
- package/css/components/Brand/brand.css +0 -1
- package/css/components/Breadcrumb/breadcrumb.css +0 -1
- package/css/components/Button/button.css +2 -3
- package/css/components/CalendarMonth/calendar-month.css +0 -1
- package/css/components/Card/card.css +0 -1
- package/css/components/Check/check.css +2 -3
- package/css/components/ClipboardCopy/clipboard-copy.css +0 -1
- package/css/components/CodeBlock/code-block.css +0 -1
- package/css/components/CodeEditor/code-editor.css +0 -1
- package/css/components/Content/content.css +2 -3
- package/css/components/DataList/data-list.css +0 -3
- package/css/components/DatePicker/date-picker.css +0 -1
- package/css/components/DescriptionList/description-list.css +2 -9
- package/css/components/Divider/divider.css +0 -1
- package/css/components/DragDrop/drag-drop.css +0 -2
- package/css/components/Drawer/drawer.css +5 -4
- package/css/components/Drawer/drawer.d.ts +1 -1
- package/css/components/Drawer/drawer.js +1 -1
- package/css/components/Drawer/drawer.mjs +1 -1
- package/css/components/DualListSelector/dual-list-selector.css +0 -1
- package/css/components/EmptyState/empty-state.css +1 -2
- package/css/components/ExpandableSection/expandable-section.css +0 -1
- package/css/components/FileUpload/file-upload.css +0 -1
- package/css/components/Form/form.css +1 -2
- package/css/components/FormControl/form-control.css +9 -6
- package/css/components/HelperText/helper-text.css +0 -1
- package/css/components/Hint/hint.css +0 -1
- package/css/components/Icon/icon.css +0 -1
- package/css/components/InlineEdit/inline-edit.css +0 -1
- package/css/components/InputGroup/input-group.css +0 -1
- package/css/components/JumpLinks/jump-links.css +0 -1
- package/css/components/Label/label-group.css +0 -1
- package/css/components/Label/label.css +0 -1
- package/css/components/List/list.css +0 -1
- package/css/components/Login/login.css +0 -9
- package/css/components/Masthead/masthead.css +0 -1
- package/css/components/Menu/menu.css +0 -1
- package/css/components/MenuToggle/menu-toggle.css +2 -3
- package/css/components/ModalBox/modal-box.css +0 -2
- package/css/components/MultipleFileUpload/multiple-file-upload.css +0 -1
- package/css/components/Nav/nav.css +0 -1
- package/css/components/NotificationDrawer/notification-drawer.css +0 -1
- package/css/components/NumberInput/number-input.css +0 -1
- package/css/components/OverflowMenu/overflow-menu.css +0 -1
- package/css/components/Page/page.css +4 -2
- package/css/components/Pagination/pagination.css +1 -4
- package/css/components/Panel/panel.css +0 -1
- package/css/components/Popover/popover.css +0 -1
- package/css/components/Progress/progress.css +0 -1
- package/css/components/ProgressStepper/progress-stepper.css +0 -2
- package/css/components/Radio/radio.css +2 -3
- package/css/components/Sidebar/sidebar.css +0 -1
- package/css/components/SimpleList/simple-list.css +0 -1
- package/css/components/Skeleton/skeleton.css +0 -1
- package/css/components/SkipToContent/skip-to-content.css +0 -1
- package/css/components/Slider/slider.css +1 -2
- package/css/components/Spinner/spinner.css +0 -1
- package/css/components/Switch/switch.css +0 -1
- package/css/components/TabContent/tab-content.css +0 -1
- package/css/components/Table/table-grid.css +0 -1
- package/css/components/Table/table-scrollable.css +0 -1
- package/css/components/Table/table-tree-view.css +0 -1
- package/css/components/Table/table.css +0 -1
- package/css/components/Tabs/tabs.css +0 -1
- package/css/components/TextInputGroup/text-input-group.css +2 -3
- package/css/components/Tile/tile.css +0 -1
- package/css/components/Timestamp/timestamp.css +0 -1
- package/css/components/Title/title.css +0 -1
- package/css/components/ToggleGroup/toggle-group.css +0 -1
- package/css/components/Toolbar/toolbar.css +0 -1
- package/css/components/Tooltip/tooltip.css +0 -1
- package/css/components/TreeView/tree-view.css +0 -1
- package/css/components/Truncate/truncate.css +0 -1
- package/css/components/Wizard/wizard.css +0 -2
- package/css/components/_index.css +37 -140
- package/css/layouts/Bullseye/bullseye.css +0 -1
- package/css/layouts/Flex/flex.css +0 -1
- package/css/layouts/Gallery/gallery.css +0 -1
- package/css/layouts/Grid/grid.css +0 -1
- package/css/layouts/Level/level.css +0 -1
- package/css/layouts/Split/split.css +0 -1
- package/css/layouts/Stack/stack.css +0 -1
- package/css/layouts/_index.css +0 -7
- package/package.json +3 -3
@@ -1,4 +1,3 @@
|
|
1
|
-
:root,
|
2
1
|
.pf-v6-c-login {
|
3
2
|
--pf-v6-c-login--PaddingBlockStart: var(--pf-t--global--spacer--lg);
|
4
3
|
--pf-v6-c-login--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
|
@@ -55,33 +54,28 @@
|
|
55
54
|
--pf-v6-c-login__footer--c-list--xl--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
|
56
55
|
}
|
57
56
|
@media (min-width: 75rem) {
|
58
|
-
:root,
|
59
57
|
.pf-v6-c-login {
|
60
58
|
--pf-v6-c-login__container--MaxWidth: var(--pf-v6-c-login__container--xl--MaxWidth);
|
61
59
|
}
|
62
60
|
}
|
63
61
|
@media (min-width: 36rem) {
|
64
|
-
:root,
|
65
62
|
.pf-v6-c-login {
|
66
63
|
--pf-v6-c-login__header--PaddingInlineEnd: 0;
|
67
64
|
--pf-v6-c-login__header--PaddingInlineStart: 0;
|
68
65
|
}
|
69
66
|
}
|
70
67
|
@media (min-width: 75rem) {
|
71
|
-
:root,
|
72
68
|
.pf-v6-c-login {
|
73
69
|
--pf-v6-c-login__header--MarginBlockEnd: var(--pf-v6-c-login__header--xl--MarginBlockEnd);
|
74
70
|
--pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-v6-c-login__header--c-brand--xl--MarginBlockEnd);
|
75
71
|
}
|
76
72
|
}
|
77
73
|
@media (min-width: 75rem) {
|
78
|
-
:root,
|
79
74
|
.pf-v6-c-login {
|
80
75
|
--pf-v6-c-login__main--MarginBlockEnd: 0;
|
81
76
|
}
|
82
77
|
}
|
83
78
|
@media (min-width: 48rem) {
|
84
|
-
:root,
|
85
79
|
.pf-v6-c-login {
|
86
80
|
--pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-v6-c-login__main-header--md--PaddingInlineEnd);
|
87
81
|
--pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-v6-c-login__main-header--md--PaddingInlineStart);
|
@@ -89,21 +83,18 @@
|
|
89
83
|
}
|
90
84
|
}
|
91
85
|
@media (min-width: 48rem) {
|
92
|
-
:root,
|
93
86
|
.pf-v6-c-login {
|
94
87
|
--pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-v6-c-login__main-body--md--PaddingInlineEnd);
|
95
88
|
--pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-v6-c-login__main-body--md--PaddingInlineStart);
|
96
89
|
}
|
97
90
|
}
|
98
91
|
@media (min-width: 36rem) {
|
99
|
-
:root,
|
100
92
|
.pf-v6-c-login {
|
101
93
|
--pf-v6-c-login__footer--PaddingInlineEnd: 0;
|
102
94
|
--pf-v6-c-login__footer--PaddingInlineStart: 0;
|
103
95
|
}
|
104
96
|
}
|
105
97
|
@media (min-width: 75rem) {
|
106
|
-
:root,
|
107
98
|
.pf-v6-c-login {
|
108
99
|
--pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-v6-c-login__footer--c-list--xl--PaddingBlockStart);
|
109
100
|
}
|
@@ -1,4 +1,3 @@
|
|
1
|
-
:root,
|
2
1
|
.pf-v6-c-menu-toggle {
|
3
2
|
--pf-v6-c-menu-toggle--ColumnGap: var(--pf-t--global--spacer--sm);
|
4
3
|
--pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
|
@@ -32,9 +31,9 @@
|
|
32
31
|
--pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
|
33
32
|
--pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
|
34
33
|
--pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
|
35
|
-
--pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-
|
34
|
+
--pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
|
36
35
|
--pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
|
37
|
-
--pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-
|
36
|
+
--pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
|
38
37
|
--pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
|
39
38
|
--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
|
40
39
|
--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
|
@@ -1,4 +1,3 @@
|
|
1
|
-
:root,
|
2
1
|
.pf-v6-c-modal-box {
|
3
2
|
--pf-v6-c-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
|
4
3
|
--pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--large);
|
@@ -52,7 +51,6 @@
|
|
52
51
|
--pf-v6-c-modal-box__footer--c-button--sm--MarginInlineEnd: calc(var(--pf-v6-c-modal-box__footer--c-button--MarginInlineEnd) / 2);
|
53
52
|
}
|
54
53
|
@media (min-width: 75rem) {
|
55
|
-
:root,
|
56
54
|
.pf-v6-c-modal-box {
|
57
55
|
--pf-v6-c-modal-box--m-align-top--spacer: var(--pf-v6-c-modal-box--m-align-top--xl--spacer);
|
58
56
|
}
|
@@ -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
|
}
|
@@ -440,6 +438,10 @@
|
|
440
438
|
flex-grow: 1;
|
441
439
|
}
|
442
440
|
|
441
|
+
.pf-v6-c-page__main {
|
442
|
+
overflow: auto;
|
443
|
+
}
|
444
|
+
|
443
445
|
.pf-v6-c-page__main-subnav {
|
444
446
|
padding-block-start: var(--pf-v6-c-page__main-subnav--PaddingBlockStart);
|
445
447
|
padding-block-end: var(--pf-v6-c-page__main-subnav--PaddingBlockEnd);
|
@@ -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);
|
@@ -9,7 +8,7 @@
|
|
9
8
|
--pf-v6-c-pagination__nav--ColumnGap: var(--pf-t--global--spacer--sm);
|
10
9
|
--pf-v6-c-pagination__nav-page-select--FontSize: var(--pf-t--global--font--size--body--default);
|
11
10
|
--pf-v6-c-pagination__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
|
12
|
-
--pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc(
|
11
|
+
--pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--border--width--control--default) * 2);
|
13
12
|
--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;
|
14
13
|
--pf-v6-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
|
15
14
|
--pf-v6-c-pagination__total-items--Display: block;
|
@@ -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-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,8 +1,7 @@
|
|
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);
|
5
|
-
--pf-v6-c-radio--
|
4
|
+
--pf-v6-c-radio--m-standalone--MinHeight: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
|
6
5
|
--pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
|
7
6
|
--pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
|
8
7
|
--pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body--default);
|
@@ -26,7 +25,7 @@
|
|
26
25
|
.pf-v6-c-radio.pf-m-standalone {
|
27
26
|
display: inline-grid;
|
28
27
|
grid-template-columns: auto;
|
29
|
-
height: var(--pf-v6-c-
|
28
|
+
min-height: var(--pf-v6-c-radio--m-standalone--MinHeight);
|
30
29
|
}
|
31
30
|
.pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
|
32
31
|
align-self: center;
|
@@ -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;
|
@@ -46,7 +45,7 @@
|
|
46
45
|
--pf-v6-c-slider__thumb--before--TranslateX: -50%;
|
47
46
|
--pf-v6-c-slider__thumb--before--TranslateY: -50%;
|
48
47
|
--pf-v6-c-slider__value--MarginInlineStart: var(--pf-t--global--spacer--md);
|
49
|
-
--pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-
|
48
|
+
--pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + 1.25rem);
|
50
49
|
--pf-v6-c-slider__value--c-form-control--width-chars: 3;
|
51
50
|
--pf-v6-c-slider__value--c-form-control--Width: calc(var(--pf-v6-c-slider__value--c-form-control--width-base) + var(--pf-v6-c-slider__value--c-form-control--width-chars) * 1ch);
|
52
51
|
--pf-v6-c-slider__value--m-floating--TranslateX: -50%;
|
@@ -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-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-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-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;
|