Strap - Page Layout

ComboStrap supports actually, three page layouts:

• holy - the default
• median - the main content is centered and does not take the space of the sidebar if not present.
• landing - the main content is not centered and takes the full page width

The default layout is a fully responsive layout (known also as the holy grail) with:

• a header slot
• a footer slot
• and three columns:
  • left slot
  • right slot
  • main slot (ie content)

They are all contained in a page that is:

• centered
• with a width adjusted by screen size (by breakpoint)

The main content width expands to the width of the page if the sidebars are not present.

If there is no sidebars, the median layout centers the main content with a fix width, making the length of a line shorter and therefore more readable.

You can defined it with the following frontmatter

{
   "layout":"median"
}

In a landing page layout, the main content is not contained.

You can then create section of page with the slide component where the background will take the whole width of the page.

You can defined it with the following frontmatter

{
   "layout":"landing"
}

Then in your slide component, you can still center the content by adding a container.

<slide size="lg">
    <background color="light"></background>
    <container>
        ... Your content
    </container>
</slide>