From 01738792e5e66e4e4f14385a45d4eadfb88a6b90 Mon Sep 17 00:00:00 2001
From: ebremner <ebremner@uwaterloo.ca>
Date: Thu, 27 Aug 2020 13:39:34 -0400
Subject: [PATCH] ISTWCMS-4051: adding 5 column layout
---
css/styles.css | 8 ++++++
.../layout--fivecol/_layout--fivecol.scss | 10 +++++++
.../layout--fivecol/layout--fivecol.twig | 28 +++++++++++++++++++
3 files changed, 46 insertions(+)
create mode 100644 source/_patterns/03-layouts/layout/layout--fivecol/_layout--fivecol.scss
create mode 100644 source/_patterns/03-layouts/layout/layout--fivecol/layout--fivecol.twig
diff --git a/css/styles.css b/css/styles.css
index 12b7e878..3bfed221 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1700,6 +1700,14 @@ svg:not(:root) {
max-width: 100%;
width: 100%; }
+.layout--fivecol-section .layout__region--first,
+.layout--fivecol-section .layout__region--second,
+.layout--fivecol-section .layout__region--third,
+.layout--fivecol-section .layout__region--fourth,
+.layout--fivecol-section .layout__region--fifth {
+ display: inline-block;
+ width: 19%; }
+
.layout.uw-contained-width {
margin-left: auto;
margin-right: auto;
diff --git a/source/_patterns/03-layouts/layout/layout--fivecol/_layout--fivecol.scss b/source/_patterns/03-layouts/layout/layout--fivecol/_layout--fivecol.scss
new file mode 100644
index 00000000..89706722
--- /dev/null
+++ b/source/_patterns/03-layouts/layout/layout--fivecol/_layout--fivecol.scss
@@ -0,0 +1,10 @@
+.layout--fivecol-section {
+ .layout__region--first,
+ .layout__region--second,
+ .layout__region--third,
+ .layout__region--fourth,
+ .layout__region--fifth {
+ display: inline-block;
+ width: 19%;
+ }
+}
\ No newline at end of file
diff --git a/source/_patterns/03-layouts/layout/layout--fivecol/layout--fivecol.twig b/source/_patterns/03-layouts/layout/layout--fivecol/layout--fivecol.twig
new file mode 100644
index 00000000..70c115b5
--- /dev/null
+++ b/source/_patterns/03-layouts/layout/layout--fivecol/layout--fivecol.twig
@@ -0,0 +1,28 @@
+<div{{ attributes }}>
+
+ <div {{ region_attributes.first.addClass('layout__region', 'layout__region--first') }}>
+ {% block content_first %}
+ Layout Region Four Column Layout
+ {% endblock %}
+ </div>
+
+ <div {{ region_attributes.second.addClass('layout__region', 'layout__region--second') }}>
+ {% block content_second %}
+ {% endblock %}
+ </div>
+
+ <div {{ region_attributes.third.addClass('layout__region', 'layout__region--third') }}>
+ {% block content_third %}
+ {% endblock %}
+ </div>
+
+ <div {{ region_attributes.fourth.addClass('layout__region', 'layout__region--fourth') }}>
+ {% block content_fourth %}
+ {% endblock %}
+ </div>
+
+ <div {{ region_attributes.fifth.addClass('layout__region', 'layout__region--fifth') }}>
+ {% block content_fifth %}
+ {% endblock %}
+ </div>
+</div>
--
GitLab