@patternfly/patternfly 6.5.0-prerelease.31 → 6.5.0-prerelease.33
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.
- package/components/Compass/compass.css +14 -4
- package/components/Compass/compass.scss +16 -4
- package/components/Masthead/masthead.css +52 -0
- package/components/Masthead/masthead.scss +49 -0
- package/components/Nav/nav.css +59 -0
- package/components/Nav/nav.scss +75 -3
- package/components/Page/page.css +20 -0
- package/components/Page/page.scss +27 -0
- package/components/Toolbar/toolbar.css +32 -6
- package/components/Toolbar/toolbar.scss +28 -4
- package/components/_index.css +177 -10
- package/docs/components/Compass/examples/Compass.css +8 -2
- package/docs/components/Compass/examples/Compass.md +22 -1
- package/docs/components/Masthead/examples/masthead.md +67 -0
- package/docs/components/Nav/examples/Navigation.md +44 -0
- package/docs/components/Page/examples/Page.md +37 -0
- package/docs/components/Toolbar/examples/Toolbar.md +28 -0
- package/docs/demos/AboutModal/examples/AboutModal.md +5 -5
- package/docs/demos/Alert/examples/Alert.md +15 -15
- package/docs/demos/BackToTop/examples/BackToTop.md +5 -5
- package/docs/demos/Banner/examples/Banner.md +10 -10
- package/docs/demos/CardView/examples/CardView.md +5 -5
- package/docs/demos/Compass/examples/Compass.md +208 -0
- package/docs/demos/Dashboard/examples/Dashboard.md +5 -5
- package/docs/demos/DataList/examples/DataList.md +20 -23
- package/docs/demos/DescriptionList/examples/DescriptionList.md +15 -15
- package/docs/demos/Drawer/examples/Drawer.md +25 -25
- package/docs/demos/JumpLinks/examples/JumpLinks.md +30 -30
- package/docs/demos/Masthead/examples/Masthead.md +55 -58
- package/docs/demos/Modal/examples/Modal.md +30 -33
- package/docs/demos/Nav/examples/Nav.md +299 -62
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +25 -25
- package/docs/demos/Page/examples/Page.md +70 -79
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +35 -35
- package/docs/demos/Skeleton/examples/Skeleton.md +5 -5
- package/docs/demos/Table/examples/Table.md +75 -78
- package/docs/demos/Tabs/examples/Tabs.md +30 -30
- package/docs/demos/Toolbar/examples/Toolbar.md +10 -10
- package/docs/demos/Wizard/examples/Wizard.md +45 -48
- package/package.json +1 -1
- package/patternfly-no-globals.css +177 -10
- package/patternfly.css +177 -10
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -12283,16 +12283,16 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
|
|
|
12283
12283
|
--pf-v6-c-compass__main-header-content--RowGap: var(--pf-t--global--spacer--sm);
|
|
12284
12284
|
--pf-v6-c-compass__main-header-content--ColumnGap: var(--pf-t--global--spacer--md);
|
|
12285
12285
|
--pf-v6-c-compass__main-footer--MarginBlockStart: calc(var(--pf-v6-c-compass__main--RowGap) * -1 + var(--pf-v6-c-compass--Gap));
|
|
12286
|
-
--pf-v6-c-compass__panel--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
12287
|
-
--pf-v6-c-compass__panel--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
12288
|
-
--pf-v6-c-compass__panel--BorderRadius: var(--pf-t--global--border--radius--large);
|
|
12289
12286
|
--pf-v6-c-compass__panel--m-pill--BorderRadius: var(--pf-t--global--border--radius--pill);
|
|
12290
12287
|
--pf-v6-c-compass__panel--PaddingBlockStart: var(--pf-t--global--spacer--inset--page-chrome);
|
|
12291
12288
|
--pf-v6-c-compass__panel--PaddingBlockEnd: var(--pf-t--global--spacer--inset--page-chrome);
|
|
12292
12289
|
--pf-v6-c-compass__panel--PaddingInlineStart: var(--pf-t--global--spacer--inset--page-chrome);
|
|
12293
12290
|
--pf-v6-c-compass__panel--PaddingInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
|
|
12294
|
-
--pf-v6-c-compass__panel--
|
|
12291
|
+
--pf-v6-c-compass__panel--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
12292
|
+
--pf-v6-c-compass__panel--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
12295
12293
|
--pf-v6-c-compass__panel--BorderColor: var(--pf-t--global--border--color--alt);
|
|
12294
|
+
--pf-v6-c-compass__panel--BorderRadius: var(--pf-t--global--border--radius--large);
|
|
12295
|
+
--pf-v6-c-compass__panel--BorderWidth: var(--pf-t--global--border--width--regular);
|
|
12296
12296
|
--pf-v6-c-compass__panel--BoxShadow: var(--pf-t--global--box-shadow--md);
|
|
12297
12297
|
--pf-v6-c-compass__message-bar--Width: 450px;
|
|
12298
12298
|
--pf-v6-c-compass__message-bar--MinWidth: 300px;
|
|
@@ -12343,6 +12343,16 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
|
|
|
12343
12343
|
background-image: var(--pf-v6-c-compass--BackgroundImage);
|
|
12344
12344
|
background-size: cover;
|
|
12345
12345
|
}
|
|
12346
|
+
.pf-v6-c-compass.pf-m-dock {
|
|
12347
|
+
grid-template-areas: "dock main";
|
|
12348
|
+
grid-template-rows: auto;
|
|
12349
|
+
grid-template-columns: auto 1fr;
|
|
12350
|
+
align-items: stretch;
|
|
12351
|
+
padding: 0;
|
|
12352
|
+
}
|
|
12353
|
+
.pf-v6-c-compass.pf-m-dock .pf-v6-c-compass__main {
|
|
12354
|
+
padding: var(--pf-v6-c-compass--Padding);
|
|
12355
|
+
}
|
|
12346
12356
|
:root:where(.pf-v6-theme-dark) .pf-v6-c-compass {
|
|
12347
12357
|
--pf-v6-c-compass--BackgroundImage: var(--pf-v6-c-compass--BackgroundImage--dark);
|
|
12348
12358
|
}
|
|
@@ -18997,6 +19007,15 @@ ul.pf-v6-c-list {
|
|
|
18997
19007
|
--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn: 2;
|
|
18998
19008
|
--pf-v6-c-masthead--m-display-inline__main--Display: flex;
|
|
18999
19009
|
--pf-v6-c-masthead--m-display-inline__main--ColumnGap: var(--pf-t--global--spacer--md);
|
|
19010
|
+
--pf-v6-c-masthead--m-docked--GridTemplateRows: min-content 1fr;
|
|
19011
|
+
--pf-v6-c-masthead--m-docked--RowGap: var(--pf-t--global--spacer--gutter--default);
|
|
19012
|
+
--pf-v6-c-masthead--m-docked--PaddingBlockStart: var(--pf-t--global--spacer--lg);
|
|
19013
|
+
--pf-v6-c-masthead--m-docked--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
|
|
19014
|
+
--pf-v6-c-masthead--m-docked--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
|
19015
|
+
--pf-v6-c-masthead--m-docked--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
|
19016
|
+
--pf-v6-c-masthead--m-docked--BackgroundColor: var(--pf-t--global--background--color--glass--default);
|
|
19017
|
+
--pf-v6-c-masthead--m-docked--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
|
|
19018
|
+
--pf-v6-c-masthead--m-docked--c-toolbar--Height: 100%;
|
|
19000
19019
|
--pf-v6-c-masthead__expandable-content--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
|
|
19001
19020
|
--pf-v6-c-masthead__expandable-content--BorderBlockStart: var(--pf-v6-c-masthead--BorderWidth) solid var(--pf-v6-c-masthead--BorderColor);
|
|
19002
19021
|
--pf-v6-c-masthead--c-toolbar--Width: 100%;
|
|
@@ -19017,6 +19036,7 @@ ul.pf-v6-c-list {
|
|
|
19017
19036
|
--pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-stack__main--Display);
|
|
19018
19037
|
--pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-stack__main--ColumnGap);
|
|
19019
19038
|
display: grid;
|
|
19039
|
+
grid-template-rows: var(--pf-v6-c-masthead--GridTemplateRows);
|
|
19020
19040
|
grid-template-columns: var(--pf-v6-c-masthead--GridTemplateColumns);
|
|
19021
19041
|
row-gap: var(--pf-v6-c-masthead--RowGap);
|
|
19022
19042
|
column-gap: var(--pf-v6-c-masthead--ColumnGap);
|
|
@@ -19049,6 +19069,48 @@ ul.pf-v6-c-list {
|
|
|
19049
19069
|
--pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
|
|
19050
19070
|
}
|
|
19051
19071
|
}
|
|
19072
|
+
.pf-v6-c-masthead.pf-m-docked {
|
|
19073
|
+
--pf-v6-c-masthead--ColumnGap: var(--pf-v6-c-masthead--m-display-inline--ColumnGap);
|
|
19074
|
+
--pf-v6-c-masthead--GridTemplateColumns: var(--pf-v6-c-masthead--m-display-inline--GridTemplateColumns);
|
|
19075
|
+
--pf-v6-c-masthead__brand--GridColumn: var(--pf-v6-c-masthead--m-display-inline__brand--GridColumn);
|
|
19076
|
+
--pf-v6-c-masthead__brand--Order: var(--pf-v6-c-masthead--m-display-inline__brand--Order);
|
|
19077
|
+
--pf-v6-c-masthead__brand--PaddingBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--PaddingBlockEnd);
|
|
19078
|
+
--pf-v6-c-masthead__brand--BorderBlockEnd: var(--pf-v6-c-masthead--m-display-inline__brand--BorderBlockEnd);
|
|
19079
|
+
--pf-v6-c-masthead__main--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--GridColumn);
|
|
19080
|
+
--pf-v6-c-masthead__content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__content--GridColumn);
|
|
19081
|
+
--pf-v6-c-masthead__content--Order: var(--pf-v6-c-masthead--m-display-inline__content--Order);
|
|
19082
|
+
--pf-v6-c-masthead__main--toggle--content--GridColumn: var(--pf-v6-c-masthead--m-display-inline__main--toggle--content--GridColumn);
|
|
19083
|
+
--pf-v6-c-masthead__main--Display: var(--pf-v6-c-masthead--m-display-inline__main--Display);
|
|
19084
|
+
--pf-v6-c-masthead__main--ColumnGap: var(--pf-v6-c-masthead--m-display-inline__main--ColumnGap);
|
|
19085
|
+
--pf-v6-c-masthead--BackgroundColor: var(--pf-v6-c-masthead--m-docked--BackgroundColor);
|
|
19086
|
+
--pf-v6-c-masthead--GridTemplateRows: var(--pf-v6-c-masthead--m-docked--GridTemplateRows);
|
|
19087
|
+
--pf-v6-c-masthead--PaddingBlockStart: var(--pf-v6-c-masthead--m-docked--PaddingBlockStart);
|
|
19088
|
+
--pf-v6-c-masthead--PaddingBlockEnd: var(--pf-v6-c-masthead--m-docked--PaddingBlockEnd);
|
|
19089
|
+
--pf-v6-c-masthead--PaddingInlineStart: var(--pf-v6-c-masthead--m-docked--PaddingInlineStart);
|
|
19090
|
+
--pf-v6-c-masthead--PaddingInlineEnd: var(--pf-v6-c-masthead--m-docked--PaddingInlineEnd);
|
|
19091
|
+
--pf-v6-c-masthead--GridTemplateColumns: auto;
|
|
19092
|
+
--pf-v6-c-masthead--RowGap: var(--pf-v6-c-masthead--m-docked--RowGap);
|
|
19093
|
+
--pf-v6-c-masthead--m-display-inline--breakpoint--xl--GridTemplateColumns: auto;
|
|
19094
|
+
--pf-v6-c-masthead__main--GridColumn: auto;
|
|
19095
|
+
--pf-v6-c-masthead__content--GridColumn: auto;
|
|
19096
|
+
--pf-v6-c-masthead__logo--Width: auto;
|
|
19097
|
+
--pf-v6-c-masthead__main--MarginInlineEnd: 0;
|
|
19098
|
+
display: flex;
|
|
19099
|
+
flex-direction: column;
|
|
19100
|
+
align-items: center;
|
|
19101
|
+
width: fit-content;
|
|
19102
|
+
height: 100%;
|
|
19103
|
+
backdrop-filter: var(--pf-v6-c-masthead--m-docked--BackdropFilter);
|
|
19104
|
+
}
|
|
19105
|
+
.pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__content {
|
|
19106
|
+
flex-direction: column;
|
|
19107
|
+
flex-grow: 1;
|
|
19108
|
+
align-self: revert;
|
|
19109
|
+
}
|
|
19110
|
+
.pf-v6-c-masthead.pf-m-docked .pf-v6-c-toolbar {
|
|
19111
|
+
--pf-v6-c-masthead--c-toolbar--Width: fit-content;
|
|
19112
|
+
height: var(--pf-v6-c-masthead--m-docked--c-toolbar--Height);
|
|
19113
|
+
}
|
|
19052
19114
|
.pf-v6-c-masthead .pf-v6-c-toolbar__content-section {
|
|
19053
19115
|
flex-wrap: nowrap;
|
|
19054
19116
|
min-width: 0;
|
|
@@ -21097,6 +21159,15 @@ ul.pf-v6-c-list {
|
|
|
21097
21159
|
--pf-v6-c-nav__section-title--PaddingInlineStart: var(--pf-v6-c-nav__link--PaddingInlineStart);
|
|
21098
21160
|
--pf-v6-c-nav__section-title--PaddingInlineEnd: var(--pf-v6-c-nav__link--PaddingInlineEnd);
|
|
21099
21161
|
--pf-v6-c-nav__item--RowGap: var(--pf-v6-c-nav__list--RowGap);
|
|
21162
|
+
--pf-v6-c-nav__item--accent--size: var(--pf-t--global--border--width--extra-strong);
|
|
21163
|
+
--pf-v6-c-nav__item--accent--color: var(--pf-t--global--border--color--clicked);
|
|
21164
|
+
--pf-v6-c-nav__item--accent--offset: calc(var(--pf-t--global--spacer--sm) * -1);
|
|
21165
|
+
--pf-v6-c-nav__item--accent--BorderRadius: var(--pf-t--global--border--radius--small);
|
|
21166
|
+
--pf-v6-c-nav__item--accent--ScaleY: 0;
|
|
21167
|
+
--pf-v6-c-nav__item--current--accent--ScaleY: 1;
|
|
21168
|
+
--pf-v6-c-nav__item--accent--TransitionDuration: 0;
|
|
21169
|
+
--pf-v6-c-nav__item--current--accent--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
|
|
21170
|
+
--pf-v6-c-nav__item--accent--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
|
|
21100
21171
|
--pf-v6-c-nav__item__toggle-icon--Rotate: 0;
|
|
21101
21172
|
--pf-v6-c-nav__item--m-expanded__toggle-icon--Rotate: 90deg;
|
|
21102
21173
|
--pf-v6-c-nav__item__toggle-icon--TransitionDuration--transform: var(--pf-t--global--motion--duration--icon--default);
|
|
@@ -21121,6 +21192,7 @@ ul.pf-v6-c-list {
|
|
|
21121
21192
|
--pf-v6-c-nav__link--m-current--TransitionTimingFunction--color: var(--pf-t--global--motion--timing-function--default);
|
|
21122
21193
|
--pf-v6-c-nav__link-icon--Color: var(--pf-t--global--icon--color--subtle);
|
|
21123
21194
|
--pf-v6-c-nav__link--m-current__link-icon--Color: var(--pf-t--global--icon--color--regular);
|
|
21195
|
+
--pf-v6-c-nav__link-text--FontSize: initial;
|
|
21124
21196
|
--pf-v6-c-nav__subnav--RowGap: var(--pf-t--global--border--width--extra-strong);
|
|
21125
21197
|
--pf-v6-c-nav__subnav--PaddingBlockStart: var(--pf-v6-c-nav__item--RowGap);
|
|
21126
21198
|
--pf-v6-c-nav__subnav--PaddingBlockEnd: var(--pf-v6-c-nav__item--RowGap);
|
|
@@ -21161,6 +21233,11 @@ ul.pf-v6-c-list {
|
|
|
21161
21233
|
--pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
|
|
21162
21234
|
--pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
|
|
21163
21235
|
--pf-v6-c-nav--m-horizontal--m-subnav__link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
|
|
21236
|
+
--pf-v6-c-nav--m-docked__list--RowGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
|
|
21237
|
+
--pf-v6-c-nav--m-docked__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
|
21238
|
+
--pf-v6-c-nav--m-docked__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
|
21239
|
+
--pf-v6-c-nav--m-docked__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
|
|
21240
|
+
--pf-v6-c-nav--m-docked__link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
|
|
21164
21241
|
}
|
|
21165
21242
|
@media screen and (prefers-reduced-motion: no-preference) {
|
|
21166
21243
|
.pf-v6-c-nav {
|
|
@@ -21202,6 +21279,25 @@ ul.pf-v6-c-list {
|
|
|
21202
21279
|
.pf-v6-c-nav.pf-m-fill {
|
|
21203
21280
|
flex-grow: 1;
|
|
21204
21281
|
}
|
|
21282
|
+
.pf-v6-c-nav.pf-m-docked {
|
|
21283
|
+
--pf-v6-c-nav--PaddingBlockStart: 0;
|
|
21284
|
+
--pf-v6-c-nav--PaddingBlockEnd: 0;
|
|
21285
|
+
--pf-v6-c-nav__list--RowGap: var(--pf-v6-c-nav--m-docked__list--RowGap);
|
|
21286
|
+
--pf-v6-c-nav__link--PaddingInlineStart: var(--pf-v6-c-nav--m-docked__link--PaddingInlineStart);
|
|
21287
|
+
--pf-v6-c-nav__link--PaddingInlineEnd: var(--pf-v6-c-nav--m-docked__link--PaddingInlineEnd);
|
|
21288
|
+
--pf-v6-c-nav__link--hover--BackgroundColor: var(--pf-v6-c-nav--m-docked__link--hover--BackgroundColor);
|
|
21289
|
+
--pf-v6-c-nav__link--m-current--BackgroundColor: var(--pf-v6-c-nav--m-docked__link--m-current--BackgroundColor);
|
|
21290
|
+
width: fit-content;
|
|
21291
|
+
}
|
|
21292
|
+
.pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-icon {
|
|
21293
|
+
position: relative;
|
|
21294
|
+
align-self: center;
|
|
21295
|
+
min-width: 1lh;
|
|
21296
|
+
text-align: center;
|
|
21297
|
+
}
|
|
21298
|
+
.pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-text {
|
|
21299
|
+
display: none;
|
|
21300
|
+
}
|
|
21205
21301
|
.pf-v6-c-nav .pf-v6-c-menu {
|
|
21206
21302
|
--pf-v6-c-menu--MinWidth: 100%;
|
|
21207
21303
|
}
|
|
@@ -21265,14 +21361,34 @@ ul.pf-v6-c-list {
|
|
|
21265
21361
|
}
|
|
21266
21362
|
|
|
21267
21363
|
.pf-v6-c-nav__item {
|
|
21364
|
+
position: relative;
|
|
21268
21365
|
scroll-snap-align: var(--pf-v6-c-nav__item--ScrollSnapAlign);
|
|
21269
21366
|
}
|
|
21367
|
+
.pf-v6-c-nav__item::before {
|
|
21368
|
+
position: absolute;
|
|
21369
|
+
inset-block-start: 0;
|
|
21370
|
+
inset-block-end: 0;
|
|
21371
|
+
inset-inline-start: var(--pf-v6-c-nav__item--accent--offset);
|
|
21372
|
+
width: var(--pf-v6-c-nav__item--accent--size);
|
|
21373
|
+
pointer-events: none;
|
|
21374
|
+
content: var(--pf-v6-c-nav__item--accent--content, "");
|
|
21375
|
+
background-color: var(--pf-v6-c-nav__item--accent--color);
|
|
21376
|
+
border-radius: var(--pf-v6-c-nav__item--accent--BorderRadius);
|
|
21377
|
+
transition-timing-function: var(--pf-v6-c-nav__item--accent--TransitionTimingFunction);
|
|
21378
|
+
transition-duration: var(--pf-v6-c-nav__item--accent--TransitionDuration);
|
|
21379
|
+
transition-property: scale;
|
|
21380
|
+
scale: 1 var(--pf-v6-c-nav__item--accent--ScaleY);
|
|
21381
|
+
}
|
|
21270
21382
|
.pf-v6-c-nav__item > .pf-v6-c-nav__link[button] {
|
|
21271
21383
|
margin-block-end: var(--pf-v6-c-nav__button--RowGap--row-offset);
|
|
21272
21384
|
}
|
|
21273
21385
|
.pf-v6-c-nav__item.pf-m-expanded:last-child > .pf-v6-c-nav__subnav {
|
|
21274
21386
|
margin-block-end: calc(var(--pf-v6-c-nav__subnav--PaddingBlockEnd) * -1);
|
|
21275
21387
|
}
|
|
21388
|
+
.pf-v6-c-nav__item:has(> .pf-v6-c-nav__link.pf-m-current) {
|
|
21389
|
+
--pf-v6-c-nav__item--accent--ScaleY: var(--pf-v6-c-nav__item--current--accent--ScaleY);
|
|
21390
|
+
--pf-v6-c-nav__item--accent--TransitionDuration: var(--pf-v6-c-nav__item--current--accent--TransitionDuration);
|
|
21391
|
+
}
|
|
21276
21392
|
|
|
21277
21393
|
.pf-v6-c-nav__section {
|
|
21278
21394
|
row-gap: var(--pf-v6-c-nav__section--RowGap, var(--pf-v6-c-nav__list--RowGap));
|
|
@@ -21334,6 +21450,10 @@ ul.pf-v6-c-list {
|
|
|
21334
21450
|
color: var(--pf-v6-c-nav__link-icon--Color);
|
|
21335
21451
|
}
|
|
21336
21452
|
|
|
21453
|
+
.pf-v6-c-nav__link-text {
|
|
21454
|
+
font-size: var(--pf-v6-c-nav__link-text--FontSize, inherit);
|
|
21455
|
+
}
|
|
21456
|
+
|
|
21337
21457
|
.pf-v6-c-nav__toggle {
|
|
21338
21458
|
flex: none;
|
|
21339
21459
|
align-self: start;
|
|
@@ -21389,6 +21509,7 @@ ul.pf-v6-c-list {
|
|
|
21389
21509
|
}
|
|
21390
21510
|
|
|
21391
21511
|
.pf-v6-c-nav:where(.pf-m-horizontal) {
|
|
21512
|
+
--pf-v6-c-nav__item--accent--content: none;
|
|
21392
21513
|
padding: 0;
|
|
21393
21514
|
overflow: hidden;
|
|
21394
21515
|
}
|
|
@@ -21754,6 +21875,7 @@ ul.pf-v6-c-list {
|
|
|
21754
21875
|
--pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
|
|
21755
21876
|
--pf-v6-c-page--inset: var(--pf-t--global--spacer--inset--page-chrome);
|
|
21756
21877
|
--pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
|
|
21878
|
+
--pf-v6-c-page__dock--ZIndex: var(--pf-t--global--z-index--md);
|
|
21757
21879
|
--pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
|
|
21758
21880
|
--pf-v6-c-page__sidebar--Width--base: 18.125rem;
|
|
21759
21881
|
--pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--Width--base);
|
|
@@ -21861,6 +21983,9 @@ ul.pf-v6-c-list {
|
|
|
21861
21983
|
--pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
|
|
21862
21984
|
--pf-v6-c-page__drawer--c-drawer--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
|
|
21863
21985
|
--pf-v6-c-page__drawer--c-drawer--BorderBlockStartColor: var(--pf-t--global--border--color--high-contrast);
|
|
21986
|
+
--pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg) * 2);
|
|
21987
|
+
--pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-t--global--spacer--lg);
|
|
21988
|
+
--pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
|
|
21864
21989
|
}
|
|
21865
21990
|
@media screen and (prefers-reduced-motion: no-preference) {
|
|
21866
21991
|
.pf-v6-c-page {
|
|
@@ -21903,6 +22028,16 @@ ul.pf-v6-c-list {
|
|
|
21903
22028
|
grid-template-columns: var(--pf-v6-c-page__sidebar--Width) 1fr;
|
|
21904
22029
|
}
|
|
21905
22030
|
}
|
|
22031
|
+
.pf-v6-c-page.pf-m-dock {
|
|
22032
|
+
--pf-v6-c-page--masthead--main-container--GridArea: main;
|
|
22033
|
+
--pf-v6-c-page__main-container--MaxHeight: var(--pf-v6-c-page--m-dock__main-container--MaxHeight);
|
|
22034
|
+
--pf-v6-c-page__main-container--MarginBlockStart: var(--pf-v6-c-page--m-dock__main-container--MarginBlockStart);
|
|
22035
|
+
--pf-v6-c-page__main-container--MarginInlineStart: 0;
|
|
22036
|
+
grid-template-areas: "dock main";
|
|
22037
|
+
grid-template-rows: auto;
|
|
22038
|
+
grid-template-columns: auto 1fr;
|
|
22039
|
+
column-gap: var(--pf-v6-c-page--m-dock--ColumnGap);
|
|
22040
|
+
}
|
|
21906
22041
|
.pf-v6-c-page > .pf-v6-c-masthead .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
|
|
21907
22042
|
--pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
|
|
21908
22043
|
--pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
|
|
@@ -21959,6 +22094,11 @@ ul.pf-v6-c-list {
|
|
|
21959
22094
|
}
|
|
21960
22095
|
}
|
|
21961
22096
|
|
|
22097
|
+
.pf-v6-c-page__dock {
|
|
22098
|
+
z-index: var(--pf-v6-c-page__dock--ZIndex);
|
|
22099
|
+
grid-area: dock;
|
|
22100
|
+
}
|
|
22101
|
+
|
|
21962
22102
|
.pf-v6-c-page__sidebar {
|
|
21963
22103
|
z-index: var(--pf-v6-c-page__sidebar--ZIndex);
|
|
21964
22104
|
display: flex;
|
|
@@ -22262,6 +22402,7 @@ ul.pf-v6-c-list {
|
|
|
22262
22402
|
flex-direction: column;
|
|
22263
22403
|
align-self: var(--pf-v6-c-page__main-container--AlignSelf);
|
|
22264
22404
|
max-height: var(--pf-v6-c-page__main-container--MaxHeight);
|
|
22405
|
+
margin-block-start: var(--pf-v6-c-page__main-container--MarginBlockStart, 0);
|
|
22265
22406
|
margin-inline-start: var(--pf-v6-c-page__main-container--MarginInlineStart);
|
|
22266
22407
|
margin-inline-end: var(--pf-v6-c-page__main-container--MarginInlineEnd);
|
|
22267
22408
|
background: var(--pf-v6-c-page__main-container--BackgroundColor);
|
|
@@ -30295,6 +30436,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
30295
30436
|
--pf-v6-c-toolbar--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
30296
30437
|
--pf-v6-c-toolbar--m-sticky--BorderBlockEndWidth: var(--pf-t--global--border--width--high-contrast--regular);
|
|
30297
30438
|
--pf-v6-c-toolbar--m-sticky--BorderBlockEndColor: var(--pf-t--global--border--color--high-contrast);
|
|
30439
|
+
--pf-v6-c-toolbar--m-vertical--Width: fit-content;
|
|
30298
30440
|
--pf-v6-c-toolbar__expand-all-icon--Rotate: 0;
|
|
30299
30441
|
--pf-v6-c-toolbar__expand-all-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
|
|
30300
30442
|
--pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
|
|
@@ -30498,6 +30640,16 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
30498
30640
|
.pf-v6-c-toolbar.pf-m-no-background {
|
|
30499
30641
|
--pf-v6-c-toolbar--BackgroundColor: var(--pf-v6-c-toolbar--m-no-background--BackgroundColor);
|
|
30500
30642
|
}
|
|
30643
|
+
.pf-v6-c-toolbar.pf-m-vertical {
|
|
30644
|
+
--pf-v6-c-toolbar--child--m-align-end--MarginBlockStart: auto;
|
|
30645
|
+
--pf-v6-c-toolbar--child--m-align-end--MarginInlineStart: 0;
|
|
30646
|
+
--pf-v6-c-toolbar--PaddingBlockEnd: 0;
|
|
30647
|
+
--pf-v6-c-toolbar--Width: var(--pf-v6-c-toolbar--m-vertical--Width);
|
|
30648
|
+
}
|
|
30649
|
+
.pf-v6-c-toolbar.pf-m-vertical :is(.pf-v6-c-toolbar__group, .pf-v6-c-toolbar__item, .pf-v6-c-toolbar__content-section) {
|
|
30650
|
+
flex-direction: column;
|
|
30651
|
+
align-items: center;
|
|
30652
|
+
}
|
|
30501
30653
|
|
|
30502
30654
|
.pf-v6-c-toolbar__item {
|
|
30503
30655
|
--pf-v6-c-toolbar__item--Width--base: var(--pf-v6-c-toolbar__item--Width);
|
|
@@ -30577,6 +30729,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
30577
30729
|
row-gap: var(--pf-v6-c-toolbar__group--RowGap);
|
|
30578
30730
|
column-gap: var(--pf-v6-c-toolbar__group--ColumnGap);
|
|
30579
30731
|
}
|
|
30732
|
+
.pf-v6-c-toolbar.pf-m-vertical .pf-v6-c-toolbar__group {
|
|
30733
|
+
row-gap: var(--pf-v6-c-toolbar__group--ColumnGap);
|
|
30734
|
+
}
|
|
30580
30735
|
.pf-v6-c-toolbar__group.pf-m-filter-group {
|
|
30581
30736
|
column-gap: var(--pf-v6-c-toolbar__group--m-filter-group--ColumnGap);
|
|
30582
30737
|
}
|
|
@@ -30588,9 +30743,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
30588
30743
|
.pf-v6-c-toolbar__group.pf-m-action-group {
|
|
30589
30744
|
column-gap: var(--pf-v6-c-toolbar__group--m-action-group--ColumnGap);
|
|
30590
30745
|
}
|
|
30746
|
+
.pf-v6-c-toolbar.pf-m-vertical .pf-v6-c-toolbar__group.pf-m-action-group {
|
|
30747
|
+
row-gap: var(--pf-v6-c-toolbar__group--m-action-group--ColumnGap);
|
|
30748
|
+
}
|
|
30591
30749
|
.pf-v6-c-toolbar__group.pf-m-action-group-plain {
|
|
30592
30750
|
column-gap: var(--pf-v6-c-toolbar__group--m-action-group-plain--ColumnGap);
|
|
30593
30751
|
}
|
|
30752
|
+
.pf-v6-c-toolbar.pf-m-vertical .pf-v6-c-toolbar__group.pf-m-action-group-plain {
|
|
30753
|
+
row-gap: var(--pf-v6-c-toolbar__group--m-action-group-plain--ColumnGap);
|
|
30754
|
+
}
|
|
30594
30755
|
.pf-v6-c-toolbar__group.pf-m-action-group-inline {
|
|
30595
30756
|
flex-wrap: wrap;
|
|
30596
30757
|
column-gap: var(--pf-v6-c-toolbar__group--m-action-group-inline--ColumnGap);
|
|
@@ -30667,7 +30828,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
30667
30828
|
}
|
|
30668
30829
|
.pf-v6-c-toolbar__group.pf-m-align-end,
|
|
30669
30830
|
.pf-v6-c-toolbar__item.pf-m-align-end {
|
|
30670
|
-
margin-
|
|
30831
|
+
margin-block-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginBlockStart, 0);
|
|
30832
|
+
margin-inline-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginInlineStart, auto);
|
|
30671
30833
|
}
|
|
30672
30834
|
.pf-v6-c-toolbar__group.pf-m-flex-grow,
|
|
30673
30835
|
.pf-v6-c-toolbar__item.pf-m-flex-grow {
|
|
@@ -30922,7 +31084,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
30922
31084
|
}
|
|
30923
31085
|
.pf-v6-c-toolbar__group.pf-m-align-end-on-sm,
|
|
30924
31086
|
.pf-v6-c-toolbar__item.pf-m-align-end-on-sm {
|
|
30925
|
-
margin-
|
|
31087
|
+
margin-block-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginBlockStart, 0);
|
|
31088
|
+
margin-inline-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginInlineStart, auto);
|
|
30926
31089
|
}
|
|
30927
31090
|
.pf-v6-c-toolbar__group.pf-m-flex-grow-on-sm,
|
|
30928
31091
|
.pf-v6-c-toolbar__item.pf-m-flex-grow-on-sm {
|
|
@@ -31174,7 +31337,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
31174
31337
|
}
|
|
31175
31338
|
.pf-v6-c-toolbar__group.pf-m-align-end-on-md,
|
|
31176
31339
|
.pf-v6-c-toolbar__item.pf-m-align-end-on-md {
|
|
31177
|
-
margin-
|
|
31340
|
+
margin-block-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginBlockStart, 0);
|
|
31341
|
+
margin-inline-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginInlineStart, auto);
|
|
31178
31342
|
}
|
|
31179
31343
|
.pf-v6-c-toolbar__group.pf-m-flex-grow-on-md,
|
|
31180
31344
|
.pf-v6-c-toolbar__item.pf-m-flex-grow-on-md {
|
|
@@ -31426,7 +31590,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
31426
31590
|
}
|
|
31427
31591
|
.pf-v6-c-toolbar__group.pf-m-align-end-on-lg,
|
|
31428
31592
|
.pf-v6-c-toolbar__item.pf-m-align-end-on-lg {
|
|
31429
|
-
margin-
|
|
31593
|
+
margin-block-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginBlockStart, 0);
|
|
31594
|
+
margin-inline-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginInlineStart, auto);
|
|
31430
31595
|
}
|
|
31431
31596
|
.pf-v6-c-toolbar__group.pf-m-flex-grow-on-lg,
|
|
31432
31597
|
.pf-v6-c-toolbar__item.pf-m-flex-grow-on-lg {
|
|
@@ -31678,7 +31843,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
31678
31843
|
}
|
|
31679
31844
|
.pf-v6-c-toolbar__group.pf-m-align-end-on-xl,
|
|
31680
31845
|
.pf-v6-c-toolbar__item.pf-m-align-end-on-xl {
|
|
31681
|
-
margin-
|
|
31846
|
+
margin-block-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginBlockStart, 0);
|
|
31847
|
+
margin-inline-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginInlineStart, auto);
|
|
31682
31848
|
}
|
|
31683
31849
|
.pf-v6-c-toolbar__group.pf-m-flex-grow-on-xl,
|
|
31684
31850
|
.pf-v6-c-toolbar__item.pf-m-flex-grow-on-xl {
|
|
@@ -31930,7 +32096,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
|
|
|
31930
32096
|
}
|
|
31931
32097
|
.pf-v6-c-toolbar__group.pf-m-align-end-on-2xl,
|
|
31932
32098
|
.pf-v6-c-toolbar__item.pf-m-align-end-on-2xl {
|
|
31933
|
-
margin-
|
|
32099
|
+
margin-block-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginBlockStart, 0);
|
|
32100
|
+
margin-inline-start: var(--pf-v6-c-toolbar--child--m-align-end--MarginInlineStart, auto);
|
|
31934
32101
|
}
|
|
31935
32102
|
.pf-v6-c-toolbar__group.pf-m-flex-grow-on-2xl,
|
|
31936
32103
|
.pf-v6-c-toolbar__item.pf-m-flex-grow-on-2xl {
|