@patternfly/patternfly 5.0.0-alpha.42 → 5.0.0-alpha.44
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 +3 -6
- package/components/Page/page.scss +3 -8
- package/docs/components/Page/examples/Page.md +1 -2
- package/docs/demos/Page/examples/Page.md +0 -919
- package/package.json +5 -5
- package/patternfly-no-globals.css +3 -6
- package/patternfly.css +3 -6
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
package/components/Page/page.css
CHANGED
|
@@ -185,7 +185,9 @@
|
|
|
185
185
|
grid-template-areas: "header" "main";
|
|
186
186
|
grid-template-rows: max-content 1fr;
|
|
187
187
|
grid-template-columns: 1fr;
|
|
188
|
-
height:
|
|
188
|
+
height: 100vh;
|
|
189
|
+
height: 100dvh;
|
|
190
|
+
max-height: 100%;
|
|
189
191
|
background-color: var(--pf-c-page--BackgroundColor);
|
|
190
192
|
}
|
|
191
193
|
@media (min-width: 1200px) {
|
|
@@ -237,11 +239,6 @@
|
|
|
237
239
|
grid-template-columns: max-content 1fr;
|
|
238
240
|
}
|
|
239
241
|
}
|
|
240
|
-
.pf-c-page.pf-m-full-height {
|
|
241
|
-
height: 100vh;
|
|
242
|
-
height: 100dvh;
|
|
243
|
-
max-height: 100%;
|
|
244
|
-
}
|
|
245
242
|
|
|
246
243
|
.pf-c-page__header,
|
|
247
244
|
.pf-c-page > .pf-c-masthead {
|
|
@@ -203,7 +203,9 @@ $pf-c-page--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg"
|
|
|
203
203
|
"main";
|
|
204
204
|
grid-template-rows: max-content 1fr;
|
|
205
205
|
grid-template-columns: 1fr;
|
|
206
|
-
|
|
206
|
+
height: 100vh;
|
|
207
|
+
height: 100dvh;
|
|
208
|
+
max-height: 100%;
|
|
207
209
|
background-color: var(--pf-c-page--BackgroundColor);
|
|
208
210
|
|
|
209
211
|
@media (min-width: $pf-global--breakpoint--xl) {
|
|
@@ -212,13 +214,6 @@ $pf-c-page--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg"
|
|
|
212
214
|
"nav main";
|
|
213
215
|
grid-template-columns: max-content 1fr;
|
|
214
216
|
}
|
|
215
|
-
|
|
216
|
-
// full height
|
|
217
|
-
&.pf-m-full-height {
|
|
218
|
-
height: 100vh;
|
|
219
|
-
height: 100dvh;
|
|
220
|
-
max-height: 100%;
|
|
221
|
-
}
|
|
222
217
|
}
|
|
223
218
|
|
|
224
219
|
// Header
|
|
@@ -227,7 +227,7 @@ wrapperTag: div
|
|
|
227
227
|
|
|
228
228
|
### Overview
|
|
229
229
|
|
|
230
|
-
This component provides the basic chrome for a page, including sidebar, header, and main areas.
|
|
230
|
+
This component provides the basic chrome for a page, including sidebar, header, and main areas.
|
|
231
231
|
|
|
232
232
|
### Accessibility
|
|
233
233
|
|
|
@@ -246,7 +246,6 @@ This component provides the basic chrome for a page, including sidebar, header,
|
|
|
246
246
|
| Class | Applied to | Outcome |
|
|
247
247
|
| -- | -- | -- |
|
|
248
248
|
| `.pf-c-page` | `<div>` | Declares the page component. |
|
|
249
|
-
| `.pf-m-full-height` | `.pf-c-page` | Sets the page to be full height. Eliminates the need to ensure that all ancestors of `.pf-c-page` have height of 100% set. |
|
|
250
249
|
| `.pf-c-page__header` | `<header>` | Declares the page header. |
|
|
251
250
|
| `.pf-c-page__header-brand` | `<div>` | Creates a header container to nest the brand component. |
|
|
252
251
|
| `.pf-c-page__header-brand-toggle` | `<div>` | Creates a container to nest the sidebar toggle. |
|