Commit 12d24acf authored by Eric Bremner's avatar Eric Bremner

ISTWCMS-4084: adding inverted L right layout

parent 3d7ff2d2
......@@ -1765,6 +1765,27 @@ svg:not(:root) {
.layout--uwfourcol.legacy-23-27-27-23 {
grid-template-columns: 23% 27% 27% 23%; }
.layout--invertedlright {
display: grid; }
.layout--invertedlright.even-split {
grid-template-columns: 25% 25% 50%; }
.layout--invertedlright.larger-left {
grid-template-columns: 33.5% 16.5% 50%; }
.layout--invertedlright.larger-right {
grid-template-columns: 16.5% 33.5% 50%; }
.layout--invertedlright .layout__region--first {
grid-column: 1 / 2;
grid-row: 1 / 2; }
.layout--invertedlright .layout__region--first {
grid-column: 2 / 3;
grid-row: 1 / 2; }
.layout--invertedlright .layout__region--third {
grid-column: 1 / 3;
grid-row: 2 / 3; }
.layout--invertedlright .layout__region--fourth {
grid-column: 3 / 4;
grid-row: 1 / 3; }
.layout--uwfourcol {
display: grid;
grid-template-columns: 100%; }
......
.layout--invertedlright {
display: grid;
&.even-split {
grid-template-columns: 25% 25% 50%;
}
&.larger-left {
grid-template-columns: 33.5% 16.5% 50%;
}
&.larger-right {
grid-template-columns: 16.5% 33.5% 50%;
}
.layout__region--first {
grid-column: 1 / 2;
grid-row: 1 / 2;
}
.layout__region--first {
grid-column: 2 / 3;
grid-row: 1 / 2;
}
.layout__region--third {
grid-column: 1 / 3;
grid-row: 2 / 3;
}
.layout__region--fourth {
grid-column: 3 / 4;
grid-row: 1 / 3;
}
}
\ No newline at end of file
{%
set classes = [
'layout',
'layout--invertedlright',
column_class,
]
%}
<section{{ attributes.addClass(classes) }}>
<div {{ region_attributes.first.addClass('layout__region', 'layout__region--first') }}>
{% block content_first %}
Layout Region Column one
{% endblock %}
</div>
<div {{ region_attributes.second.addClass('layout__region', 'layout__region--second') }}>
{% block content_second %}
Layout Region Column two
{% endblock %}
</div>
<div {{ region_attributes.third.addClass('layout__region', 'layout__region--third') }}>
{% block content_third %}
Layout Region Column three
{% endblock %}
</div>
<div {{ region_attributes.fourth.addClass('layout__region', 'layout__region--fourth') }}>
{% block content_fourth %}
Layout Region Column four
{% endblock %}
</div>
</section>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment