hackertours-theme/sass/layouts/layout-3col/layout-3col.twig
Fredrik Jonsson b7977e1c28 First commit.
2017-03-09 14:29:29 +01:00

58 lines
2.2 KiB
Twig

<div class="layout-3col {{modifier_class}}">
<div class="layout-3col__full">
The <code>.layout-3col__full</code> grid item.
</div>
<div class="layout-3col__left-content">
The <code>.layout-3col__left-content</code> grid item.
</div>
<div class="layout-3col__right-sidebar">
The <code>.layout-3col__right-sidebar</code> grid item.
</div>
<div class="layout-3col__right-content">
The <code>.layout-3col__right-content</code> grid item.
</div>
<div class="layout-3col__left-sidebar">
The <code>.layout-3col__left-sidebar</code> grid item.
</div>
<div class="layout-3col__right-content">
The <code>.layout-3col__right-content</code> grid item.
</div>
<div class="layout-3col__first-left-sidebar">
The <code>.layout-3col__first-left-sidebar</code> grid item.
</div>
<div class="layout-3col__second-left-sidebar">
The <code>.layout-3col__second-left-sidebar</code> grid item.
</div>
<div class="layout-3col__col-1">
The <code>.layout-3col__col-1</code> grid item.
</div>
<div class="layout-3col__col-2">
The <code>.layout-3col__col-2</code> grid item.
</div>
<div class="layout-3col__col-3">
The <code>.layout-3col__col-3</code> grid item. Don't forget to look for the <code>.layout-3col__col-4</code> grid item at tablet sizes.
</div>
<div class="layout-3col__col-4">
The <code>.layout-3col__col-4</code> grid item.
</div>
<div class="layout-3col__full layout-3col__grid-item-container">
<div class="layout-3col__col-x">
The first <code>.layout-3col__col-x</code> grid item in this nested grid.
</div>
<div class="layout-3col__col-x">
The second <code>.layout-3col__col-x</code> grid item in this nested grid.
</div>
<div class="layout-3col__col-x">
The third <code>.layout-3col__col-x</code> grid item in this nested grid.
</div>
<div class="layout-3col__col-x">
The fourth <code>.layout-3col__col-x</code> grid item in this nested grid.
</div>
<div class="layout-3col__col-x">
The fifth <code>.layout-3col__col-x</code> grid item in this nested grid.
</div>
<div class="layout-3col__col-x">
The sixth <code>.layout-3col__col-x</code> grid item in this nested grid.
</div>
</div>
</div>