This below is top-level bolt-layout with the full_bleed
prop set to true
. For this reason it hasn't got outer spaces, same as in nested bolt-layouts.
This is nested bolt-layout. Nested bolt-layouts have no paddings around by default. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Distinctio consequuntur ipsam consectetur at, quod optio! Neque quo eligendi itaque enim non fugiat odit suscipit qui voluptatum accusantium provident, quis voluptates.
{% set nested_layout %}
{% set layout_items %}
{% include '@bolt-layouts-layout/layout-item.twig' with {
content: 'content'
} only %}
{% include '@bolt-layouts-layout/layout-item.twig' with {
content: 'content'
} only %}
{% endset %}
{% include '@bolt-layouts-layout/layout.twig' with {
content: layout_items,
template: [
'25/75@from-small'
],
} only %}
{% endset %}
{% include '@bolt-layouts-layout/layout.twig' with {
content: nested_layout,
template: [
'halves@from-small',
],
full_bleed: true,
} only %}
<!-- Add prop to make top level layout behave like was nested -->
<bolt-layout template="halves@from-small" full-bleed>
<bolt-layout-item>
<!-- Add prop to make nested layout behave like was top level -->
<bolt-layout template="25/75@from-small">
<bolt-layout-item>
<!-- Content goes here -->
</bolt-layout-item>
<bolt-layout-item>
<!-- Content goes here -->
</bolt-layout-item>
</bolt-alyout>
</bolt-layout-item>
<bolt-layout-item>
<!-- Content goes here -->
</bolt-layout-item>
</bolt-layout>