Preview
Main Wrapper
An (optional) wrapper for the main content of a webpage that sets three default bevahiors:
$max-width
, the maximum size the container can get.$layout-align
, wether to align the container (on larger screens) to the left, right or center.$layout-padding
, the padding to apply to the container (set to false to delete it);
Example
<div id="main-wrapper">
<h1 class="h3">Content inside main wrapper</h1>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ipsa dicta, laboriosam laborum ab, ex amet nesciunt quod aliquid accusamus, sapiente beatae autem. Velit optio aperiam modi esse? Nemo, quisquam voluptatum!</p>
</div>
Assets
- Filesystem Path: src/components/layout/main-wrapper/_main-wrapper.scss
- Size: 133 Bytes
-
Content:
#main-wrapper { max-width: $max-width; @include block-align($layout-align); @if $layout-padding { padding: $layout-padding; } }