From ffd0611332409d02ba34893adf737e7a5924f680 Mon Sep 17 00:00:00 2001
From: m26lebla <m26lebla@uwaterloo.ca>
Date: Mon, 13 Jul 2020 17:25:56 -0400
Subject: [PATCH] adding the territorial statement component
---
css/styles.css | 39 +++++++++++++++++
.../_patterns/03-layouts/footer/_footer.scss | 7 ++++
.../_patterns/03-layouts/footer/footer.twig | 7 ++++
source/_patterns/03-layouts/footer/footer.yml | 4 +-
.../_territorial-statement.scss | 42 +++++++++++++++++++
.../territorial-statement.md | 8 ++++
.../territorial-statement.twig | 5 +++
.../territorial-statement.yml | 3 ++
8 files changed, 114 insertions(+), 1 deletion(-)
create mode 100644 source/_patterns/04-components/territorial-statement/_territorial-statement.scss
create mode 100644 source/_patterns/04-components/territorial-statement/territorial-statement.md
create mode 100644 source/_patterns/04-components/territorial-statement/territorial-statement.twig
create mode 100644 source/_patterns/04-components/territorial-statement/territorial-statement.yml
diff --git a/css/styles.css b/css/styles.css
index 5ee1af89..a272b4e3 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1063,6 +1063,12 @@ svg:not(:root) {
.uw-footer__social-directory a:hover {
color: #fdd54f;
text-decoration: underline; }
+ .uw-footer__territorial {
+ grid-column: 1 / 4;
+ grid-row: 4 / 5; }
+ @media (min-width: 30em) {
+ .uw-footer__territorial {
+ grid-row: 3 / 4; } }
.l-grid {
display: flex;
@@ -4219,6 +4225,39 @@ picture {
box-shadow: 0 0 0 2px #4773aa;
outline: 0; }
+.uw-bg--black {
+ background-color: #000; }
+
+.uw-bg--white {
+ background-color: #fff; }
+
+.uw-territorial {
+ text-align: center; }
+ .uw-territorial p {
+ font-family: Typ1451-Regular;
+ font-size: 0.75rem;
+ font-weight: 200;
+ letter-spacing: 0.5px;
+ line-height: 1.7;
+ padding: 1rem 0.5rem; }
+ .uw-bg--black .uw-territorial p {
+ color: #fff; }
+ .uw-bg--black .uw-territorial a {
+ color: #fdd54f;
+ text-decoration: none; }
+ .uw-bg--black .uw-territorial a:hover {
+ text-decoration: underline; }
+ .uw-bg--white .uw-territorial a {
+ color: #000;
+ text-decoration: underline; }
+ .uw-bg--white .uw-territorial a:hover {
+ text-decoration: none; }
+ @media (min-width: 49.81em) {
+ .uw-territorial {
+ text-align: left; }
+ .uw-territorial p {
+ line-height: 1.5; } }
+
.uw-twitter__wrapper {
margin-left: auto;
margin-right: auto;
diff --git a/source/_patterns/03-layouts/footer/_footer.scss b/source/_patterns/03-layouts/footer/_footer.scss
index a750b28f..2c53c95c 100644
--- a/source/_patterns/03-layouts/footer/_footer.scss
+++ b/source/_patterns/03-layouts/footer/_footer.scss
@@ -92,4 +92,11 @@
text-decoration: underline;
}
}
+ &__territorial {
+ grid-column: 1 / 4;
+ grid-row: 4 / 5;
+ @include medium {
+ grid-row: 3 / 4;
+ }
+ }
}
diff --git a/source/_patterns/03-layouts/footer/footer.twig b/source/_patterns/03-layouts/footer/footer.twig
index 0f9da41e..f77b9514 100644
--- a/source/_patterns/03-layouts/footer/footer.twig
+++ b/source/_patterns/03-layouts/footer/footer.twig
@@ -16,5 +16,12 @@
<a href="https://uwaterloo.ca/social-media/">@uwaterloo social directory</a>
</div>
</div>
+ <div class="uw-footer__territorial">
+
+ {% include "@components/territorial-statement/territorial-statement.twig" with {
+ 'territorial_text': territorial_text,
+ "modifier_classes": modifier_classes
+ } %}
+ </div>
</div>
</footer>
\ No newline at end of file
diff --git a/source/_patterns/03-layouts/footer/footer.yml b/source/_patterns/03-layouts/footer/footer.yml
index b8e38a5b..c8a83b00 100644
--- a/source/_patterns/03-layouts/footer/footer.yml
+++ b/source/_patterns/03-layouts/footer/footer.yml
@@ -75,4 +75,6 @@ social_media:
url: "https://www.instagram.com/uofwaterloo/"
- text: "LinkedIn"
url: "https://www.linkedin.com/edu/school?id=10875"
-social_media_placement: "global-site-footer"
\ No newline at end of file
+social_media_placement: "global-site-footer"
+modifier_classes: 'black'
+territorial_text: '<p>The University of Waterloo acknowledges that our work is on the traditional territory of ‎ the Neutral, Anishinaabeg and Haudenosaunee peoples. Our institution is situated on the Haldimand Tract, the land promised to the Six Nations that includes six miles on each side of the Grand River. Our active work toward reconciliation takes place across our campuses through research, learning, teaching, and community building, and is centralized within our <a href="https://uwaterloo.ca/human-rights-equity-inclusion/about/indigenous-initiatives" >Indigenous Initiatives Office</a>.</p>'
\ No newline at end of file
diff --git a/source/_patterns/04-components/territorial-statement/_territorial-statement.scss b/source/_patterns/04-components/territorial-statement/_territorial-statement.scss
new file mode 100644
index 00000000..ba324f99
--- /dev/null
+++ b/source/_patterns/04-components/territorial-statement/_territorial-statement.scss
@@ -0,0 +1,42 @@
+.uw-bg--black{
+ background-color:gesso-brand(org-default,uw-black,lvl4);
+}
+.uw-bg--white{
+ background-color:gesso-brand(org-default,uw-white,lvl1);
+}
+.uw-territorial{
+ text-align:center;
+ p{
+ font-family: Typ1451-Regular;
+ font-size: rem(gesso-font-size(0));
+ font-weight:200;
+ letter-spacing:0.5px;
+ line-height:1.7;
+ padding:1rem 0.5rem;
+ .uw-bg--black &{color:gesso-brand(org-default,uw-white,lvl1);}
+ .uw-bg--white &{}
+ }
+ a {
+ .uw-bg--black & {
+ color: gesso-brand(org-default, uw-gold, primary);
+ text-decoration: none;
+ &:hover {
+ text-decoration:underline;
+ }
+ }
+
+ .uw-bg--white & {
+ color: gesso-brand(org-default, uw-black, lvl4);
+ text-decoration: underline;
+ &:hover {
+ text-decoration: none;
+ }
+ }
+ }
+ @include large{
+ text-align:left;
+ p{
+ line-height:1.5;
+ }
+ }
+}
diff --git a/source/_patterns/04-components/territorial-statement/territorial-statement.md b/source/_patterns/04-components/territorial-statement/territorial-statement.md
new file mode 100644
index 00000000..923c5ed0
--- /dev/null
+++ b/source/_patterns/04-components/territorial-statement/territorial-statement.md
@@ -0,0 +1,8 @@
+---
+el: territorial statement
+title: Territorial statement
+---
+
+__Variables:__
+* modifier_classes: Choose "black or white" to determine the background color of the statement"
+
diff --git a/source/_patterns/04-components/territorial-statement/territorial-statement.twig b/source/_patterns/04-components/territorial-statement/territorial-statement.twig
new file mode 100644
index 00000000..89ef1ee5
--- /dev/null
+++ b/source/_patterns/04-components/territorial-statement/territorial-statement.twig
@@ -0,0 +1,5 @@
+<div class="uw-bg--{{ modifier_classes }}">
+ <div class="uw-territorial">
+ {{ territorial_text }}
+ </div>
+</div>
\ No newline at end of file
diff --git a/source/_patterns/04-components/territorial-statement/territorial-statement.yml b/source/_patterns/04-components/territorial-statement/territorial-statement.yml
new file mode 100644
index 00000000..1f8ecbb9
--- /dev/null
+++ b/source/_patterns/04-components/territorial-statement/territorial-statement.yml
@@ -0,0 +1,3 @@
+---
+modifier_classes: 'black'
+territorial_text: '<p>The University of Waterloo acknowledges that our work is on the traditional territory of ‎ the Neutral, Anishinaabeg and Haudenosaunee peoples. Our institution is situated on the Haldimand Tract, the land promised to the Six Nations that includes six miles on each side of the Grand River. Our active work toward reconciliation takes place across our campuses through research, learning, teaching, and community building, and is centralized within our <a href="https://uwaterloo.ca/human-rights-equity-inclusion/about/indigenous-initiatives" >Indigenous Initiatives Office</a>.</p>'
\ No newline at end of file
--
GitLab