Skip to content
Snippets Groups Projects
Commit 15ae3ddf authored by Eric Bremner's avatar Eric Bremner Committed by Kevin Paxman
Browse files

ISTWCMS-5905: adding background-image and updating layouts to use it

parent 74c788b8
No related branches found
No related tags found
1 merge request!62Feature/istwcms 5905 ebremner section background options
Showing
with 28 additions and 0 deletions
......@@ -6,6 +6,13 @@
5: 'fifth',
} %}
{% if options.image %}
{% include '@components/background-image/background-image.twig' with {
'image': options.image,
'image_class': 'uw-section__background-image',
} %}
{% endif %}
{% set section_classes = '' %}
<section
{% if pattern_lab %}
......
......@@ -16,6 +16,7 @@
{% include '@layouts/layout/_layout.twig' with {
classes: classes,
num_of_blocks: num_of_blocks,
options: options,
} %}
{% endif %}
......@@ -16,6 +16,7 @@
{% include '@layouts/layout/_layout.twig' with {
classes: classes,
num_of_blocks: num_of_blocks,
options: options,
} %}
{% endif %}
......@@ -16,6 +16,7 @@
{% include '@layouts/layout/_layout.twig' with {
classes: classes,
num_of_blocks: num_of_blocks,
options: options,
} %}
{% endif %}
......@@ -16,6 +16,7 @@
{% include '@layouts/layout/_layout.twig' with {
classes: classes,
num_of_blocks: num_of_blocks,
options: options,
} %}
{% endif %}
......@@ -16,6 +16,7 @@
{% include '@layouts/layout/_layout.twig' with {
classes: classes,
num_of_blocks: num_of_blocks,
options: options,
} %}
{% endif %}
......@@ -18,6 +18,7 @@
classes: classes,
num_of_blocks: num_of_blocks,
inverted_l_left: 1,
options: options,
} %}
{% endif %}
......@@ -18,6 +18,7 @@
classes: classes,
num_of_blocks: num_of_blocks,
inverted_l_right: 1,
options: options,
} %}
{% endif %}
@forward '00-cms-styles/dashboards/dashboards';
@forward '00-cms-styles/layout-builder/layout-builder';
@forward '00-cms-styles/toolbar-menu/toolbar-menu';
@forward 'background-image/background-image';
@forward 'banners/banners';
@forward 'blockquote/blockquote';
@forward 'button/button';
......
.uw-section__background-image {
background-size: cover;
}
<style>
{% for source in image.sources|reverse %}
@media only screen and {{ source.media | replace({'all and': ''}) }} {
.{{ image_class }} {
background-image: url("{{ source.srcset | replace({ ' 1x': '' }) }}");
}
}}
{% endfor %}
</style>
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment