adding the territorial statement component

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;

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;
+    }
+  }
 }

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

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

source/_patterns/04-components/territorial-statement/_territorial-statement.scss

+.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;
+    }
+  }
+}

source/_patterns/04-components/territorial-statement/territorial-statement.md

+---
+el: territorial statement
+title: Territorial statement
+---
+
+__Variables:__
+* modifier_classes: Choose "black or white" to determine the background color of the statement"
+

source/_patterns/04-components/territorial-statement/territorial-statement.twig

+<div class="uw-bg--{{ modifier_classes }}">
+    <div class="uw-territorial">
+        {{ territorial_text }}
+    </div>
+</div>
\ No newline at end of file

source/_patterns/04-components/territorial-statement/territorial-statement.yml

+---
+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