From 2737a4422dd39115653bd207ca0c28ec464b10d3 Mon Sep 17 00:00:00 2001
From: ebremner <ebremner@uwaterloo.ca>
Date: Wed, 25 Mar 2020 15:16:49 -0400
Subject: [PATCH] ISTWCMS-3664: adding stylings for columed layouts
---
.../_patterns/03-layouts/layout/_layout.scss | 6 ++---
.../layout--fourcol/_layout--fourcol.scss | 0
.../layout--fourcol/layout--fourcol.twig | 23 +++++++++++++++++++
.../layout--fourcol/layout--fourcol.yml | 0
.../layout--threecol/_layout--threecol.scss | 0
.../layout--threecol/layout--threecol.twig | 18 +++++++++++++++
.../layout--threecol/layout--threecol.yml | 0
.../layout--twocol/_layout--twocol.scss | 3 +++
.../layout/layout--twocol/layout--twocol.twig | 13 +++++++++++
.../layout/layout--twocol/layout--twocol.yml | 0
.../_patterns/03-layouts/layout/layout.twig | 4 ++--
11 files changed, 61 insertions(+), 6 deletions(-)
create mode 100644 source/_patterns/03-layouts/layout/layout--fourcol/_layout--fourcol.scss
create mode 100644 source/_patterns/03-layouts/layout/layout--fourcol/layout--fourcol.twig
create mode 100644 source/_patterns/03-layouts/layout/layout--fourcol/layout--fourcol.yml
create mode 100644 source/_patterns/03-layouts/layout/layout--threecol/_layout--threecol.scss
create mode 100644 source/_patterns/03-layouts/layout/layout--threecol/layout--threecol.twig
create mode 100644 source/_patterns/03-layouts/layout/layout--threecol/layout--threecol.yml
create mode 100644 source/_patterns/03-layouts/layout/layout--twocol/_layout--twocol.scss
create mode 100644 source/_patterns/03-layouts/layout/layout--twocol/layout--twocol.twig
create mode 100644 source/_patterns/03-layouts/layout/layout--twocol/layout--twocol.yml
diff --git a/source/_patterns/03-layouts/layout/_layout.scss b/source/_patterns/03-layouts/layout/_layout.scss
index 22bac29a..41770ae6 100644
--- a/source/_patterns/03-layouts/layout/_layout.scss
+++ b/source/_patterns/03-layouts/layout/_layout.scss
@@ -1,5 +1,3 @@
-.layout {
- .uw-contained-width {
- @include uw-contained-width;
- }
+.layout.uw-contained-width {
+ @include uw-contained-width;
}
diff --git a/source/_patterns/03-layouts/layout/layout--fourcol/_layout--fourcol.scss b/source/_patterns/03-layouts/layout/layout--fourcol/_layout--fourcol.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/source/_patterns/03-layouts/layout/layout--fourcol/layout--fourcol.twig b/source/_patterns/03-layouts/layout/layout--fourcol/layout--fourcol.twig
new file mode 100644
index 00000000..6942d0e0
--- /dev/null
+++ b/source/_patterns/03-layouts/layout/layout--fourcol/layout--fourcol.twig
@@ -0,0 +1,23 @@
+<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>
diff --git a/source/_patterns/03-layouts/layout/layout--fourcol/layout--fourcol.yml b/source/_patterns/03-layouts/layout/layout--fourcol/layout--fourcol.yml
new file mode 100644
index 00000000..e69de29b
diff --git a/source/_patterns/03-layouts/layout/layout--threecol/_layout--threecol.scss b/source/_patterns/03-layouts/layout/layout--threecol/_layout--threecol.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/source/_patterns/03-layouts/layout/layout--threecol/layout--threecol.twig b/source/_patterns/03-layouts/layout/layout--threecol/layout--threecol.twig
new file mode 100644
index 00000000..c13ee6e5
--- /dev/null
+++ b/source/_patterns/03-layouts/layout/layout--threecol/layout--threecol.twig
@@ -0,0 +1,18 @@
+<div{{ attributes }}>
+
+ <div {{ region_attributes.first.addClass('layout__region', 'layout__region--first') }}>
+ {% block content_first %}
+ Layout Region Three 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>
diff --git a/source/_patterns/03-layouts/layout/layout--threecol/layout--threecol.yml b/source/_patterns/03-layouts/layout/layout--threecol/layout--threecol.yml
new file mode 100644
index 00000000..e69de29b
diff --git a/source/_patterns/03-layouts/layout/layout--twocol/_layout--twocol.scss b/source/_patterns/03-layouts/layout/layout--twocol/_layout--twocol.scss
new file mode 100644
index 00000000..41770ae6
--- /dev/null
+++ b/source/_patterns/03-layouts/layout/layout--twocol/_layout--twocol.scss
@@ -0,0 +1,3 @@
+.layout.uw-contained-width {
+ @include uw-contained-width;
+}
diff --git a/source/_patterns/03-layouts/layout/layout--twocol/layout--twocol.twig b/source/_patterns/03-layouts/layout/layout--twocol/layout--twocol.twig
new file mode 100644
index 00000000..fb696a6c
--- /dev/null
+++ b/source/_patterns/03-layouts/layout/layout--twocol/layout--twocol.twig
@@ -0,0 +1,13 @@
+<div{{ attributes }}>
+
+ <div {{ region_attributes.first.addClass('layout__region', 'layout__region--first') }}>
+ {% block content_first %}
+ Layout Region Two Column Layout
+ {% endblock %}
+ </div>
+
+ <div {{ region_attributes.second.addClass('layout__region', 'layout__region--second') }}>
+ {% block content_second %}
+ {% endblock %}
+ </div>
+</div>
diff --git a/source/_patterns/03-layouts/layout/layout--twocol/layout--twocol.yml b/source/_patterns/03-layouts/layout/layout--twocol/layout--twocol.yml
new file mode 100644
index 00000000..e69de29b
diff --git a/source/_patterns/03-layouts/layout/layout.twig b/source/_patterns/03-layouts/layout/layout.twig
index 4dc6b983..8a38aab0 100644
--- a/source/_patterns/03-layouts/layout/layout.twig
+++ b/source/_patterns/03-layouts/layout/layout.twig
@@ -1,5 +1,5 @@
-<div class="layout layout--{{ type }}">
- <div {{ region_attributes.content.addClass('layout__region', 'layout__region--content', width) }}>
+<div{{ attributes }}>
+ <div {{ region_attributes.content.addClass('layout__region', 'layout__region--content') }}>
{% block content %}
Layout Region One Column Layout
{% endblock %}
--
GitLab