Commit 31eb9f3c authored by Eric Bremner's avatar Eric Bremner

ISTWCMS-4092: adding node stylings with and without sidebar

parent 5cc9dcca
......@@ -1923,6 +1923,35 @@ svg:not(:root) {
margin: 0 0 0 1rem;
order: 1; }
.uw-node {
width: 100%; }
.uw-node__grid {
display: grid;
grid-gap: 1rem;
grid-template-columns: 100%; }
@media (min-width: 48.06rem) {
.uw-node__grid {
grid-template-columns: 70% 30%; } }
.uw-node__node {
grid-column: 1 / 2;
grid-row: 1 / 2; }
@media (min-width: 48.06rem) {
.uw-node__node {
grid-column: 1 / 3; } }
.uw-node__node--with-sidebar {
grid-column: 1 / 2;
grid-row: 1 / 2; }
@media (min-width: 48.06rem) {
.uw-node__node--with-sidebar {
grid-column: 1 / 2; } }
.uw-node__sidebar {
grid-column: 1 / 2;
grid-row: 2 / 3; }
@media (min-width: 48.06rem) {
.uw-node__sidebar {
grid-column: 2 / 3;
grid-row: 1 / 2; } }
.l-section {
margin-bottom: 2.5rem; }
......
$sidebar-width: 300px;
.uw-node {
width: 100%;
&__grid {
display: grid;
grid-gap: 1rem;
grid-template-columns: 100%;
@include medium {
grid-template-columns: 70% 30%;
}
}
&__node {
grid-column: 1 / 2;
grid-row: 1 / 2;
@include medium {
grid-column: 1 / 3;
}
}
&__node--with-sidebar {
grid-column: 1 / 2;
grid-row: 1 / 2;
@include medium {
grid-column: 1 / 2;
}
}
&__sidebar {
grid-column: 1 / 2;
grid-row: 2 / 3;
@include medium {
grid-column: 2 / 3;
grid-row: 1 / 2;
}
}
}
\ No newline at end of file
{% if has_sidebar == 'Yes' %}
{% set classes = classes | merge(['uw-node__node--with-sidebar']) %}
{% else %}
{% set classes = classes | merge(['uw-node__node']) %}
{% endif %}
<div class="uw-node">
<div class="uw-node__grid">
<article{{ attributes.addClass(classes) }}>
{% block content %}
This is the node content
{% endblock %}
</article>
{% if has_sidebar %}
<aside class="uw-node__sidebar">
{% block sidebar_content %}
This is the sidebar
{% endblock %}
</aside>
{% endif %}
</div>
</div>
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