<Min100Layout>
ComponentThe <Min100Layout />
component is used to render page layouts that include footers, and are intended to have a minimum height of 100vh
, such that the footer always appears at the bottom of the viewport.
<Min100Layout footer={<p style={{ margin: 0, border: '1px solid blue'}}>This is the footer.</p>}><p>This is the content area.</p><p>Put everything that will be visible on the page in this area.</p><p>This includes Navigation, AlertBanners, etc etc.</p></Min100Layout>
Name | Description |
---|---|
children* function | Render prop for the page area. All visible elements on the page, except for the footer, should be rendered as children of Min100Layout. |
className function | Optional className to pass to the root element. The root element always has a height of 100vh or greater. Styling such as page background coloration likely belongs on the root element. |
footer* function | Render prop for the footer area. This area will be displayed at the bottom of the page, regardless of the height of the page area. |