@patternfly/patternfly 6.6.0-prerelease.3 → 6.6.0-prerelease.31
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/assets/fonts/RedHatDisplay/RedHatDisplayVF-Italic.woff2 +0 -0
- package/assets/fonts/RedHatDisplay/RedHatDisplayVF.woff2 +0 -0
- package/assets/fonts/RedHatMono/RedHatMonoVF-Italic.woff2 +0 -0
- package/assets/fonts/RedHatMono/RedHatMonoVF.woff2 +0 -0
- package/assets/fonts/RedHatText/RedHatTextVF-Italic.woff2 +0 -0
- package/assets/fonts/RedHatText/RedHatTextVF.woff2 +0 -0
- package/assets/images/img_avatar-rhds.svg +22 -0
- package/assets/images/pf-logo-avatar.jpg +0 -0
- package/base/patternfly-fonts.css +4 -4
- package/base/patternfly-fonts.scss +4 -4
- package/base/patternfly-variables.css +8 -6
- package/base/tokens/tokens-charts-dark.scss +1 -1
- package/base/tokens/tokens-charts-highcontrast-dark.scss +1 -1
- package/base/tokens/tokens-charts-highcontrast.scss +1 -1
- package/base/tokens/tokens-charts.scss +1 -1
- package/base/tokens/tokens-dark.scss +1 -1
- package/base/tokens/tokens-default.scss +4 -4
- package/base/tokens/tokens-felt-dark.scss +1 -1
- package/base/tokens/tokens-felt-glass-dark.scss +1 -1
- package/base/tokens/tokens-felt-glass.scss +3 -2
- package/base/tokens/tokens-felt-highcontrast-dark.scss +1 -1
- package/base/tokens/tokens-felt-highcontrast.scss +1 -1
- package/base/tokens/tokens-felt.scss +1 -1
- package/base/tokens/tokens-glass-dark.scss +1 -1
- package/base/tokens/tokens-glass.scss +3 -2
- package/base/tokens/tokens-highcontrast-dark.scss +1 -1
- package/base/tokens/tokens-highcontrast.scss +4 -4
- package/base/tokens/tokens-palette.scss +1 -1
- package/base/tokens/tokens-redhat-highcontrast.scss +3 -3
- package/components/AboutModalBox/about-modal-box.css +1 -1
- package/components/AboutModalBox/about-modal-box.scss +1 -1
- package/components/Accordion/accordion.css +3 -3
- package/components/Accordion/accordion.scss +3 -3
- package/components/Alert/alert.css +8 -7
- package/components/Alert/alert.scss +8 -7
- package/components/Avatar/avatar.css +144 -0
- package/components/Avatar/avatar.scss +161 -0
- package/components/Banner/banner.css +7 -0
- package/components/Banner/banner.scss +7 -0
- package/components/Breadcrumb/breadcrumb.css +3 -3
- package/components/Breadcrumb/breadcrumb.scss +3 -3
- package/components/Button/button.css +33 -5
- package/components/Button/button.scss +39 -7
- package/components/Card/card.css +4 -4
- package/components/Card/card.scss +4 -4
- package/components/ClipboardCopy/clipboard-copy.css +1 -1
- package/components/ClipboardCopy/clipboard-copy.scss +1 -1
- package/components/DataList/data-list.css +5 -5
- package/components/DataList/data-list.scss +5 -5
- package/components/DragDrop/drag-drop.css +4 -0
- package/components/DragDrop/drag-drop.scss +4 -0
- package/components/DualListSelector/dual-list-selector.css +1 -1
- package/components/DualListSelector/dual-list-selector.scss +1 -1
- package/components/Form/form.scss +1 -0
- package/components/FormControl/form-control.css +12 -2
- package/components/FormControl/form-control.scss +14 -2
- package/components/Hint/hint.css +2 -2
- package/components/Hint/hint.scss +2 -2
- package/components/Label/label.css +9 -3
- package/components/Label/label.scss +9 -3
- package/components/Masthead/masthead.css +1 -1
- package/components/Masthead/masthead.scss +1 -1
- package/components/Menu/menu.css +2 -2
- package/components/Menu/menu.scss +3 -3
- package/components/MenuToggle/menu-toggle.css +3 -0
- package/components/MenuToggle/menu-toggle.scss +4 -1
- package/components/ModalBox/modal-box.css +4 -4
- package/components/ModalBox/modal-box.scss +5 -5
- package/components/Nav/nav.css +2 -2
- package/components/Nav/nav.scss +2 -2
- package/components/NotificationDrawer/notification-drawer.css +3 -3
- package/components/NotificationDrawer/notification-drawer.scss +3 -3
- package/components/Page/page.css +25 -22
- package/components/Page/page.scss +28 -28
- package/components/Pagination/pagination.css +12 -7
- package/components/Pagination/pagination.scss +15 -12
- package/components/Panel/panel.css +1 -1
- package/components/Panel/panel.scss +2 -2
- package/components/Popover/popover.css +1 -1
- package/components/Popover/popover.scss +1 -1
- package/components/Progress/progress.css +2 -2
- package/components/Progress/progress.scss +2 -2
- package/components/Sidebar/sidebar.css +4 -7
- package/components/Sidebar/sidebar.scss +9 -9
- package/components/Table/table-grid.css +25 -13
- package/components/Table/table-grid.scss +10 -5
- package/components/Table/table-tree-view.css +3 -0
- package/components/Table/table-tree-view.scss +2 -0
- package/components/Table/table.css +55 -21
- package/components/Table/table.scss +82 -34
- package/components/Tabs/tabs.css +19 -5
- package/components/Tabs/tabs.scss +22 -5
- package/components/Title/title.css +1 -1
- package/components/Title/title.scss +1 -1
- package/components/Tooltip/tooltip.css +1 -1
- package/components/Tooltip/tooltip.scss +1 -1
- package/components/TreeView/tree-view.css +7 -7
- package/components/TreeView/tree-view.scss +7 -7
- package/components/Wizard/wizard.css +4 -4
- package/components/Wizard/wizard.scss +4 -4
- package/components/_index.css +412 -141
- package/docs/components/Avatar/examples/Avatar.css +6 -0
- package/docs/components/Avatar/examples/Avatar.md +414 -40
- package/docs/components/Button/examples/Button.md +2 -2
- package/docs/components/CodeEditor/examples/CodeEditor.md +131 -47
- package/docs/components/DataList/examples/DataList.md +143 -11
- package/docs/components/DatePicker/examples/DatePicker.md +26 -2
- package/docs/components/DescriptionList/examples/DescriptionList.md +115 -55
- package/docs/components/Drawer/examples/Drawer.md +1 -1
- package/docs/components/DualListSelector/examples/DualListSelector.md +355 -139
- package/docs/components/EmptyState/examples/EmptyState.md +12 -12
- package/docs/components/FileUpload/examples/FileUpload.md +26 -2
- package/docs/components/Form/examples/Form.md +140 -16
- package/docs/components/FormControl/examples/FormControl.md +260 -20
- package/docs/components/HelperText/examples/HelperText.md +139 -11
- package/docs/components/Icon/examples/Icon.md +403 -31
- package/docs/components/InlineEdit/examples/InlineEdit.md +13 -1
- package/docs/components/InputGroup/examples/InputGroup.md +20 -8
- package/docs/components/Label/examples/Label.md +4029 -765
- package/docs/components/List/examples/List.md +78 -6
- package/docs/components/Login/examples/Login.md +104 -8
- package/docs/components/Menu/examples/Menu.md +221 -17
- package/docs/components/MenuToggle/examples/MenuToggle.md +54 -15
- package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +247 -19
- package/docs/components/NumberInput/examples/NumberInput.md +301 -25
- package/docs/components/Pagination/examples/Pagination.md +111 -273
- package/docs/components/ProgressStepper/examples/ProgressStepper.md +169 -13
- package/docs/components/Sidebar/examples/Sidebar.md +3 -1
- package/docs/components/Switch/examples/Switch.md +52 -4
- package/docs/components/Table/examples/Table.css +6 -0
- package/docs/components/Table/examples/Table.md +1322 -171
- package/docs/components/Tabs/examples/Tabs.md +18 -998
- package/docs/components/TextInputGroup/examples/TextInputGroup.md +355 -115
- package/docs/components/Toolbar/examples/Toolbar.md +133 -25
- package/docs/components/TreeView/examples/TreeView.md +286 -118
- package/docs/components/Wizard/examples/Wizard.md +325 -25
- package/docs/demos/Alert/examples/Alert.md +181 -40
- package/docs/demos/Button/examples/Button.md +57 -45
- package/docs/demos/Card/examples/Card.md +280 -34
- package/docs/demos/CardView/examples/CardView.md +12 -12
- package/docs/demos/Compass/examples/Compass.md +91 -439
- package/docs/demos/Dashboard/examples/Dashboard.md +92 -41
- package/docs/demos/DataList/examples/DataList.md +74 -50
- package/docs/demos/Form/examples/BasicForms.md +112 -36
- package/docs/demos/HelperText/examples/HelperText.md +104 -8
- package/docs/demos/Masthead/examples/Masthead.md +52 -4
- package/docs/demos/PasswordStrength/examples/PasswordStrength.md +176 -14
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +2570 -4968
- package/docs/demos/Table/examples/Table.md +407 -179
- package/docs/demos/Toolbar/examples/Toolbar.md +139 -46
- package/docs/demos/Wizard/examples/Wizard.md +117 -9
- package/package.json +7 -7
- package/patternfly-base-no-globals.css +12 -10
- package/patternfly-base.css +12 -10
- package/patternfly-no-globals.css +424 -151
- package/patternfly.css +424 -151
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -89,8 +89,8 @@
|
|
|
89
89
|
--#{$table}__toggle--c-button--m-expanded__toggle-icon--Rotate: -180deg;
|
|
90
90
|
|
|
91
91
|
// * Table button
|
|
92
|
-
--#{$table}__button--PaddingBlockStart: var(--pf-t--global--spacer--
|
|
93
|
-
--#{$table}__button--PaddingBlockEnd: var(--pf-t--global--spacer--
|
|
92
|
+
--#{$table}__button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
|
|
93
|
+
--#{$table}__button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
|
|
94
94
|
--#{$table}__button--PaddingInlineStart: var(--pf-t--global--spacer--md);
|
|
95
95
|
--#{$table}__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
|
|
96
96
|
--#{$table}__button--Color: var(--pf-t--global--text--color--regular);
|
|
@@ -241,7 +241,7 @@
|
|
|
241
241
|
// * Table nested column header
|
|
242
242
|
--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth: var(--#{$table}--border-width--base);
|
|
243
243
|
--#{$table}__thead--m-nested-column-header--BorderBlockEndColor: var(--#{$table}--BorderColor);
|
|
244
|
-
--#{$table}__thead--m-nested-column-header--after--ZIndex:
|
|
244
|
+
--#{$table}__thead--m-nested-column-header--after--ZIndex: initial;
|
|
245
245
|
--#{$table}__thead--m-nested-column-header--button--OutlineOffset: #{pf-size-prem(-3px)};
|
|
246
246
|
--#{$table}__thead--m-nested-column-header__tr--PaddingBlockStart: var(--pf-t--global--spacer--xs);
|
|
247
247
|
--#{$table}__thead--m-nested-column-header__tr--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
|
@@ -269,6 +269,10 @@
|
|
|
269
269
|
--#{$table}--m-sticky-header--BoxShadow--glass: var(--pf-t--global--box-shadow--sm);
|
|
270
270
|
--#{$table}--m-sticky-header--TransitionTimingFunction--BackgroundColor: var(--pf-t--global--motion--timing-function--default);
|
|
271
271
|
--#{$table}--m-sticky-header--TransitionDuration--BackgroundColor: var(--pf-t--global--motion--duration--fade--default);
|
|
272
|
+
|
|
273
|
+
// * Table sticky footer
|
|
274
|
+
--#{$table}--m-sticky-footer--ZIndex: calc(var(--pf-t--global--z-index--xs) + 1);
|
|
275
|
+
--#{$table}--m-sticky-footer--border--ZIndex: calc(var(--pf-t--global--z-index--xs) + 2);
|
|
272
276
|
|
|
273
277
|
:where(.pf-v6-theme-glass) & {
|
|
274
278
|
--#{$table}--m-sticky-header--BorderBlockEndWidth: 0;
|
|
@@ -297,8 +301,8 @@
|
|
|
297
301
|
table-layout: fixed;
|
|
298
302
|
}
|
|
299
303
|
|
|
300
|
-
&.pf-m-sticky-header-base > .#{$table}__thead
|
|
301
|
-
|
|
304
|
+
&.pf-m-sticky-header-base > .#{$table}__thead,
|
|
305
|
+
&.pf-m-sticky-header-base > .#{$table}__thead .#{$table}__th {
|
|
302
306
|
&::after {
|
|
303
307
|
opacity: 0;
|
|
304
308
|
transition-timing-function: var(--#{$table}--m-sticky-header--TransitionTimingFunction--BackgroundColor);
|
|
@@ -307,13 +311,8 @@
|
|
|
307
311
|
}
|
|
308
312
|
}
|
|
309
313
|
|
|
310
|
-
&.pf-m-sticky-header,
|
|
311
|
-
&.pf-m-sticky-header-stuck {
|
|
312
|
-
--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth: 0;
|
|
313
|
-
}
|
|
314
|
-
|
|
315
|
-
&.pf-m-sticky-header-stuck > .#{$table}__thead {
|
|
316
|
-
&::before,
|
|
314
|
+
&.pf-m-sticky-header-stuck > .#{$table}__thead,
|
|
315
|
+
&.pf-m-sticky-header-stuck > .#{$table}__thead .#{$table}__th {
|
|
317
316
|
&::after {
|
|
318
317
|
opacity: 1;
|
|
319
318
|
}
|
|
@@ -328,32 +327,47 @@
|
|
|
328
327
|
inset-block-start: 0;
|
|
329
328
|
z-index: var(--#{$table}--m-sticky-header--ZIndex);
|
|
330
329
|
|
|
331
|
-
&::
|
|
330
|
+
&::after {
|
|
332
331
|
position: absolute;
|
|
333
332
|
inset: 0;
|
|
334
333
|
z-index: -1;
|
|
335
334
|
pointer-events: none;
|
|
336
335
|
content: '';
|
|
337
|
-
background-color: var(--#{$table}--m-sticky-header--BackgroundColor);
|
|
338
336
|
border-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
339
337
|
box-shadow: var(--#{$table}--m-sticky-header--BoxShadow);
|
|
340
338
|
}
|
|
339
|
+
|
|
340
|
+
|
|
341
|
+
.#{$table}__th::after {
|
|
342
|
+
position: absolute;
|
|
343
|
+
inset: 0;
|
|
344
|
+
z-index: -1;
|
|
345
|
+
pointer-events: none;
|
|
346
|
+
content: '';
|
|
347
|
+
background-color: var(--#{$table}--m-sticky-header--BackgroundColor);
|
|
348
|
+
border-block-end: var(--#{$table}--m-sticky-header--BorderBlockEndWidth) solid var(--#{$table}--m-sticky-header--BorderBlockEndColor);
|
|
349
|
+
}
|
|
350
|
+
|
|
351
|
+
.#{$table}__th:first-child::after {
|
|
352
|
+
border-start-start-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
353
|
+
border-end-start-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
.#{$table}__th:last-child::after {
|
|
357
|
+
border-start-end-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
358
|
+
border-end-end-radius: var(--#{$table}--m-sticky-header--BorderRadius);
|
|
359
|
+
}
|
|
341
360
|
|
|
342
361
|
> :where(th, td) {
|
|
343
362
|
z-index: var(--#{$table}--m-sticky-header--cell--ZIndex); // set z-index here to allow sticky column to override
|
|
344
363
|
}
|
|
345
364
|
}
|
|
346
|
-
}
|
|
347
365
|
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
z-index: var(--#{$table}--m-sticky-header--border--ZIndex);
|
|
354
|
-
pointer-events: none;
|
|
355
|
-
content: '';
|
|
356
|
-
border-block-end: var(--#{$table}--m-sticky-header--BorderBlockEndWidth) solid var(--#{$table}--m-sticky-header--BorderBlockEndColor);
|
|
366
|
+
:where(.pf-v6-theme-glass) & {
|
|
367
|
+
.pf-m-nested-column-header {
|
|
368
|
+
--#{$table}--m-sticky-header--BorderRadius: 0;
|
|
369
|
+
--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth: 0;
|
|
370
|
+
}
|
|
357
371
|
}
|
|
358
372
|
}
|
|
359
373
|
|
|
@@ -373,6 +387,34 @@
|
|
|
373
387
|
}
|
|
374
388
|
}
|
|
375
389
|
|
|
390
|
+
// - Table sticky footer
|
|
391
|
+
&.pf-m-sticky-footer {
|
|
392
|
+
> .#{$table}__tfoot {
|
|
393
|
+
position: sticky;
|
|
394
|
+
inset-block-end: 0;
|
|
395
|
+
z-index: var(--#{$table}--m-sticky-footer--ZIndex);
|
|
396
|
+
background: var(--#{$table}--BackgroundColor);
|
|
397
|
+
|
|
398
|
+
&::before {
|
|
399
|
+
position: absolute;
|
|
400
|
+
inset: 0;
|
|
401
|
+
z-index: var(--#{$table}--m-sticky-footer--border--ZIndex);
|
|
402
|
+
pointer-events: none;
|
|
403
|
+
content: "";
|
|
404
|
+
border-block-start: var(--#{$table}--border-width--base) solid var(--#{$table}--BorderColor);
|
|
405
|
+
}
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
> .#{$table}__tbody:last-of-type > .#{$table}__tr:last-of-type {
|
|
409
|
+
border-block-end: 0;
|
|
410
|
+
}
|
|
411
|
+
}
|
|
412
|
+
|
|
413
|
+
// - Table plain
|
|
414
|
+
&.pf-m-plain {
|
|
415
|
+
--#{$table}--BackgroundColor: transparent;
|
|
416
|
+
}
|
|
417
|
+
|
|
376
418
|
// - Table striped
|
|
377
419
|
// stylelint-disable
|
|
378
420
|
&.pf-m-striped:not(.pf-m-expandable) > tbody:where(.#{$table}__tbody) > tr:where(.#{$table}__tr):nth-child(odd), // regular table
|
|
@@ -544,8 +586,8 @@
|
|
|
544
586
|
// }
|
|
545
587
|
|
|
546
588
|
.#{$table}__td.pf-m-action {
|
|
547
|
-
|
|
548
|
-
|
|
589
|
+
--#{$table}--cell--PaddingBlockStart: var(--#{$table}__td--m-action--PaddingBlockStart);
|
|
590
|
+
--#{$table}--cell--PaddingBlockEnd: var(--#{$table}__td--m-action--PaddingBlockEnd);
|
|
549
591
|
}
|
|
550
592
|
|
|
551
593
|
// - Table sort
|
|
@@ -1235,8 +1277,8 @@
|
|
|
1235
1277
|
}
|
|
1236
1278
|
|
|
1237
1279
|
.#{$table}__td.pf-m-action {
|
|
1238
|
-
|
|
1239
|
-
|
|
1280
|
+
--#{$table}--cell--PaddingBlockStart: var(--#{$table}--m-compact__td--m-action--PaddingBlockStart);
|
|
1281
|
+
--#{$table}--cell--PaddingBlockEnd: var(--#{$table}--m-compact__td--m-action--PaddingBlockEnd);
|
|
1240
1282
|
}
|
|
1241
1283
|
|
|
1242
1284
|
.#{$table}__icon {
|
|
@@ -1256,14 +1298,12 @@
|
|
|
1256
1298
|
|
|
1257
1299
|
// - Table nested column header button
|
|
1258
1300
|
&.pf-m-nested-column-header {
|
|
1301
|
+
--#{$table}--m-sticky-header--BorderBlockEndWidth: 0;
|
|
1302
|
+
|
|
1259
1303
|
position: relative;
|
|
1260
1304
|
|
|
1261
|
-
|
|
1262
|
-
position: absolute;
|
|
1263
|
-
inset: 0;
|
|
1305
|
+
.#{$table}__tr:last-child:not(.pf-m-border-row) {
|
|
1264
1306
|
z-index: var(--#{$table}__thead--m-nested-column-header--after--ZIndex);
|
|
1265
|
-
pointer-events: none;
|
|
1266
|
-
content: '';
|
|
1267
1307
|
border-block-end: var(--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth) solid var(--#{$table}__thead--m-nested-column-header--BorderBlockEndColor);
|
|
1268
1308
|
}
|
|
1269
1309
|
|
|
@@ -1327,10 +1367,18 @@
|
|
|
1327
1367
|
}
|
|
1328
1368
|
|
|
1329
1369
|
&.pf-m-border-row {
|
|
1330
|
-
|
|
1370
|
+
height: var(--#{$table}--border-width--base);
|
|
1371
|
+
background-color: var(--#{$table}--BorderColor);
|
|
1331
1372
|
}
|
|
1332
1373
|
}
|
|
1333
1374
|
|
|
1375
|
+
// - Table tfoot
|
|
1376
|
+
.#{$table}__tfoot {
|
|
1377
|
+
--#{$table}__tr--BorderBlockEndWidth: 0;
|
|
1378
|
+
|
|
1379
|
+
vertical-align: top;
|
|
1380
|
+
}
|
|
1381
|
+
|
|
1334
1382
|
// - Table icon inline
|
|
1335
1383
|
.#{$table}__icon-inline {
|
|
1336
1384
|
display: flex;
|
package/components/Tabs/tabs.css
CHANGED
|
@@ -50,10 +50,10 @@
|
|
|
50
50
|
--pf-v6-c-tabs__link--BorderColor: transparent;
|
|
51
51
|
--pf-v6-c-tabs__link--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
|
|
52
52
|
--pf-v6-c-tabs__link--disabled--BorderColor: transparent;
|
|
53
|
-
--pf-v6-c-tabs__link--PaddingBlockStart: var(--pf-t--global--spacer--
|
|
54
|
-
--pf-v6-c-tabs__link--PaddingInlineEnd: var(--pf-t--global--spacer--
|
|
55
|
-
--pf-v6-c-tabs__link--PaddingBlockEnd: var(--pf-t--global--spacer--
|
|
56
|
-
--pf-v6-c-tabs__link--PaddingInlineStart: var(--pf-t--global--spacer--
|
|
53
|
+
--pf-v6-c-tabs__link--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
|
|
54
|
+
--pf-v6-c-tabs__link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
55
|
+
--pf-v6-c-tabs__link--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
|
|
56
|
+
--pf-v6-c-tabs__link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
57
57
|
--pf-v6-c-tabs__link--ColumnGap: var(--pf-t--global--spacer--sm);
|
|
58
58
|
--pf-v6-c-tabs__link--disabled--Color: var(--pf-t--global--text--color--disabled);
|
|
59
59
|
--pf-v6-c-tabs__link--disabled--BackgroundColor: transparent;
|
|
@@ -72,9 +72,15 @@
|
|
|
72
72
|
--pf-v6-c-tabs--m-box--m-secondary__link--disabled--BackgroundColor: transparent;
|
|
73
73
|
--pf-v6-c-tabs--m-box--m-secondary__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
|
|
74
74
|
--pf-v6-c-tabs--m-box--m-secondary__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
|
|
75
|
-
--pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
|
|
76
75
|
--pf-v6-c-tabs__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--short);
|
|
77
76
|
--pf-v6-c-tabs__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
|
|
77
|
+
--pf-v6-c-tabs--m-subtab__link--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) - var(--pf-t--global--spacer--control--vertical--compact) + (var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body) - 1lh) / 2);
|
|
78
|
+
--pf-v6-c-tabs--m-subtab__link--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) - var(--pf-t--global--spacer--control--vertical--compact) + (var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body) - 1lh) / 2);
|
|
79
|
+
--pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--body--sm);
|
|
80
|
+
--pf-v6-c-tabs--m-subtab__link--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
|
|
81
|
+
--pf-v6-c-tabs--m-subtab__link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
82
|
+
--pf-v6-c-tabs--m-subtab__link--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
|
|
83
|
+
--pf-v6-c-tabs--m-subtab__link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
78
84
|
--pf-v6-c-tabs__link--before--border-color--base: var(--pf-t--global--border--color--default);
|
|
79
85
|
--pf-v6-c-tabs__link--before--border-width--base: var(--pf-t--global--border--width--regular);
|
|
80
86
|
--pf-v6-c-tabs__link--before--BorderBlockStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
|
|
@@ -441,9 +447,17 @@
|
|
|
441
447
|
}
|
|
442
448
|
.pf-v6-c-tabs.pf-m-subtab {
|
|
443
449
|
--pf-v6-c-tabs__link--FontSize: var(--pf-v6-c-tabs--m-subtab__link--FontSize);
|
|
450
|
+
--pf-v6-c-tabs__link--PaddingBlockStart: var(--pf-v6-c-tabs--m-subtab__link--PaddingBlockStart);
|
|
451
|
+
--pf-v6-c-tabs__link--PaddingBlockEnd: var(--pf-v6-c-tabs--m-subtab__link--PaddingBlockEnd);
|
|
452
|
+
--pf-v6-c-tabs__link--PaddingInlineStart: var(--pf-v6-c-tabs--m-subtab__link--PaddingInlineStart);
|
|
453
|
+
--pf-v6-c-tabs__link--PaddingInlineEnd: var(--pf-v6-c-tabs--m-subtab__link--PaddingInlineEnd);
|
|
444
454
|
--pf-v6-c-tabs__item-action--c-button--FontSize: var(--pf-v6-c-tabs--m-subtab__item-action--c-button--FontSize);
|
|
445
455
|
--pf-v6-c-tabs__add--c-button--FontSize: var(--pf-v6-c-tabs--m-subtab__add--c-button--FontSize);
|
|
446
456
|
}
|
|
457
|
+
.pf-v6-c-tabs.pf-m-subtab .pf-v6-c-tabs__link {
|
|
458
|
+
margin-block-start: var(--pf-v6-c-tabs--m-subtab__link--MarginBlockStart);
|
|
459
|
+
margin-block-end: var(--pf-v6-c-tabs--m-subtab__link--MarginBlockEnd);
|
|
460
|
+
}
|
|
447
461
|
.pf-v6-c-tabs.pf-m-page-insets {
|
|
448
462
|
--pf-v6-c-tabs--inset: var(--pf-v6-c-tabs--m-page-insets--inset);
|
|
449
463
|
}
|
|
@@ -70,10 +70,10 @@ $pf-v6-c-tabs--spacer-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl
|
|
|
70
70
|
--#{$tabs}__link--BorderColor: transparent;
|
|
71
71
|
--#{$tabs}__link--hover--BorderColor: var(--pf-t--global--border--color--high-contrast);
|
|
72
72
|
--#{$tabs}__link--disabled--BorderColor: transparent;
|
|
73
|
-
--#{$tabs}__link--PaddingBlockStart: var(--pf-t--global--spacer--
|
|
74
|
-
--#{$tabs}__link--PaddingInlineEnd: var(--pf-t--global--spacer--
|
|
75
|
-
--#{$tabs}__link--PaddingBlockEnd: var(--pf-t--global--spacer--
|
|
76
|
-
--#{$tabs}__link--PaddingInlineStart: var(--pf-t--global--spacer--
|
|
73
|
+
--#{$tabs}__link--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
|
|
74
|
+
--#{$tabs}__link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
75
|
+
--#{$tabs}__link--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
|
|
76
|
+
--#{$tabs}__link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
77
77
|
--#{$tabs}__link--ColumnGap: var(--pf-t--global--spacer--sm);
|
|
78
78
|
--#{$tabs}__link--disabled--Color: var(--pf-t--global--text--color--disabled);
|
|
79
79
|
--#{$tabs}__link--disabled--BackgroundColor: transparent;
|
|
@@ -92,10 +92,18 @@ $pf-v6-c-tabs--spacer-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl
|
|
|
92
92
|
--#{$tabs}--m-box--m-secondary__link--disabled--BackgroundColor: transparent;
|
|
93
93
|
--#{$tabs}--m-box--m-secondary__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
|
|
94
94
|
--#{$tabs}--m-box--m-secondary__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
|
|
95
|
-
--#{$tabs}--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
|
|
96
95
|
--#{$tabs}__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--short);
|
|
97
96
|
--#{$tabs}__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
|
|
98
97
|
|
|
98
|
+
// Subtab link
|
|
99
|
+
--#{$tabs}--m-subtab__link--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) - var(--pf-t--global--spacer--control--vertical--compact) + (var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body) - 1lh) / 2);
|
|
100
|
+
--#{$tabs}--m-subtab__link--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) - var(--pf-t--global--spacer--control--vertical--compact) + (var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body) - 1lh) / 2);
|
|
101
|
+
--#{$tabs}--m-subtab__link--FontSize: var(--pf-t--global--font--size--body--sm);
|
|
102
|
+
--#{$tabs}--m-subtab__link--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
|
|
103
|
+
--#{$tabs}--m-subtab__link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
104
|
+
--#{$tabs}--m-subtab__link--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
|
|
105
|
+
--#{$tabs}--m-subtab__link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
|
|
106
|
+
|
|
99
107
|
// Link before
|
|
100
108
|
--#{$tabs}__link--before--border-color--base: var(--pf-t--global--border--color--default);
|
|
101
109
|
--#{$tabs}__link--before--border-width--base: var(--pf-t--global--border--width--regular);
|
|
@@ -512,8 +520,17 @@ $pf-v6-c-tabs--spacer-map: build-spacer-map("none", "sm", "md", "lg", "xl", "2xl
|
|
|
512
520
|
|
|
513
521
|
&.pf-m-subtab {
|
|
514
522
|
--#{$tabs}__link--FontSize: var(--#{$tabs}--m-subtab__link--FontSize);
|
|
523
|
+
--#{$tabs}__link--PaddingBlockStart: var(--#{$tabs}--m-subtab__link--PaddingBlockStart);
|
|
524
|
+
--#{$tabs}__link--PaddingBlockEnd: var(--#{$tabs}--m-subtab__link--PaddingBlockEnd);
|
|
525
|
+
--#{$tabs}__link--PaddingInlineStart: var(--#{$tabs}--m-subtab__link--PaddingInlineStart);
|
|
526
|
+
--#{$tabs}__link--PaddingInlineEnd: var(--#{$tabs}--m-subtab__link--PaddingInlineEnd);
|
|
515
527
|
--#{$tabs}__item-action--c-button--FontSize: var(--#{$tabs}--m-subtab__item-action--c-button--FontSize);
|
|
516
528
|
--#{$tabs}__add--c-button--FontSize: var(--#{$tabs}--m-subtab__add--c-button--FontSize);
|
|
529
|
+
|
|
530
|
+
.#{$tabs}__link {
|
|
531
|
+
margin-block-start: var(--#{$tabs}--m-subtab__link--MarginBlockStart);
|
|
532
|
+
margin-block-end: var(--#{$tabs}--m-subtab__link--MarginBlockEnd);
|
|
533
|
+
}
|
|
517
534
|
}
|
|
518
535
|
|
|
519
536
|
&.pf-m-page-insets {
|
|
@@ -98,7 +98,7 @@
|
|
|
98
98
|
font-size: var(--pf-v6-c-tooltip__content--FontSize);
|
|
99
99
|
color: var(--pf-v6-c-tooltip__content--Color);
|
|
100
100
|
text-align: center;
|
|
101
|
-
overflow-wrap:
|
|
101
|
+
overflow-wrap: anywhere;
|
|
102
102
|
background-color: var(--pf-v6-c-tooltip__content--BackgroundColor);
|
|
103
103
|
border-radius: var(--pf-v6-c-tooltip__content--BorderRadius);
|
|
104
104
|
}
|
|
@@ -129,7 +129,7 @@
|
|
|
129
129
|
font-size: var(--#{$tooltip}__content--FontSize);
|
|
130
130
|
color: var(--#{$tooltip}__content--Color);
|
|
131
131
|
text-align: center;
|
|
132
|
-
overflow-wrap:
|
|
132
|
+
overflow-wrap: anywhere;
|
|
133
133
|
background-color: var(--#{$tooltip}__content--BackgroundColor);
|
|
134
134
|
border-radius: var(--#{$tooltip}__content--BorderRadius);
|
|
135
135
|
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
.pf-v6-c-tree-view {
|
|
2
|
-
--pf-v6-c-tree-view__node--indent--base: calc(var(--pf-
|
|
2
|
+
--pf-v6-c-tree-view__node--indent--base: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingInlineStart) + var(--pf-v6-c-tree-view__node-toggle--PaddingInlineEnd) + var(--pf-v6-c-tree-view__node-toggle-icon--MinWidth));
|
|
3
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));
|
|
4
4
|
--pf-v6-c-tree-view__content--BorderRadius: var(--pf-t--global--border--radius--small);
|
|
5
|
-
--pf-v6-c-tree-view__node--PaddingBlockStart: var(--pf-t--global--spacer--
|
|
6
|
-
--pf-v6-c-tree-view__node--PaddingInlineEnd: var(--pf-t--global--spacer--
|
|
7
|
-
--pf-v6-c-tree-view__node--PaddingBlockEnd: var(--pf-t--global--spacer--
|
|
5
|
+
--pf-v6-c-tree-view__node--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
|
|
6
|
+
--pf-v6-c-tree-view__node--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
|
|
7
|
+
--pf-v6-c-tree-view__node--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
|
|
8
8
|
--pf-v6-c-tree-view__node--PaddingInlineStart: var(--pf-v6-c-tree-view__node--indent--base);
|
|
9
9
|
--pf-v6-c-tree-view__node--Color: var(--pf-t--global--text--color--subtle);
|
|
10
10
|
--pf-v6-c-tree-view__node--BackgroundColor: transparent;
|
|
@@ -48,9 +48,9 @@
|
|
|
48
48
|
--pf-v6-c-tree-view__node-toggle--BackgroundColor: transparent;
|
|
49
49
|
--pf-v6-c-tree-view__list-item--m-expanded__node-toggle--Color: var(--pf-t--global--icon--color--regular);
|
|
50
50
|
--pf-v6-c-tree-view__node-toggle-icon--MinWidth: var(--pf-t--global--icon--size--font--body--default);
|
|
51
|
-
--pf-v6-c-tree-view__node-toggle--PaddingBlockStart: var(--pf-t--global--spacer--
|
|
51
|
+
--pf-v6-c-tree-view__node-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
|
|
52
52
|
--pf-v6-c-tree-view__node-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
|
|
53
|
-
--pf-v6-c-tree-view__node-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--
|
|
53
|
+
--pf-v6-c-tree-view__node-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
|
|
54
54
|
--pf-v6-c-tree-view__node-toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
|
|
55
55
|
--pf-v6-c-tree-view__node-toggle--MarginBlockStart: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingBlockStart) * -1);
|
|
56
56
|
--pf-v6-c-tree-view__node-toggle--MarginBlockEnd: calc(var(--pf-v6-c-tree-view__node-toggle--PaddingBlockStart) * -1);
|
|
@@ -66,7 +66,7 @@
|
|
|
66
66
|
--pf-v6-c-tree-view__node-icon--Color: var(--pf-t--global--icon--color--subtle);
|
|
67
67
|
--pf-v6-c-tree-view__node-toggle-icon--base--Rotate: 0;
|
|
68
68
|
--pf-v6-c-tree-view__node-toggle-icon--Rotate: var(--pf-v6-c-tree-view__node-toggle-icon--base--Rotate);
|
|
69
|
-
--pf-v6-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate:
|
|
69
|
+
--pf-v6-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate: 90deg;
|
|
70
70
|
--pf-v6-c-tree-view__node--m-disabled--Color: var(--pf-t--global--text--color--disabled);
|
|
71
71
|
--pf-v6-c-tree-view__node-icon--m-disabled--Color: var(--pf-t--global--icon--color--disabled);
|
|
72
72
|
--pf-v6-c-tree-view__node-toggle--m-disabled--Color: var(--pf-t--global--icon--color--disabled);
|
|
@@ -4,16 +4,16 @@ $pf-v6-c-tree-view--MaxNesting: 10 !default;
|
|
|
4
4
|
|
|
5
5
|
@include pf-root($tree-view) {
|
|
6
6
|
// Node base
|
|
7
|
-
--#{$tree-view}__node--indent--base: calc(var(
|
|
7
|
+
--#{$tree-view}__node--indent--base: calc(var(--#{$tree-view}__node-toggle--PaddingInlineStart) + var(--#{$tree-view}__node-toggle--PaddingInlineEnd) + var(--#{$tree-view}__node-toggle-icon--MinWidth)); // based off of the expected width of the toggle button
|
|
8
8
|
--#{$tree-view}__node--nested-indent--base: calc(var(--#{$tree-view}__node--indent--base) - var(--pf-t--global--spacer--md)); // nested spacing that removes the toggle button's left padding, so the icon aligns with text on the node above it
|
|
9
9
|
|
|
10
10
|
// Content
|
|
11
11
|
--#{$tree-view}__content--BorderRadius: var(--pf-t--global--border--radius--small);
|
|
12
12
|
|
|
13
13
|
// Node
|
|
14
|
-
--#{$tree-view}__node--PaddingBlockStart: var(--pf-t--global--spacer--
|
|
15
|
-
--#{$tree-view}__node--PaddingInlineEnd: var(--pf-t--global--spacer--
|
|
16
|
-
--#{$tree-view}__node--PaddingBlockEnd: var(--pf-t--global--spacer--
|
|
14
|
+
--#{$tree-view}__node--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
|
|
15
|
+
--#{$tree-view}__node--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
|
|
16
|
+
--#{$tree-view}__node--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
|
|
17
17
|
--#{$tree-view}__node--PaddingInlineStart: var(--#{$tree-view}__node--indent--base);
|
|
18
18
|
--#{$tree-view}__node--Color: var(--pf-t--global--text--color--subtle);
|
|
19
19
|
--#{$tree-view}__node--BackgroundColor: transparent;
|
|
@@ -66,9 +66,9 @@ $pf-v6-c-tree-view--MaxNesting: 10 !default;
|
|
|
66
66
|
|
|
67
67
|
// Toggle icon
|
|
68
68
|
--#{$tree-view}__node-toggle-icon--MinWidth: var(--pf-t--global--icon--size--font--body--default);
|
|
69
|
-
--#{$tree-view}__node-toggle--PaddingBlockStart: var(--pf-t--global--spacer--
|
|
69
|
+
--#{$tree-view}__node-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
|
|
70
70
|
--#{$tree-view}__node-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
|
|
71
|
-
--#{$tree-view}__node-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--
|
|
71
|
+
--#{$tree-view}__node-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
|
|
72
72
|
--#{$tree-view}__node-toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
|
|
73
73
|
--#{$tree-view}__node-toggle--MarginBlockStart: calc(var(--#{$tree-view}__node-toggle--PaddingBlockStart) * -1);
|
|
74
74
|
--#{$tree-view}__node-toggle--MarginBlockEnd: calc(var(--#{$tree-view}__node-toggle--PaddingBlockStart) * -1);
|
|
@@ -92,7 +92,7 @@ $pf-v6-c-tree-view--MaxNesting: 10 !default;
|
|
|
92
92
|
--#{$tree-view}__node-icon--Color: var(--pf-t--global--icon--color--subtle);
|
|
93
93
|
--#{$tree-view}__node-toggle-icon--base--Rotate: 0;
|
|
94
94
|
--#{$tree-view}__node-toggle-icon--Rotate: var(--#{$tree-view}__node-toggle-icon--base--Rotate);
|
|
95
|
-
--#{$tree-view}__list-item--m-expanded__node-toggle-icon--Rotate:
|
|
95
|
+
--#{$tree-view}__list-item--m-expanded__node-toggle-icon--Rotate: 90deg;
|
|
96
96
|
|
|
97
97
|
// Disabled
|
|
98
98
|
--#{$tree-view}__node--m-disabled--Color: var(--pf-t--global--text--color--disabled);
|
|
@@ -133,7 +133,7 @@
|
|
|
133
133
|
--pf-v6-c-wizard__main-body--PaddingInlineStart: var(--pf-t--global--spacer--lg);
|
|
134
134
|
--pf-v6-c-wizard__footer--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
135
135
|
--pf-v6-c-wizard--m-plain__footer--BackgroundColor: transparent;
|
|
136
|
-
--pf-v6-c-wizard__footer--ZIndex: var(--pf-t--global--z-index--
|
|
136
|
+
--pf-v6-c-wizard__footer--ZIndex: var(--pf-t--global--z-index--sm);
|
|
137
137
|
--pf-v6-c-wizard__footer--PaddingBlockStart: var(--pf-t--global--spacer--lg);
|
|
138
138
|
--pf-v6-c-wizard__footer--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
|
|
139
139
|
--pf-v6-c-wizard__footer--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
|
|
@@ -259,7 +259,7 @@
|
|
|
259
259
|
align-items: baseline;
|
|
260
260
|
margin-block-end: var(--pf-v6-c-wizard__toggle-list-item--MarginBlockEnd);
|
|
261
261
|
text-align: start;
|
|
262
|
-
overflow-wrap:
|
|
262
|
+
overflow-wrap: anywhere;
|
|
263
263
|
}
|
|
264
264
|
.pf-v6-c-wizard__toggle-list-item:not(:last-child) {
|
|
265
265
|
margin-inline-end: var(--pf-v6-c-wizard__toggle-list-item--not-last-child--MarginInlineEnd);
|
|
@@ -395,7 +395,7 @@
|
|
|
395
395
|
padding-inline: 0;
|
|
396
396
|
color: var(--pf-v6-c-wizard__nav-link--Color);
|
|
397
397
|
text-align: start;
|
|
398
|
-
overflow-wrap:
|
|
398
|
+
overflow-wrap: anywhere;
|
|
399
399
|
text-decoration-line: var(--pf-v6-c-wizard__nav-link--TextDecoration);
|
|
400
400
|
counter-increment: wizard-nav-count;
|
|
401
401
|
background-color: transparent;
|
|
@@ -514,7 +514,7 @@
|
|
|
514
514
|
flex-direction: column;
|
|
515
515
|
overflow-x: hidden;
|
|
516
516
|
overflow-y: auto;
|
|
517
|
-
overflow-wrap:
|
|
517
|
+
overflow-wrap: anywhere;
|
|
518
518
|
}
|
|
519
519
|
|
|
520
520
|
.pf-v6-c-wizard__main-body {
|
|
@@ -186,7 +186,7 @@
|
|
|
186
186
|
// Footer
|
|
187
187
|
--#{$wizard}__footer--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
188
188
|
--#{$wizard}--m-plain__footer--BackgroundColor: transparent;
|
|
189
|
-
--#{$wizard}__footer--ZIndex: var(--pf-t--global--z-index--
|
|
189
|
+
--#{$wizard}__footer--ZIndex: var(--pf-t--global--z-index--sm);
|
|
190
190
|
--#{$wizard}__footer--PaddingBlockStart: var(--pf-t--global--spacer--lg);
|
|
191
191
|
--#{$wizard}__footer--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
|
|
192
192
|
--#{$wizard}__footer--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
|
|
@@ -325,7 +325,7 @@
|
|
|
325
325
|
align-items: baseline;
|
|
326
326
|
margin-block-end: var(--#{$wizard}__toggle-list-item--MarginBlockEnd);
|
|
327
327
|
text-align: start;
|
|
328
|
-
overflow-wrap:
|
|
328
|
+
overflow-wrap: anywhere;
|
|
329
329
|
|
|
330
330
|
&:not(:last-child) {
|
|
331
331
|
margin-inline-end: var(--#{$wizard}__toggle-list-item--not-last-child--MarginInlineEnd);
|
|
@@ -478,7 +478,7 @@
|
|
|
478
478
|
padding-inline: 0;
|
|
479
479
|
color: var(--#{$wizard}__nav-link--Color);
|
|
480
480
|
text-align: start; // needed for when the item is a button
|
|
481
|
-
overflow-wrap:
|
|
481
|
+
overflow-wrap: anywhere;
|
|
482
482
|
text-decoration-line: var(--#{$wizard}__nav-link--TextDecoration);
|
|
483
483
|
counter-increment: wizard-nav-count;
|
|
484
484
|
background-color: transparent;
|
|
@@ -614,7 +614,7 @@
|
|
|
614
614
|
flex-direction: column;
|
|
615
615
|
overflow-x: hidden;
|
|
616
616
|
overflow-y: auto;
|
|
617
|
-
overflow-wrap:
|
|
617
|
+
overflow-wrap: anywhere;
|
|
618
618
|
}
|
|
619
619
|
|
|
620
620
|
.#{$wizard}__main-body {
|