@patternfly/patternfly 6.0.0-alpha.193 → 6.0.0-alpha.194
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/Page/page.css +1 -71
- package/components/Page/page.scss +1 -42
- package/components/_index.css +1 -71
- package/docs/components/Page/examples/Page.md +0 -4
- package/package.json +1 -1
- package/patternfly-no-globals.css +1 -71
- package/patternfly.css +1 -71
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
package/components/Page/page.css
CHANGED
|
@@ -47,7 +47,6 @@
|
|
|
47
47
|
--pf-v6-c-page__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
48
48
|
--pf-v6-c-page__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
|
|
49
49
|
--pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
50
|
-
--pf-v6-c-page__main-nav--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
51
50
|
--pf-v6-c-page--section--m-limit-width--MaxWidth: calc(125rem - var(--pf-v6-c-page__sidebar--Width));
|
|
52
51
|
--pf-v6-c-page--section--m-sticky-top--ZIndex: var(--pf-t--global--z-index--md);
|
|
53
52
|
--pf-v6-c-page--section--m-sticky-top--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
|
|
@@ -57,13 +56,6 @@
|
|
|
57
56
|
--pf-v6-c-page--section--m-shadow-bottom--ZIndex: var(--pf-t--global--z-index--xs);
|
|
58
57
|
--pf-v6-c-page--section--m-shadow-top--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
|
|
59
58
|
--pf-v6-c-page--section--m-shadow-top--ZIndex: var(--pf-t--global--z-index--xs);
|
|
60
|
-
--pf-v6-c-page__main-nav--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
|
|
61
|
-
--pf-v6-c-page__main-nav--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
62
|
-
--pf-v6-c-page__main-nav--PaddingInlineEnd: 0;
|
|
63
|
-
--pf-v6-c-page__main-nav--PaddingInlineStart: 0;
|
|
64
|
-
--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
|
65
|
-
--pf-v6-c-page__main-nav--xl--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
|
66
|
-
--pf-v6-c-page__main-nav--xl--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
|
67
59
|
--pf-v6-c-page__main-subnav--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
68
60
|
--pf-v6-c-page__main-subnav--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
69
61
|
--pf-v6-c-page__main-subnav--PaddingBlockEnd: 0;
|
|
@@ -193,21 +185,18 @@
|
|
|
193
185
|
flex-grow: 0;
|
|
194
186
|
}
|
|
195
187
|
|
|
196
|
-
.pf-v6-c-page__main-nav.pf-m-limit-width > .pf-v6-c-page__main-body,
|
|
197
188
|
.pf-v6-c-page__main-breadcrumb.pf-m-limit-width > .pf-v6-c-page__main-body,
|
|
198
189
|
.pf-v6-c-page__main-tabs.pf-m-limit-width > .pf-v6-c-page__main-body,
|
|
199
190
|
.pf-v6-c-page__main-section.pf-m-limit-width > .pf-v6-c-page__main-body,
|
|
200
191
|
.pf-v6-c-page__main-wizard.pf-m-limit-width > .pf-v6-c-page__main-body {
|
|
201
192
|
max-width: var(--pf-v6-c-page--section--m-limit-width--MaxWidth);
|
|
202
193
|
}
|
|
203
|
-
.pf-v6-c-page__main-nav.pf-m-limit-width.pf-m-align-center,
|
|
204
194
|
.pf-v6-c-page__main-breadcrumb.pf-m-limit-width.pf-m-align-center,
|
|
205
195
|
.pf-v6-c-page__main-tabs.pf-m-limit-width.pf-m-align-center,
|
|
206
196
|
.pf-v6-c-page__main-section.pf-m-limit-width.pf-m-align-center,
|
|
207
197
|
.pf-v6-c-page__main-wizard.pf-m-limit-width.pf-m-align-center {
|
|
208
198
|
align-items: center;
|
|
209
199
|
}
|
|
210
|
-
.pf-v6-c-page__main-nav.pf-m-limit-width.pf-m-align-center > .pf-v6-c-page__main-body,
|
|
211
200
|
.pf-v6-c-page__main-breadcrumb.pf-m-limit-width.pf-m-align-center > .pf-v6-c-page__main-body,
|
|
212
201
|
.pf-v6-c-page__main-tabs.pf-m-limit-width.pf-m-align-center > .pf-v6-c-page__main-body,
|
|
213
202
|
.pf-v6-c-page__main-section.pf-m-limit-width.pf-m-align-center > .pf-v6-c-page__main-body,
|
|
@@ -215,7 +204,6 @@
|
|
|
215
204
|
width: 100%;
|
|
216
205
|
}
|
|
217
206
|
|
|
218
|
-
.pf-v6-c-page__main-nav,
|
|
219
207
|
.pf-v6-c-page__main-breadcrumb,
|
|
220
208
|
.pf-v6-c-page__main-tabs,
|
|
221
209
|
.pf-v6-c-page__main-section,
|
|
@@ -226,7 +214,6 @@
|
|
|
226
214
|
flex-direction: column;
|
|
227
215
|
flex-shrink: 0;
|
|
228
216
|
}
|
|
229
|
-
.pf-v6-c-page__main-nav.pf-m-overflow-scroll,
|
|
230
217
|
.pf-v6-c-page__main-breadcrumb.pf-m-overflow-scroll,
|
|
231
218
|
.pf-v6-c-page__main-tabs.pf-m-overflow-scroll,
|
|
232
219
|
.pf-v6-c-page__main-section.pf-m-overflow-scroll,
|
|
@@ -237,7 +224,6 @@
|
|
|
237
224
|
flex-shrink: 1;
|
|
238
225
|
overflow: auto;
|
|
239
226
|
}
|
|
240
|
-
.pf-v6-c-page__main-nav.pf-m-shadow-bottom,
|
|
241
227
|
.pf-v6-c-page__main-breadcrumb.pf-m-shadow-bottom,
|
|
242
228
|
.pf-v6-c-page__main-tabs.pf-m-shadow-bottom,
|
|
243
229
|
.pf-v6-c-page__main-section.pf-m-shadow-bottom,
|
|
@@ -247,7 +233,6 @@
|
|
|
247
233
|
z-index: var(--pf-v6-c-page--section--m-shadow-bottom--ZIndex);
|
|
248
234
|
box-shadow: var(--pf-v6-c-page--section--m-shadow-bottom--BoxShadow);
|
|
249
235
|
}
|
|
250
|
-
.pf-v6-c-page__main-nav.pf-m-shadow-top,
|
|
251
236
|
.pf-v6-c-page__main-breadcrumb.pf-m-shadow-top,
|
|
252
237
|
.pf-v6-c-page__main-tabs.pf-m-shadow-top,
|
|
253
238
|
.pf-v6-c-page__main-section.pf-m-shadow-top,
|
|
@@ -257,7 +242,6 @@
|
|
|
257
242
|
z-index: var(--pf-v6-c-page--section--m-shadow-top--ZIndex);
|
|
258
243
|
box-shadow: var(--pf-v6-c-page--section--m-shadow-top--BoxShadow);
|
|
259
244
|
}
|
|
260
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top,
|
|
261
245
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top,
|
|
262
246
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top,
|
|
263
247
|
.pf-v6-c-page__main-section.pf-m-sticky-top,
|
|
@@ -269,7 +253,6 @@
|
|
|
269
253
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
270
254
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
271
255
|
}
|
|
272
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom,
|
|
273
256
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom,
|
|
274
257
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom,
|
|
275
258
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom,
|
|
@@ -282,7 +265,6 @@
|
|
|
282
265
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-bottom--BoxShadow);
|
|
283
266
|
}
|
|
284
267
|
@media (min-height: 0) {
|
|
285
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-sm-height,
|
|
286
268
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-sm-height,
|
|
287
269
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-sm-height,
|
|
288
270
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-sm-height,
|
|
@@ -294,7 +276,6 @@
|
|
|
294
276
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
295
277
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
296
278
|
}
|
|
297
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-sm-height,
|
|
298
279
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-sm-height,
|
|
299
280
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-sm-height,
|
|
300
281
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-sm-height,
|
|
@@ -308,7 +289,6 @@
|
|
|
308
289
|
}
|
|
309
290
|
}
|
|
310
291
|
@media (min-height: 40rem) {
|
|
311
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-md-height,
|
|
312
292
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-md-height,
|
|
313
293
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-md-height,
|
|
314
294
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-md-height,
|
|
@@ -320,7 +300,6 @@
|
|
|
320
300
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
321
301
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
322
302
|
}
|
|
323
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-md-height,
|
|
324
303
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-md-height,
|
|
325
304
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-md-height,
|
|
326
305
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-md-height,
|
|
@@ -334,7 +313,6 @@
|
|
|
334
313
|
}
|
|
335
314
|
}
|
|
336
315
|
@media (min-height: 48rem) {
|
|
337
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-lg-height,
|
|
338
316
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-lg-height,
|
|
339
317
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-lg-height,
|
|
340
318
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-lg-height,
|
|
@@ -346,7 +324,6 @@
|
|
|
346
324
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
347
325
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
348
326
|
}
|
|
349
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-lg-height,
|
|
350
327
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-lg-height,
|
|
351
328
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-lg-height,
|
|
352
329
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-lg-height,
|
|
@@ -360,7 +337,6 @@
|
|
|
360
337
|
}
|
|
361
338
|
}
|
|
362
339
|
@media (min-height: 60rem) {
|
|
363
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-xl-height,
|
|
364
340
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-xl-height,
|
|
365
341
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-xl-height,
|
|
366
342
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-xl-height,
|
|
@@ -372,7 +348,6 @@
|
|
|
372
348
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
373
349
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
374
350
|
}
|
|
375
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-xl-height,
|
|
376
351
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-xl-height,
|
|
377
352
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-xl-height,
|
|
378
353
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-xl-height,
|
|
@@ -386,7 +361,6 @@
|
|
|
386
361
|
}
|
|
387
362
|
}
|
|
388
363
|
@media (min-height: 80rem) {
|
|
389
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-2xl-height,
|
|
390
364
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-2xl-height,
|
|
391
365
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-2xl-height,
|
|
392
366
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-2xl-height,
|
|
@@ -398,7 +372,6 @@
|
|
|
398
372
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
399
373
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
400
374
|
}
|
|
401
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-2xl-height,
|
|
402
375
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-2xl-height,
|
|
403
376
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-2xl-height,
|
|
404
377
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-2xl-height,
|
|
@@ -444,48 +417,12 @@
|
|
|
444
417
|
|
|
445
418
|
.pf-v6-c-page__main,
|
|
446
419
|
.pf-v6-c-page__main-drawer,
|
|
447
|
-
.pf-v6-c-page__main-group
|
|
448
|
-
.pf-v6-c-page__main-list {
|
|
420
|
+
.pf-v6-c-page__main-group {
|
|
449
421
|
display: flex;
|
|
450
422
|
flex-direction: column;
|
|
451
423
|
flex-grow: 1;
|
|
452
424
|
}
|
|
453
425
|
|
|
454
|
-
.pf-v6-c-page__main-nav {
|
|
455
|
-
padding-block-start: var(--pf-v6-c-page__main-nav--PaddingBlockStart);
|
|
456
|
-
padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
|
|
457
|
-
padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
|
|
458
|
-
background-color: var(--pf-v6-c-page__main-nav--BackgroundColor);
|
|
459
|
-
}
|
|
460
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top, .pf-v6-c-page__main-group.pf-m-sticky-top .pf-v6-c-page__main-nav:last-child {
|
|
461
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
462
|
-
}
|
|
463
|
-
@media (min-height: 0) {
|
|
464
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-sm-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-sm-height .pf-v6-c-page__main-nav:last-child {
|
|
465
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
466
|
-
}
|
|
467
|
-
}
|
|
468
|
-
@media (min-height: 40rem) {
|
|
469
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-md-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-md-height .pf-v6-c-page__main-nav:last-child {
|
|
470
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
471
|
-
}
|
|
472
|
-
}
|
|
473
|
-
@media (min-height: 48rem) {
|
|
474
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-lg-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-lg-height .pf-v6-c-page__main-nav:last-child {
|
|
475
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
476
|
-
}
|
|
477
|
-
}
|
|
478
|
-
@media (min-height: 60rem) {
|
|
479
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-xl-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-xl-height .pf-v6-c-page__main-nav:last-child {
|
|
480
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
481
|
-
}
|
|
482
|
-
}
|
|
483
|
-
@media (min-height: 80rem) {
|
|
484
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-2xl-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-2xl-height .pf-v6-c-page__main-nav:last-child {
|
|
485
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
486
|
-
}
|
|
487
|
-
}
|
|
488
|
-
|
|
489
426
|
.pf-v6-c-page__main-subnav {
|
|
490
427
|
padding-block-start: var(--pf-v6-c-page__main-subnav--PaddingBlockStart);
|
|
491
428
|
padding-block-end: var(--pf-v6-c-page__main-subnav--PaddingBlockEnd);
|
|
@@ -540,9 +477,6 @@
|
|
|
540
477
|
padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingInlineEnd);
|
|
541
478
|
background-color: var(--pf-v6-c-page__main-tabs--BackgroundColor);
|
|
542
479
|
}
|
|
543
|
-
.pf-v6-c-page__main-nav + .pf-v6-c-page__main-tabs {
|
|
544
|
-
--pf-v6-c-page__main-tabs--PaddingBlockStart: var(--pf-v6-c-page__main-nav--page__main-tabs--PaddingBlockStart);
|
|
545
|
-
}
|
|
546
480
|
.pf-v6-c-page__main-breadcrumb + .pf-v6-c-page__main-tabs {
|
|
547
481
|
--pf-v6-c-page__main-tabs--PaddingBlockStart: var(--pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingBlockStart);
|
|
548
482
|
}
|
|
@@ -706,10 +640,6 @@
|
|
|
706
640
|
flex-shrink: 0;
|
|
707
641
|
}
|
|
708
642
|
|
|
709
|
-
.pf-v6-c-page__main-nav .pf-v6-c-page__main-body {
|
|
710
|
-
padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
|
|
711
|
-
padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
|
|
712
|
-
}
|
|
713
643
|
.pf-v6-c-page__main-breadcrumb .pf-v6-c-page__main-body {
|
|
714
644
|
padding-inline-start: 0;
|
|
715
645
|
padding-inline-end: 0;
|
|
@@ -75,7 +75,6 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
75
75
|
--#{$page}__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
76
76
|
--#{$page}__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
|
|
77
77
|
--#{$page}__main-breadcrumb--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
78
|
-
--#{$page}__main-nav--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
79
78
|
|
|
80
79
|
// Limit width
|
|
81
80
|
--#{$page}--section--m-limit-width--MaxWidth: calc(#{pf-size-prem(2000px)} - var(--#{$page}__sidebar--Width));
|
|
@@ -92,15 +91,6 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
92
91
|
--#{$page}--section--m-shadow-top--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
|
|
93
92
|
--#{$page}--section--m-shadow-top--ZIndex: var(--pf-t--global--z-index--xs);
|
|
94
93
|
|
|
95
|
-
// Main section horizontal nav
|
|
96
|
-
--#{$page}__main-nav--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
|
|
97
|
-
--#{$page}__main-nav--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
98
|
-
--#{$page}__main-nav--PaddingInlineEnd: 0;
|
|
99
|
-
--#{$page}__main-nav--PaddingInlineStart: 0;
|
|
100
|
-
--#{$page}__main-nav--m-sticky-top--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
|
101
|
-
--#{$page}__main-nav--xl--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
|
102
|
-
--#{$page}__main-nav--xl--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
|
103
|
-
|
|
104
94
|
// Main section horizontal subnav
|
|
105
95
|
--#{$page}__main-subnav--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
106
96
|
--#{$page}__main-subnav--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
@@ -246,7 +236,6 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
246
236
|
}
|
|
247
237
|
}
|
|
248
238
|
|
|
249
|
-
.#{$page}__main-nav,
|
|
250
239
|
.#{$page}__main-breadcrumb,
|
|
251
240
|
.#{$page}__main-tabs,
|
|
252
241
|
.#{$page}__main-section,
|
|
@@ -266,7 +255,6 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
266
255
|
}
|
|
267
256
|
}
|
|
268
257
|
|
|
269
|
-
.#{$page}__main-nav,
|
|
270
258
|
.#{$page}__main-breadcrumb,
|
|
271
259
|
.#{$page}__main-tabs,
|
|
272
260
|
.#{$page}__main-section,
|
|
@@ -351,32 +339,12 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
351
339
|
|
|
352
340
|
.#{$page}__main,
|
|
353
341
|
.#{$page}__main-drawer,
|
|
354
|
-
.#{$page}__main-group
|
|
355
|
-
.#{$page}__main-list {
|
|
342
|
+
.#{$page}__main-group {
|
|
356
343
|
display: flex;
|
|
357
344
|
flex-direction: column;
|
|
358
345
|
flex-grow: 1;
|
|
359
346
|
}
|
|
360
347
|
|
|
361
|
-
.#{$page}__main-nav {
|
|
362
|
-
padding-block-start: var(--#{$page}__main-nav--PaddingBlockStart);
|
|
363
|
-
padding-inline-start: var(--#{$page}__main-nav--PaddingInlineStart);
|
|
364
|
-
padding-inline-end: var(--#{$page}__main-nav--PaddingInlineEnd);
|
|
365
|
-
background-color: var(--#{$page}__main-nav--BackgroundColor);
|
|
366
|
-
|
|
367
|
-
// Responsive height modifiers for sticky top/bottom
|
|
368
|
-
@each $breakpoint, $breakpoint-value in $pf-page-v6--height-breakpoint-map {
|
|
369
|
-
$breakpoint-name: if($breakpoint != "base", -on-#{$breakpoint}-height, "");
|
|
370
|
-
|
|
371
|
-
@include pf-v6-apply-height-breakpoint($breakpoint) {
|
|
372
|
-
&.pf-m-sticky-top#{$breakpoint-name},
|
|
373
|
-
.#{$page}__main-group.pf-m-sticky-top#{$breakpoint-name} &:last-child {
|
|
374
|
-
padding-block-end: var(--#{$page}__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
375
|
-
}
|
|
376
|
-
}
|
|
377
|
-
}
|
|
378
|
-
}
|
|
379
|
-
|
|
380
348
|
.#{$page}__main-subnav {
|
|
381
349
|
padding-block-start: var(--#{$page}__main-subnav--PaddingBlockStart);
|
|
382
350
|
padding-block-end: var(--#{$page}__main-subnav--PaddingBlockEnd);
|
|
@@ -416,10 +384,6 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
416
384
|
padding-inline-end: var(--#{$page}__main-tabs--PaddingInlineEnd);
|
|
417
385
|
background-color: var(--#{$page}__main-tabs--BackgroundColor);
|
|
418
386
|
|
|
419
|
-
.#{$page}__main-nav + & {
|
|
420
|
-
--#{$page}__main-tabs--PaddingBlockStart: var(--#{$page}__main-nav--page__main-tabs--PaddingBlockStart);
|
|
421
|
-
}
|
|
422
|
-
|
|
423
387
|
.#{$page}__main-breadcrumb + & {
|
|
424
388
|
--#{$page}__main-tabs--PaddingBlockStart: var(--#{$page}__main-breadcrumb--page__main-tabs--PaddingBlockStart);
|
|
425
389
|
}
|
|
@@ -503,11 +467,6 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
503
467
|
}
|
|
504
468
|
|
|
505
469
|
.#{$page}__main-body {
|
|
506
|
-
.#{$page}__main-nav & {
|
|
507
|
-
padding-inline-start: var(--#{$page}__main-nav--PaddingInlineStart);
|
|
508
|
-
padding-inline-end: var(--#{$page}__main-nav--PaddingInlineEnd);
|
|
509
|
-
}
|
|
510
|
-
|
|
511
470
|
.#{$page}__main-breadcrumb & {
|
|
512
471
|
padding-inline-start: 0;
|
|
513
472
|
padding-inline-end: 0;
|
package/components/_index.css
CHANGED
|
@@ -11393,7 +11393,6 @@ ul.pf-v6-c-list {
|
|
|
11393
11393
|
--pf-v6-c-page__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
11394
11394
|
--pf-v6-c-page__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
|
|
11395
11395
|
--pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
11396
|
-
--pf-v6-c-page__main-nav--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
11397
11396
|
--pf-v6-c-page--section--m-limit-width--MaxWidth: calc(125rem - var(--pf-v6-c-page__sidebar--Width));
|
|
11398
11397
|
--pf-v6-c-page--section--m-sticky-top--ZIndex: var(--pf-t--global--z-index--md);
|
|
11399
11398
|
--pf-v6-c-page--section--m-sticky-top--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
|
|
@@ -11403,13 +11402,6 @@ ul.pf-v6-c-list {
|
|
|
11403
11402
|
--pf-v6-c-page--section--m-shadow-bottom--ZIndex: var(--pf-t--global--z-index--xs);
|
|
11404
11403
|
--pf-v6-c-page--section--m-shadow-top--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
|
|
11405
11404
|
--pf-v6-c-page--section--m-shadow-top--ZIndex: var(--pf-t--global--z-index--xs);
|
|
11406
|
-
--pf-v6-c-page__main-nav--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
|
|
11407
|
-
--pf-v6-c-page__main-nav--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
11408
|
-
--pf-v6-c-page__main-nav--PaddingInlineEnd: 0;
|
|
11409
|
-
--pf-v6-c-page__main-nav--PaddingInlineStart: 0;
|
|
11410
|
-
--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd: var(--pf-t--global--spacer--md);
|
|
11411
|
-
--pf-v6-c-page__main-nav--xl--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
|
|
11412
|
-
--pf-v6-c-page__main-nav--xl--PaddingInlineStart: var(--pf-t--global--spacer--sm);
|
|
11413
11405
|
--pf-v6-c-page__main-subnav--BackgroundColor: var(--pf-t--global--background--color--primary--default);
|
|
11414
11406
|
--pf-v6-c-page__main-subnav--PaddingBlockStart: var(--pf-t--global--spacer--md);
|
|
11415
11407
|
--pf-v6-c-page__main-subnav--PaddingBlockEnd: 0;
|
|
@@ -11539,21 +11531,18 @@ ul.pf-v6-c-list {
|
|
|
11539
11531
|
flex-grow: 0;
|
|
11540
11532
|
}
|
|
11541
11533
|
|
|
11542
|
-
.pf-v6-c-page__main-nav.pf-m-limit-width > .pf-v6-c-page__main-body,
|
|
11543
11534
|
.pf-v6-c-page__main-breadcrumb.pf-m-limit-width > .pf-v6-c-page__main-body,
|
|
11544
11535
|
.pf-v6-c-page__main-tabs.pf-m-limit-width > .pf-v6-c-page__main-body,
|
|
11545
11536
|
.pf-v6-c-page__main-section.pf-m-limit-width > .pf-v6-c-page__main-body,
|
|
11546
11537
|
.pf-v6-c-page__main-wizard.pf-m-limit-width > .pf-v6-c-page__main-body {
|
|
11547
11538
|
max-width: var(--pf-v6-c-page--section--m-limit-width--MaxWidth);
|
|
11548
11539
|
}
|
|
11549
|
-
.pf-v6-c-page__main-nav.pf-m-limit-width.pf-m-align-center,
|
|
11550
11540
|
.pf-v6-c-page__main-breadcrumb.pf-m-limit-width.pf-m-align-center,
|
|
11551
11541
|
.pf-v6-c-page__main-tabs.pf-m-limit-width.pf-m-align-center,
|
|
11552
11542
|
.pf-v6-c-page__main-section.pf-m-limit-width.pf-m-align-center,
|
|
11553
11543
|
.pf-v6-c-page__main-wizard.pf-m-limit-width.pf-m-align-center {
|
|
11554
11544
|
align-items: center;
|
|
11555
11545
|
}
|
|
11556
|
-
.pf-v6-c-page__main-nav.pf-m-limit-width.pf-m-align-center > .pf-v6-c-page__main-body,
|
|
11557
11546
|
.pf-v6-c-page__main-breadcrumb.pf-m-limit-width.pf-m-align-center > .pf-v6-c-page__main-body,
|
|
11558
11547
|
.pf-v6-c-page__main-tabs.pf-m-limit-width.pf-m-align-center > .pf-v6-c-page__main-body,
|
|
11559
11548
|
.pf-v6-c-page__main-section.pf-m-limit-width.pf-m-align-center > .pf-v6-c-page__main-body,
|
|
@@ -11561,7 +11550,6 @@ ul.pf-v6-c-list {
|
|
|
11561
11550
|
width: 100%;
|
|
11562
11551
|
}
|
|
11563
11552
|
|
|
11564
|
-
.pf-v6-c-page__main-nav,
|
|
11565
11553
|
.pf-v6-c-page__main-breadcrumb,
|
|
11566
11554
|
.pf-v6-c-page__main-tabs,
|
|
11567
11555
|
.pf-v6-c-page__main-section,
|
|
@@ -11572,7 +11560,6 @@ ul.pf-v6-c-list {
|
|
|
11572
11560
|
flex-direction: column;
|
|
11573
11561
|
flex-shrink: 0;
|
|
11574
11562
|
}
|
|
11575
|
-
.pf-v6-c-page__main-nav.pf-m-overflow-scroll,
|
|
11576
11563
|
.pf-v6-c-page__main-breadcrumb.pf-m-overflow-scroll,
|
|
11577
11564
|
.pf-v6-c-page__main-tabs.pf-m-overflow-scroll,
|
|
11578
11565
|
.pf-v6-c-page__main-section.pf-m-overflow-scroll,
|
|
@@ -11583,7 +11570,6 @@ ul.pf-v6-c-list {
|
|
|
11583
11570
|
flex-shrink: 1;
|
|
11584
11571
|
overflow: auto;
|
|
11585
11572
|
}
|
|
11586
|
-
.pf-v6-c-page__main-nav.pf-m-shadow-bottom,
|
|
11587
11573
|
.pf-v6-c-page__main-breadcrumb.pf-m-shadow-bottom,
|
|
11588
11574
|
.pf-v6-c-page__main-tabs.pf-m-shadow-bottom,
|
|
11589
11575
|
.pf-v6-c-page__main-section.pf-m-shadow-bottom,
|
|
@@ -11593,7 +11579,6 @@ ul.pf-v6-c-list {
|
|
|
11593
11579
|
z-index: var(--pf-v6-c-page--section--m-shadow-bottom--ZIndex);
|
|
11594
11580
|
box-shadow: var(--pf-v6-c-page--section--m-shadow-bottom--BoxShadow);
|
|
11595
11581
|
}
|
|
11596
|
-
.pf-v6-c-page__main-nav.pf-m-shadow-top,
|
|
11597
11582
|
.pf-v6-c-page__main-breadcrumb.pf-m-shadow-top,
|
|
11598
11583
|
.pf-v6-c-page__main-tabs.pf-m-shadow-top,
|
|
11599
11584
|
.pf-v6-c-page__main-section.pf-m-shadow-top,
|
|
@@ -11603,7 +11588,6 @@ ul.pf-v6-c-list {
|
|
|
11603
11588
|
z-index: var(--pf-v6-c-page--section--m-shadow-top--ZIndex);
|
|
11604
11589
|
box-shadow: var(--pf-v6-c-page--section--m-shadow-top--BoxShadow);
|
|
11605
11590
|
}
|
|
11606
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top,
|
|
11607
11591
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top,
|
|
11608
11592
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top,
|
|
11609
11593
|
.pf-v6-c-page__main-section.pf-m-sticky-top,
|
|
@@ -11615,7 +11599,6 @@ ul.pf-v6-c-list {
|
|
|
11615
11599
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
11616
11600
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
11617
11601
|
}
|
|
11618
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom,
|
|
11619
11602
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom,
|
|
11620
11603
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom,
|
|
11621
11604
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom,
|
|
@@ -11628,7 +11611,6 @@ ul.pf-v6-c-list {
|
|
|
11628
11611
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-bottom--BoxShadow);
|
|
11629
11612
|
}
|
|
11630
11613
|
@media (min-height: 0) {
|
|
11631
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-sm-height,
|
|
11632
11614
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-sm-height,
|
|
11633
11615
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-sm-height,
|
|
11634
11616
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-sm-height,
|
|
@@ -11640,7 +11622,6 @@ ul.pf-v6-c-list {
|
|
|
11640
11622
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
11641
11623
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
11642
11624
|
}
|
|
11643
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-sm-height,
|
|
11644
11625
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-sm-height,
|
|
11645
11626
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-sm-height,
|
|
11646
11627
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-sm-height,
|
|
@@ -11654,7 +11635,6 @@ ul.pf-v6-c-list {
|
|
|
11654
11635
|
}
|
|
11655
11636
|
}
|
|
11656
11637
|
@media (min-height: 40rem) {
|
|
11657
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-md-height,
|
|
11658
11638
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-md-height,
|
|
11659
11639
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-md-height,
|
|
11660
11640
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-md-height,
|
|
@@ -11666,7 +11646,6 @@ ul.pf-v6-c-list {
|
|
|
11666
11646
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
11667
11647
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
11668
11648
|
}
|
|
11669
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-md-height,
|
|
11670
11649
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-md-height,
|
|
11671
11650
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-md-height,
|
|
11672
11651
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-md-height,
|
|
@@ -11680,7 +11659,6 @@ ul.pf-v6-c-list {
|
|
|
11680
11659
|
}
|
|
11681
11660
|
}
|
|
11682
11661
|
@media (min-height: 48rem) {
|
|
11683
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-lg-height,
|
|
11684
11662
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-lg-height,
|
|
11685
11663
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-lg-height,
|
|
11686
11664
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-lg-height,
|
|
@@ -11692,7 +11670,6 @@ ul.pf-v6-c-list {
|
|
|
11692
11670
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
11693
11671
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
11694
11672
|
}
|
|
11695
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-lg-height,
|
|
11696
11673
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-lg-height,
|
|
11697
11674
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-lg-height,
|
|
11698
11675
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-lg-height,
|
|
@@ -11706,7 +11683,6 @@ ul.pf-v6-c-list {
|
|
|
11706
11683
|
}
|
|
11707
11684
|
}
|
|
11708
11685
|
@media (min-height: 60rem) {
|
|
11709
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-xl-height,
|
|
11710
11686
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-xl-height,
|
|
11711
11687
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-xl-height,
|
|
11712
11688
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-xl-height,
|
|
@@ -11718,7 +11694,6 @@ ul.pf-v6-c-list {
|
|
|
11718
11694
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
11719
11695
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
11720
11696
|
}
|
|
11721
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-xl-height,
|
|
11722
11697
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-xl-height,
|
|
11723
11698
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-xl-height,
|
|
11724
11699
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-xl-height,
|
|
@@ -11732,7 +11707,6 @@ ul.pf-v6-c-list {
|
|
|
11732
11707
|
}
|
|
11733
11708
|
}
|
|
11734
11709
|
@media (min-height: 80rem) {
|
|
11735
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-2xl-height,
|
|
11736
11710
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-2xl-height,
|
|
11737
11711
|
.pf-v6-c-page__main-tabs.pf-m-sticky-top-on-2xl-height,
|
|
11738
11712
|
.pf-v6-c-page__main-section.pf-m-sticky-top-on-2xl-height,
|
|
@@ -11744,7 +11718,6 @@ ul.pf-v6-c-list {
|
|
|
11744
11718
|
z-index: var(--pf-v6-c-page--section--m-sticky-top--ZIndex);
|
|
11745
11719
|
box-shadow: var(--pf-v6-c-page--section--m-sticky-top--BoxShadow);
|
|
11746
11720
|
}
|
|
11747
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-bottom-on-2xl-height,
|
|
11748
11721
|
.pf-v6-c-page__main-breadcrumb.pf-m-sticky-bottom-on-2xl-height,
|
|
11749
11722
|
.pf-v6-c-page__main-tabs.pf-m-sticky-bottom-on-2xl-height,
|
|
11750
11723
|
.pf-v6-c-page__main-section.pf-m-sticky-bottom-on-2xl-height,
|
|
@@ -11790,48 +11763,12 @@ ul.pf-v6-c-list {
|
|
|
11790
11763
|
|
|
11791
11764
|
.pf-v6-c-page__main,
|
|
11792
11765
|
.pf-v6-c-page__main-drawer,
|
|
11793
|
-
.pf-v6-c-page__main-group
|
|
11794
|
-
.pf-v6-c-page__main-list {
|
|
11766
|
+
.pf-v6-c-page__main-group {
|
|
11795
11767
|
display: flex;
|
|
11796
11768
|
flex-direction: column;
|
|
11797
11769
|
flex-grow: 1;
|
|
11798
11770
|
}
|
|
11799
11771
|
|
|
11800
|
-
.pf-v6-c-page__main-nav {
|
|
11801
|
-
padding-block-start: var(--pf-v6-c-page__main-nav--PaddingBlockStart);
|
|
11802
|
-
padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
|
|
11803
|
-
padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
|
|
11804
|
-
background-color: var(--pf-v6-c-page__main-nav--BackgroundColor);
|
|
11805
|
-
}
|
|
11806
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top, .pf-v6-c-page__main-group.pf-m-sticky-top .pf-v6-c-page__main-nav:last-child {
|
|
11807
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
11808
|
-
}
|
|
11809
|
-
@media (min-height: 0) {
|
|
11810
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-sm-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-sm-height .pf-v6-c-page__main-nav:last-child {
|
|
11811
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
11812
|
-
}
|
|
11813
|
-
}
|
|
11814
|
-
@media (min-height: 40rem) {
|
|
11815
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-md-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-md-height .pf-v6-c-page__main-nav:last-child {
|
|
11816
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
11817
|
-
}
|
|
11818
|
-
}
|
|
11819
|
-
@media (min-height: 48rem) {
|
|
11820
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-lg-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-lg-height .pf-v6-c-page__main-nav:last-child {
|
|
11821
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
11822
|
-
}
|
|
11823
|
-
}
|
|
11824
|
-
@media (min-height: 60rem) {
|
|
11825
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-xl-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-xl-height .pf-v6-c-page__main-nav:last-child {
|
|
11826
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
11827
|
-
}
|
|
11828
|
-
}
|
|
11829
|
-
@media (min-height: 80rem) {
|
|
11830
|
-
.pf-v6-c-page__main-nav.pf-m-sticky-top-on-2xl-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-2xl-height .pf-v6-c-page__main-nav:last-child {
|
|
11831
|
-
padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
|
|
11832
|
-
}
|
|
11833
|
-
}
|
|
11834
|
-
|
|
11835
11772
|
.pf-v6-c-page__main-subnav {
|
|
11836
11773
|
padding-block-start: var(--pf-v6-c-page__main-subnav--PaddingBlockStart);
|
|
11837
11774
|
padding-block-end: var(--pf-v6-c-page__main-subnav--PaddingBlockEnd);
|
|
@@ -11886,9 +11823,6 @@ ul.pf-v6-c-list {
|
|
|
11886
11823
|
padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingInlineEnd);
|
|
11887
11824
|
background-color: var(--pf-v6-c-page__main-tabs--BackgroundColor);
|
|
11888
11825
|
}
|
|
11889
|
-
.pf-v6-c-page__main-nav + .pf-v6-c-page__main-tabs {
|
|
11890
|
-
--pf-v6-c-page__main-tabs--PaddingBlockStart: var(--pf-v6-c-page__main-nav--page__main-tabs--PaddingBlockStart);
|
|
11891
|
-
}
|
|
11892
11826
|
.pf-v6-c-page__main-breadcrumb + .pf-v6-c-page__main-tabs {
|
|
11893
11827
|
--pf-v6-c-page__main-tabs--PaddingBlockStart: var(--pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingBlockStart);
|
|
11894
11828
|
}
|
|
@@ -12052,10 +11986,6 @@ ul.pf-v6-c-list {
|
|
|
12052
11986
|
flex-shrink: 0;
|
|
12053
11987
|
}
|
|
12054
11988
|
|
|
12055
|
-
.pf-v6-c-page__main-nav .pf-v6-c-page__main-body {
|
|
12056
|
-
padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
|
|
12057
|
-
padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
|
|
12058
|
-
}
|
|
12059
11989
|
.pf-v6-c-page__main-breadcrumb .pf-v6-c-page__main-body {
|
|
12060
11990
|
padding-inline-start: 0;
|
|
12061
11991
|
padding-inline-end: 0;
|
|
@@ -296,9 +296,6 @@ wrapperTag: div
|
|
|
296
296
|
<section class="pf-v6-c-page__main-subnav">
|
|
297
297
|
<code>.pf-v6-c-page__main-subnav</code> for horizontal subnav navigation
|
|
298
298
|
</section>
|
|
299
|
-
<section class="pf-v6-c-page__main-nav">
|
|
300
|
-
<code>.pf-v6-c-page__main-nav</code> for tertiary navigation
|
|
301
|
-
</section>
|
|
302
299
|
<section class="pf-v6-c-page__main-tabs">
|
|
303
300
|
<code>.pf-v6-c-page__main-tabs</code> for tabs
|
|
304
301
|
</section>
|
|
@@ -390,7 +387,6 @@ This component provides the basic chrome for a page, including sidebar and main
|
|
|
390
387
|
| `.pf-v6-c-page__sidebar` | `<aside>` | Declares the page sidebar. |
|
|
391
388
|
| `.pf-v6-c-page__sidebar-body` | `<div>` | Creates a wrapper within the sidebar to hold content. **Note: The last/only `.pf-v6-c-page__sidebar-body` element will grow to fill the available vertical space. You can change this behavior using `.pf-m-fill` and `.pf-m-no-fill`, which are documented below.** |
|
|
392
389
|
| `.pf-v6-c-page__main` | `<main>` | Declares the main page area. |
|
|
393
|
-
| `.pf-v6-c-page__main-nav` | `<section>` | Creates a container to nest the (deprecated) tertiary navigation component in the main page area. |
|
|
394
390
|
| `.pf-v6-c-page__main-subnav` | `<section>` | Creates a container to nest the horizontal subnav navigation component in the main page area. |
|
|
395
391
|
| `.pf-v6-c-page__main-breadcrumb` | `<section>` | Creates a container to nest the breadcrumb component in the main page area. |
|
|
396
392
|
| `.pf-v6-c-page__main-section` | `<section>` | Creates a section container in the main page area. **Note: This section will not fill the vertical space. You can change this behavior using `.pf-m-fill` and `.pf-m-no-fill`, which are documented below.** |
|