@patternfly/patternfly 6.0.0-alpha.193 → 6.0.0-alpha.195
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 +7 -140
- package/components/Page/page.scss +2 -69
- package/components/_index.css +7 -140
- package/docs/components/Page/examples/Page.md +0 -4
- package/package.json +1 -1
- package/patternfly-no-globals.css +7 -140
- package/patternfly.css +7 -140
- 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
|
}
|
|
@@ -575,16 +509,7 @@
|
|
|
575
509
|
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
576
510
|
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
577
511
|
}
|
|
578
|
-
.pf-v6-c-page__main-section.pf-m-padding
|
|
579
|
-
padding: 0;
|
|
580
|
-
}
|
|
581
|
-
.pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
582
|
-
padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
|
|
583
|
-
padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
|
|
584
|
-
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
585
|
-
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
586
|
-
}
|
|
587
|
-
.pf-v6-c-page__main-section.pf-m-no-padding, .pf-v6-c-page__main-section.pf-m-no-padding.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
512
|
+
.pf-v6-c-page__main-section.pf-m-no-padding {
|
|
588
513
|
padding: 0;
|
|
589
514
|
}
|
|
590
515
|
@media (min-width: 36rem) {
|
|
@@ -594,16 +519,7 @@
|
|
|
594
519
|
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
595
520
|
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
596
521
|
}
|
|
597
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-sm
|
|
598
|
-
padding: 0;
|
|
599
|
-
}
|
|
600
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
601
|
-
padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
|
|
602
|
-
padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
|
|
603
|
-
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
604
|
-
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
605
|
-
}
|
|
606
|
-
.pf-v6-c-page__main-section.pf-m-no-padding-on-sm, .pf-v6-c-page__main-section.pf-m-no-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
522
|
+
.pf-v6-c-page__main-section.pf-m-no-padding-on-sm {
|
|
607
523
|
padding: 0;
|
|
608
524
|
}
|
|
609
525
|
}
|
|
@@ -614,16 +530,7 @@
|
|
|
614
530
|
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
615
531
|
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
616
532
|
}
|
|
617
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-md
|
|
618
|
-
padding: 0;
|
|
619
|
-
}
|
|
620
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
621
|
-
padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
|
|
622
|
-
padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
|
|
623
|
-
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
624
|
-
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
625
|
-
}
|
|
626
|
-
.pf-v6-c-page__main-section.pf-m-no-padding-on-md, .pf-v6-c-page__main-section.pf-m-no-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
533
|
+
.pf-v6-c-page__main-section.pf-m-no-padding-on-md {
|
|
627
534
|
padding: 0;
|
|
628
535
|
}
|
|
629
536
|
}
|
|
@@ -634,16 +541,7 @@
|
|
|
634
541
|
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
635
542
|
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
636
543
|
}
|
|
637
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-lg
|
|
638
|
-
padding: 0;
|
|
639
|
-
}
|
|
640
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
641
|
-
padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
|
|
642
|
-
padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
|
|
643
|
-
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
644
|
-
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
645
|
-
}
|
|
646
|
-
.pf-v6-c-page__main-section.pf-m-no-padding-on-lg, .pf-v6-c-page__main-section.pf-m-no-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
544
|
+
.pf-v6-c-page__main-section.pf-m-no-padding-on-lg {
|
|
647
545
|
padding: 0;
|
|
648
546
|
}
|
|
649
547
|
}
|
|
@@ -654,16 +552,7 @@
|
|
|
654
552
|
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
655
553
|
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
656
554
|
}
|
|
657
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-xl
|
|
658
|
-
padding: 0;
|
|
659
|
-
}
|
|
660
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
661
|
-
padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
|
|
662
|
-
padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
|
|
663
|
-
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
664
|
-
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
665
|
-
}
|
|
666
|
-
.pf-v6-c-page__main-section.pf-m-no-padding-on-xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
555
|
+
.pf-v6-c-page__main-section.pf-m-no-padding-on-xl {
|
|
667
556
|
padding: 0;
|
|
668
557
|
}
|
|
669
558
|
}
|
|
@@ -674,16 +563,7 @@
|
|
|
674
563
|
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
675
564
|
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
676
565
|
}
|
|
677
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-2xl
|
|
678
|
-
padding: 0;
|
|
679
|
-
}
|
|
680
|
-
.pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
681
|
-
padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
|
|
682
|
-
padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
|
|
683
|
-
padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
684
|
-
padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
|
|
685
|
-
}
|
|
686
|
-
.pf-v6-c-page__main-section.pf-m-no-padding-on-2xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
|
|
566
|
+
.pf-v6-c-page__main-section.pf-m-no-padding-on-2xl {
|
|
687
567
|
padding: 0;
|
|
688
568
|
}
|
|
689
569
|
}
|
|
@@ -706,19 +586,6 @@
|
|
|
706
586
|
flex-shrink: 0;
|
|
707
587
|
}
|
|
708
588
|
|
|
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
|
-
.pf-v6-c-page__main-breadcrumb .pf-v6-c-page__main-body {
|
|
714
|
-
padding-inline-start: 0;
|
|
715
|
-
padding-inline-end: 0;
|
|
716
|
-
}
|
|
717
|
-
.pf-v6-c-page__main-tabs .pf-v6-c-page__main-body {
|
|
718
|
-
padding-inline-start: var(--pf-v6-c-page__main-tabs--PaddingInlineStart);
|
|
719
|
-
padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingInlineEnd);
|
|
720
|
-
}
|
|
721
|
-
|
|
722
589
|
.pf-v6-c-page__drawer {
|
|
723
590
|
grid-area: main;
|
|
724
591
|
}
|
|
@@ -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
|
}
|
|
@@ -459,24 +423,10 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
459
423
|
padding-block-end: var(--#{$page}__main-section--PaddingBlockEnd);
|
|
460
424
|
padding-inline-start: calc(var(--#{$page}__main-section--PaddingInlineStart) - var(--#{$page}__main-container--BorderWidth));
|
|
461
425
|
padding-inline-end: calc(var(--#{$page}__main-section--PaddingInlineEnd) - var(--#{$page}__main-container--BorderWidth));
|
|
462
|
-
|
|
463
|
-
&.pf-m-limit-width {
|
|
464
|
-
padding: 0;
|
|
465
|
-
|
|
466
|
-
.#{$page}__main-body {
|
|
467
|
-
padding-block-start: var(--#{$page}__main-section--PaddingBlockStart);
|
|
468
|
-
padding-block-end: var(--#{$page}__main-section--PaddingBlockEnd);
|
|
469
|
-
padding-inline-start: calc(var(--#{$page}__main-section--PaddingInlineStart) - var(--#{$page}__main-container--BorderWidth));
|
|
470
|
-
padding-inline-end: calc(var(--#{$page}__main-section--PaddingInlineEnd) - var(--#{$page}__main-container--BorderWidth));
|
|
471
|
-
}
|
|
472
|
-
}
|
|
473
426
|
}
|
|
474
427
|
|
|
475
428
|
&.pf-m-no-padding#{$breakpoint-name} {
|
|
476
|
-
|
|
477
|
-
&.pf-m-limit-width .#{$page}__main-body {
|
|
478
|
-
padding: 0;
|
|
479
|
-
}
|
|
429
|
+
padding: 0;
|
|
480
430
|
}
|
|
481
431
|
// stylelint-enable
|
|
482
432
|
}
|
|
@@ -502,23 +452,6 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
|
|
|
502
452
|
flex-shrink: 0;
|
|
503
453
|
}
|
|
504
454
|
|
|
505
|
-
.#{$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
|
-
.#{$page}__main-breadcrumb & {
|
|
512
|
-
padding-inline-start: 0;
|
|
513
|
-
padding-inline-end: 0;
|
|
514
|
-
}
|
|
515
|
-
|
|
516
|
-
.#{$page}__main-tabs & {
|
|
517
|
-
padding-inline-start: var(--#{$page}__main-tabs--PaddingInlineStart);
|
|
518
|
-
padding-inline-end: var(--#{$page}__main-tabs--PaddingInlineEnd);
|
|
519
|
-
}
|
|
520
|
-
}
|
|
521
|
-
|
|
522
455
|
.#{$page}__drawer {
|
|
523
456
|
grid-area: main;
|
|
524
457
|
|