diff --git a/src/patterns/01-core/mixins/_uw-mixins.scss b/src/patterns/01-core/mixins/_uw-mixins.scss
index ffd832bf894d0d48b783b9630e0803272aa53328..3b1506b123c666eab5e4303f23863cb5ff7d2a22 100644
--- a/src/patterns/01-core/mixins/_uw-mixins.scss
+++ b/src/patterns/01-core/mixins/_uw-mixins.scss
@@ -19,7 +19,7 @@ $test-color-12: var(--green-5);
word-wrap: break-word;
}
-@mixin uw-contained-width($value:$max-width) {
+@mixin uw-contained-width($value:var(--layout-max-width)) {
margin-left: auto;
margin-right: auto;
max-width: $value;
diff --git a/src/patterns/01-core/props/_colors.scss b/src/patterns/01-core/props/_colors.scss
index e12344b2c69483142f0e1791484b9656265d385c..bdbaa1b00078832b819ef274ca5d6da7ebe0d3fb 100644
--- a/src/patterns/01-core/props/_colors.scss
+++ b/src/patterns/01-core/props/_colors.scss
@@ -81,16 +81,19 @@
--ren-green: #01573e;
--ren-light: #92B7AC;
--ren-primary: #01573e;
+ --uw-black: #000;
--uw-black-1: #dfdfdf;
--uw-black-2: #a2a2a2;
--uw-black-3: #787878;
--uw-black-4: #000;
--uw-black-primary: #000;
+ --uw-gold: #fdd54f;
--uw-gold-1: #fffaaa;
--uw-gold-2: #ffea30;
--uw-gold-3: #fdd54f;
--uw-gold-4: #e4b429;
--uw-gold-primary: #fffaaa;
+ --uw-white: #fff;
--uw-white-1: #fff;
--uw-white-primary: #fff;
// Default Ohana follows:
diff --git a/src/patterns/01-core/props/_fonts.scss b/src/patterns/01-core/props/_fonts.scss
index 62f8cec7b3c48615db068b395421043ec674e5a1..fef85f4b5ec49ff3eaf99873420f53ceeeceead9 100644
--- a/src/patterns/01-core/props/_fonts.scss
+++ b/src/patterns/01-core/props/_fonts.scss
@@ -12,23 +12,29 @@
--font-weight-700: 700;
--font-weight-800: 800;
--font-weight-900: 900;
- --font-size-000: 0.625rem; // 10px
- --font-size-00: 0.75rem; // 12px
- --font-size-0: 0.875rem; // 14px
- --font-size-1: 1rem; // 16px
- --font-size-2: 1.125rem; // 18px
- --font-size-3: 1.25rem; // 20px
- --font-size-4: 1.375rem; // 22px
- --font-size-5: 1.5rem; // 24px
- --font-size-6: 1.75rem; // 28px
- --font-size-7: 2rem; // 32px
- --font-size-8: 2.25rem; // 36px
- --font-size-9: 2.5rem; // 40px
- --font-size-10: 3rem; // 48px
- --font-size-11: 3.5rem; // 56px
- --font-size-12: 4rem; // 64px
- --font-size-13: 5rem; // 80px
- --font-size-14: 7.5rem; // 120px
+ --font-size-0000000: 7.888px;
+ --font-size-000000: 8.88px;
+ --font-size-00000: 9.984px;
+ --font-size-0000: 11.232px;
+ --font-size-000: 12.64px;
+ --font-size-00: 14.22224px;
+ --font-size-0: 16px;
+ --font-size-1: 18px;
+ --font-size-2: 20.256px;
+ --font-size-3: 22.784px;
+ --font-size-4: 25.632px;
+ --font-size-5: 28.832px;
+ --font-size-6: 32.432px;
+ --font-size-7: 36.496px;
+ --font-size-8: 41.056px;
+ --font-size-9: 46.192px;
+ --font-size-10: 51.952px;
+ --font-size-11: 58.448px;
+ --font-size-12: 65.76px;
+ --font-size-13: 73.984px;
+ --font-size-14: 83.232px;
+ --font-size-15: 93.632px;
+ --font-size-16: 105.328px;
--font-lineheight-00: .95;
--font-lineheight-1: 1.1;
--font-lineheight-2: 1.25;
diff --git a/src/patterns/01-core/props/_zindex.scss b/src/patterns/01-core/props/_zindex.scss
index d6b869c95de1537130f22c5a704ca56713f70eca..18940d8a21b8b863edb88f3c6e42e65dac27dc6f 100644
--- a/src/patterns/01-core/props/_zindex.scss
+++ b/src/patterns/01-core/props/_zindex.scss
@@ -4,5 +4,19 @@
--layer-3: 3;
--layer-4: 4;
--layer-5: 5;
+ --layer-background: 1;
+ --layer-wrapper: 2;
+ --layer-slides: 2;
+ --layer-footer: 2;
+ --layer-content: 3;
+ --layer-header: 4;
+ --layer-interact: 5;
+ --layer-mobilemenu: 6;
+ --layer-dropdown: 7;
+ --layer-logo: 8;
+ --layer-nav: 8;
+ --layer-drawer: 9;
+ --layer-overlay: 9;
+ --layer-modal: 10;
--layer-important: 2147483647;
}
diff --git a/src/patterns/03-layouts/_index.scss b/src/patterns/03-layouts/_index.scss
new file mode 100644
index 0000000000000000000000000000000000000000..4897734f56be7a870aa84be4707da495d6d2a874
--- /dev/null
+++ b/src/patterns/03-layouts/_index.scss
@@ -0,0 +1,19 @@
+// @file
+// Styles layouts
+
+@use 'content/content' as *;
+@use 'footer/footer' as *;
+@use 'grid/grid' as *;
+@use 'header/header' as *;
+@use 'region/region' as *;
+@use 'layout/layout' as *;
+@use 'layout/layout-base' as *;
+@use 'layout/layout--1-col/layout--1-col' as *;
+@use 'layout/layout--2-col/layout--2-col' as *;
+@use 'layout/layout--3-col/layout--3-col' as *;
+@use 'layout/layout--4-col/layout--4-col' as *;
+@use 'layout/layout--5-col/layout--5-col' as *;
+@use 'layout/layout--inverted-l-left/layout--inverted-l-left' as *;
+@use 'layout/layout--inverted-l-right/layout--inverted-l-right' as *;
+@use 'site-container/site-container' as *;
+@use 'site-footer/site-footer' as *;
diff --git a/src/patterns/03-layouts/content/_content.scss b/src/patterns/03-layouts/content/_content.scss
new file mode 100644
index 0000000000000000000000000000000000000000..c21482ea89ff1566b5800c8435993fce50328683
--- /dev/null
+++ b/src/patterns/03-layouts/content/_content.scss
@@ -0,0 +1,36 @@
+// @file
+// Styles for Content Layout.
+.uw-main{
+ &.layout.uw-contained-width{
+ padding: 0 0 1rem;
+ }
+}
+
+// Tabs in admin
+.tabs{
+ z-index: var(--layer-wrapper);
+}
+.is-collapse-enabled .tabs__trigger{
+ z-index: var(--layer-content);
+}
+// Code for show hide revision/tabs
+.uw-show-hide{
+ background-color: var(--uw-white-1);
+ bottom: 4rem;
+ color: rgb(150, 23, 46);
+ cursor: pointer;
+ display: none;
+ font-size: 2rem;
+ height: auto;
+ padding: 0;
+ position: fixed;
+ right: 1rem;
+ text-decoration: none;
+ width: 2rem;
+ z-index: var(--layer-overlay);
+}
+.block-local-tasks-block,
+.uw-content-moderation{
+ display: block;
+}
+// end.
diff --git a/src/patterns/03-layouts/content/content.md b/src/patterns/03-layouts/content/content.md
new file mode 100644
index 0000000000000000000000000000000000000000..26d99bd71c16aca20f07c0e8e315791237d31096
--- /dev/null
+++ b/src/patterns/03-layouts/content/content.md
@@ -0,0 +1,12 @@
+---
+el: .l-content
+title: Content Layout
+---
+
+__Variables:__
+* has_constrain: [boolean] Whether to add a constrain wrapper.
+* constrain_modifier_classes: [string] Additional constrain classes used to
+control layout.
+
+__Blocks:__
+* content: Twig block for content.
diff --git a/src/patterns/03-layouts/content/content.twig b/src/patterns/03-layouts/content/content.twig
new file mode 100644
index 0000000000000000000000000000000000000000..0086385ebb42e2f4fc8f966cee47bf4dd2ea2e85
--- /dev/null
+++ b/src/patterns/03-layouts/content/content.twig
@@ -0,0 +1,13 @@
+{% set main_classes = 'uw-main' %}
+<!-- Button for show and hide of admin -->
+<button class="uw-show-hide" id="revision-show-hide" title="Show/hide revision elements">±</button>
+<!-- end -->
+{% for class in classes %}
+ {% set main_classes = main_classes ~ ' ' ~ class %}
+{% endfor %}
+
+<main id="main" class="{{ main_classes }}" role="main" tabindex="-1">
+ {% block content %}
+ Main content
+ {% endblock %}
+</main>
diff --git a/src/patterns/03-layouts/footer/_footer.scss b/src/patterns/03-layouts/footer/_footer.scss
new file mode 100644
index 0000000000000000000000000000000000000000..7524bf50c601df4679721c2efe2641ea0961a821
--- /dev/null
+++ b/src/patterns/03-layouts/footer/_footer.scss
@@ -0,0 +1,113 @@
+// @file
+// Styles for Footer Layout.
+
+@use '../../01-core' as *;
+
+.uw-footer {
+ background-color: #000;
+ padding: 0;
+ width: 100%;
+ &__wrapper {
+ @include layout-constrain;
+ display: grid;
+ grid-template-columns: 100%;
+ padding-top: var(--size-1);
+ text-size-adjust: none;
+ @media(min-width: $screen-xs) {
+ grid-template-columns: 50% 50%;
+ }
+ @media(min-width: $screen-md) {
+ grid-template-columns: 28% auto 14rem;
+ }
+ @media(min-width: $screen-lg) {
+ grid-template-columns: 28% auto 16rem;
+ }
+ }
+ &__address {
+ //font-family: gesso-font-family(systemmedium);
+ //font-size: gesso-font-size(-1);
+ -webkit-font-smoothing: antialiased;
+ grid-column: 1 / 3;
+ grid-row: 1 / 2;
+ margin-left: auto;
+ margin-right: auto;
+ padding: var(--size-1) 0 var(--size-4);
+ text-align: center;
+ @media(min-width: $screen-md) {
+ //font-size: gesso-font-size(-2);
+ grid-column: 1 / 2;
+ grid-row: 1 / 2;
+ margin: 0;
+ padding: 0;
+ text-align: left;
+ }
+ @media(min-width: $screen-lg) {
+ //font-size: gesso-font-size(-1);
+ }
+ }
+
+ &__menu {
+ -webkit-font-smoothing: antialiased;
+ grid-column: 1 / 3;
+ padding-bottom: var(--size-1);
+ @media(min-width: $screen-xs) {
+ grid-column: 1 / 2;
+ grid-row: 2 / 3;
+ }
+ @media(min-width: $screen-md) {
+ grid-column: 2 / 3;
+ grid-row: 1 / 2;
+ }
+ }
+
+ &__social {
+ //background:$test-color-2;
+ grid-column: 1 / 3;
+ grid-row: 3 / 4;
+ margin: 0 auto;
+ max-width: 13rem;
+ text-align: center;
+ width: 100%;
+ @media(min-width: $screen-xs) {
+ grid-column: 2 / 3;
+ grid-row: 2 / 3;
+ }
+ @media(min-width: $screen-md) {
+ grid-column: 3 / 4;
+ grid-row: 1 / 2;
+ margin: 0;
+ max-width: 16rem;
+ padding-left: var(--size-1);
+ text-align: left;
+ }
+ }
+ &__social-directory {
+ text-align: center;
+ @media(min-width: $screen-md) {
+ text-align: right;
+ }
+
+ a {
+ //font-family: gesso-font-family(system);
+ //font-size: gesso-font-size(-2);
+ text-decoration: none;
+ }
+
+ a:hover {
+ text-decoration: underline;
+ }
+ }
+ &__territorial {
+ a{
+ text-decoration: none;
+ }
+ a:hover {
+ text-decoration: underline;
+ }
+ grid-column: 1 / 4;
+ grid-row: 4 / 5;
+ @media(min-width: $screen-md) {
+ grid-row: 3 / 4;
+ }
+ }
+}
diff --git a/src/patterns/03-layouts/footer/footer.md b/src/patterns/03-layouts/footer/footer.md
new file mode 100644
index 0000000000000000000000000000000000000000..da06d3014be890c6744415479717975c074a86ab
--- /dev/null
+++ b/src/patterns/03-layouts/footer/footer.md
@@ -0,0 +1,12 @@
+---
+el: .l-footer
+title: Footer Layout
+---
+
+__Variables:__
+* has_constrain: [boolean] Whether to add a constrain wrapper.
+* constrain_modifier_classes: [string] Additional constrain classes used to
+control layout.
+
+__Blocks:__
+* content: Twig block for content.
diff --git a/src/patterns/03-layouts/footer/footer.twig b/src/patterns/03-layouts/footer/footer.twig
new file mode 100644
index 0000000000000000000000000000000000000000..141a903069a47e0ff67f5a5100a042de5d708fe5
--- /dev/null
+++ b/src/patterns/03-layouts/footer/footer.twig
@@ -0,0 +1,33 @@
+<footer class="uw-footer"{% if branding_level == 'full' %} role="contentinfo"{% endif %}>
+ <div class="uw-site-footer__block">
+ {% block content %}
+ {% include "@layouts/site-footer/site-footer.twig" with {
+ body: "The standard Lorem Ipsum passage, used since the 1500s<br /><br />Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
+ site_name: "Faculty of Environment",
+ logo_link: "https://uwaterloo.ca/",
+ logo_url: "/uw_wcms_gesso/source/images/logos/uwaterloo-logo.svg",
+ logo_alt_text: "Faculty of Environment",
+ facebook: "https://www.facebook.com/University.Waterloo"
+ } %}
+ {% endblock %}
+ </div>
+ <div class="uw-footer__wrapper">
+ {% if branding_level == 'full' %}
+ <div class="uw-footer__address">
+ address
+ </div>
+ <div class="uw-footer__menu">
+ menu
+ </div>
+ <div class="uw-footer__social">
+ social
+ <div class="uw-footer__social-directory">
+ <a href="https://uwaterloo.ca/social-media/">@uwaterloo social directory</a>
+ </div>
+ </div>
+ <div class="uw-footer__territorial">
+ territorial statement
+ </div>
+ {% endif %}
+ </div>
+</footer>
diff --git a/src/patterns/03-layouts/footer/footer.yml b/src/patterns/03-layouts/footer/footer.yml
new file mode 100644
index 0000000000000000000000000000000000000000..cb497eff0fa5407c816281611f7077578fdfcdf0
--- /dev/null
+++ b/src/patterns/03-layouts/footer/footer.yml
@@ -0,0 +1,82 @@
+footer_menu:
+ - title: 'Contact Waterloo'
+ url: 'https://uwaterloo.ca/about/contact-us'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Maps & Directions'
+ url: 'https://uwaterloo.ca/map/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Watsafe'
+ url: 'https://uwaterloo.ca/watsafe/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Accessibility'
+ url: 'https://uwaterloo.ca/human-resources/accessibility'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Privacy'
+ url: 'https://uwaterloo.ca/privacy/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Copyright'
+ url: 'https://uwaterloo.ca/copyright'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'News'
+ url: 'https://uwaterloo.ca/news/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Careers'
+ url: 'https://uwaterloo.ca/careers/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Careers'
+ url: 'https://uwaterloo.ca/about/contact-us/contact-form'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+social_media:
+ menu_tree:
+ - text: "Facebook"
+ url: "https://www.facebook.com/university.waterloo"
+ - text: "Twitter"
+ url: "https://twitter.com/uWaterloo"
+ - text: "YouTube"
+ url: "https://www.youtube.com/user/uwaterloo"
+ - text: "Instagram"
+ url: "https://www.instagram.com/uofwaterloo/"
+ - text: "LinkedIn"
+ url: "https://www.linkedin.com/edu/school?id=10875"
+social_media_placement: "global-site-footer"
+modifier_classes: 'black'
+territorial_text: '<p>The University of Waterloo acknowledges that much of our work takes place on the traditional territory of the Neutral, Anishinaabeg and Haudenosaunee peoples. Our main campus is situated on the Haldimand Tract, the land granted 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/indigenous" >Office of Indigenous Relations</a>.</p>'
+is_demo_footer: true
+cookie:
+ text: '<h2>We use cookies on this site to enhance the user experience.</h2><p>Select "Accept all" to agree and continue. You consent to our cookies if you continue to use this website.</p>'
diff --git a/src/patterns/03-layouts/header/_header.scss b/src/patterns/03-layouts/header/_header.scss
new file mode 100644
index 0000000000000000000000000000000000000000..cd71ae72da1d9bf888dbad6d43f99c15a6fe52ed
--- /dev/null
+++ b/src/patterns/03-layouts/header/_header.scss
@@ -0,0 +1,88 @@
+@use '../../01-core' as *;
+
+$site-name-bg: var(--gray-2);
+
+.uw-header {
+ @include uw-full-width;
+ background-color: #000;
+ &__masthead {
+ display: flex;
+ //font-family:gesso-font-family(condensedbook);
+ margin-bottom: 0;
+ min-height: 3.5rem;
+ padding: var(--size-1);
+ position: relative;
+ transition: margin 300ms;
+ &.open{
+ margin-bottom: 4rem;
+ transition: margin 300ms;
+ }
+ @media(min-width: $screen-md) {
+ @include layout-constrain;
+ min-height: inherit;
+ padding: var(--size-2);
+ }
+ .uw-site-logo {
+ align-self: flex-start;
+ flex: 1;
+ }
+ .uw-header-menu {
+ align-self: flex-end;
+ margin-right: 2.75rem;
+ @media(min-width: $screen-md) {
+ margin-right: 1rem;
+ }
+ }
+ .uw-header-search {
+ align-self: flex-end;
+ }
+ .uw-header-searchbar{
+ @include layout-constrain;
+ display: block;
+ left: 0;
+ padding: 0;
+ position: absolute;
+ top: 100%;
+ width: 100%;
+ @media(min-width: $screen-md) {
+ display: none;
+ }
+ }
+ }
+
+ .uw-header__nav{
+ @include uw-full-width;
+ background-color: $site-name-bg;
+ }
+ .uw-header__center{
+ @include layout-constrain;
+ border-bottom: 1px solid var(--gray-3);
+ @media(min-width: $screen-md) {
+ border-bottom: inherit;
+ }
+ display: grid;
+ grid-template-columns: auto 4rem;
+ padding: 0;
+ }
+ .uw-header__site-name{
+ grid-column: 1 / 2;
+ grid-row: 1 / 2;
+ }
+ .uw-navigation-button{
+ grid-column: 2 / 3;
+ grid-row: 1 / 2;
+ }
+ .uw-header__navigation{
+ grid-column: 1 / 3;
+ grid-row: 2 / 3;
+ }
+
+ .messages-list {
+ background-color: var(--uw-white);
+ grid-column: 1 / 3;
+ grid-row: 2 / 3;
+ margin-bottom: 0;
+ margin-top: 0;
+ padding: 0 1rem;
+ }
+}
diff --git a/src/patterns/03-layouts/header/header.md b/src/patterns/03-layouts/header/header.md
new file mode 100644
index 0000000000000000000000000000000000000000..698134a1aa1f1f61b0843941de7830296adbe4ca
--- /dev/null
+++ b/src/patterns/03-layouts/header/header.md
@@ -0,0 +1,12 @@
+---
+el: .l-header
+title: Header Layout
+---
+
+__Variables:__
+* has_constrain: [boolean] Whether to add a constrain wrapper.
+* constrain_modifier_classes: [string] Additional constrain classes used to
+control layout.
+
+__Blocks:__
+* content: Twig block for content.
diff --git a/src/patterns/03-layouts/header/header.twig b/src/patterns/03-layouts/header/header.twig
new file mode 100644
index 0000000000000000000000000000000000000000..ab8155c716c1a0e24b46173e97c2c806ab10f121
--- /dev/null
+++ b/src/patterns/03-layouts/header/header.twig
@@ -0,0 +1,36 @@
+{% if is_demo_header %}
+ {% set branding_level = 'full' %}
+ {% set faculty = faculty ? faculty : 'org-art' %}
+{% endif %}
+
+<header class="uw-header {{ faculty }}" role="banner">
+ {% if global_message %}
+ <div id="global-message">
+ {{ global_message|render }}
+ </div>
+ {% endif %}
+ <div class="uw-header__masthead">
+
+ </div>
+ <!-- Branding colour bar. -->
+ {% if branding_level == 'full' %}
+ {% include '@components/color-bar/color-bar.twig' with {
+ 'faculty': faculty
+ }%}
+ {% endif %}
+ <!-- Main header horizontal navigation -->
+ <nav class="uw-header__nav">
+ <div class="uw-header__center">
+ <div class="uw-header__site-name">
+ Site Name
+ </div>
+ <button class="uw-navigation-button" aria-controls="uw-header__navigation" aria-expanded="false">
+ <span class="uw-navigation-button__text">Menu</span>
+ <span class="uw-navigation-button__lines"></span>
+ </button>
+ </div>
+ <div id="uw-header__navigation" class="uw-header__navigation">
+
+ </div>
+ </nav>
+</header>
diff --git a/src/patterns/03-layouts/header/header.yml b/src/patterns/03-layouts/header/header.yml
new file mode 100644
index 0000000000000000000000000000000000000000..e2b641c35454fd2d06ca03f207d5fb29597162a9
--- /dev/null
+++ b/src/patterns/03-layouts/header/header.yml
@@ -0,0 +1,862 @@
+---
+is_demo_header: true
+header_modifier_classes: 'header'
+menu_name: 'horizontal'
+global_message:
+header_items:
+ - title: 'Jump To'
+ url: 'Parent'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ submenu:
+ - title: 'Admissions'
+ url: 'https://uwaterloo.ca/admissions/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'About Waterloo'
+ url: 'https://uwaterloo.ca/about/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Faculties & Academics'
+ url: 'https://uwaterloo.ca/faculties-academics/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Offices & Services'
+ url: 'https://uwaterloo.ca/offices-services/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Support Waterloo'
+ url: 'https://uwaterloo.ca/support/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+classes:
+nav_items:
+ - text: 'About Psychology'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: '2'
+ submenu:
+ - text: 'Our mission & vision'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Our People'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Research'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ menu_items_count: '10'
+ submenu:
+ - text: 'Research areas'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Research Chair and Awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ submenu:
+ - text: 'Clinical'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Cognitive'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Cognitive Neuroscience'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Developmental'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Industrial-Organizational'
+ url: '#'
+ original_link:
+ options:
+ attributtes:
+ class: ''
+ active-trial: true
+ submenu:
+ - text: 'Academic Program for Graduate Study in Industrial-Organizational Psychology'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ active: true
+ - text: 'Social Psychology'
+ url: '#'
+ original_link:
+ options:
+ attributtes:
+ class: ''
+ active-trial: false
+ - text: 'Teaching excellence'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: '2'
+ submenu:
+ - text: 'Experiential learning'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'News'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Events'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Centre for Mental Health Research and Treatment'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Early Childhood Education Centre'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: '8'
+ submenu:
+ - text: 'Programs offered | Fees'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'FAQs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Enrollment Process | Registration'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Research and academic programs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Volunteer program'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Contact us'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Resources and links'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Celebrating the Class of 2020'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: '3'
+ submenu:
+ - text: 'Convocation Award Winners 2020'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Student Memories 2020'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Community Partners'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Department Profiles Sherman Kwok'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+secondary_modifier_classes: 'secondary'
+secondary_items:
+ - text: 'Undergraduate students '
+ url: '#Parent'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ menu_items_count: 39
+ submenu:
+ - text: 'Degree Options and Specializations'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'How to become a Psychology Student'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Prospective student'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Courses'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ submenu:
+ - text: 'Future course offerings'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Courses requiring an application'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Honours Thesis (Psych 499)'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ submenu:
+ - text: 'Conference opportunities '
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ submenu:
+ - text: 'Annual Ontario Psychology Undergraduate Thesis Conference'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ active: true
+ - text: 'Publishing opportunities'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Course overrides'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Special Topics and Honours Seminars'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Syllabus Archive'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Experiential Learning'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Psychology co-op'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Research Assistant (RA) positions'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Student success'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Academic standing'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Policies'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'University policies'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Psychology Department policies'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Awards '
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Convocation and thesis awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Psychology Memorial Awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Other research awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Distinguished Teacher Awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Psychology Undergraduate Society '
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'About to graduate'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'FAQs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Career Options'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Career advising'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'College programs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Employment after Bachelors'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Employment after Masters or PhD'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Graduate studies in Psychology'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Letters of recommendation'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Other programs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Who can I ask?'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Human Resources Management program '
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 10
+ submenu:
+ - text: 'Meet your lecturers'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Minor & Diploma'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Courses'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Meet Our Students'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Student success'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Get involved'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'News'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Alumni | Friends'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'HRM Opportunities'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Graduate students'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 19
+ submenu:
+ - text: 'Programs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Minimum admission requirements'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Application procedures'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Degree requirements'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Submission of the Masters Thesis'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Submission of the Masters Research Paper (MASc students)'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Forming a PhD Committee'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Guideline for PhD Thesis Defense'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Submission of the PhD thesis following the defense'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Forms'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Funding & Awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Careers of Alumni'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'GASP (Graduate Association of Students in Psychology)'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Graduate courses'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Orientation guide'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Policies and procedures'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Showcasing graduate student research'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Teaching assistantships'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Faculty & Staff'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+ - text: 'Alumni & Friends'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 4
+ submenu:
+ - text: 'Share your story'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Profiles & Achievements'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Make a gift'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Positions available'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+form_action: 'https://uwaterloo.ca/search'
+form_autocomplete: 'off'
+form_classes: 'uw-search--form'
+form_id: '12345'
+form_method: 'get'
+form_target: ''
+form_accept-charset : 'UTF-8'
+form_role: 'search'
+form_items:
+ - classes: 'uw-input--search'
+ id: '1text'
+ name: 'search-input'
+ type: 'text'
+ placeholder: 'Search'
+ label:
+ text: 'Search'
+ class: 'uw-search--label hidden'
+ - is_button_tag: true
+ form_item_wrapper: false
+ is_demo: false
+ is_disabled: false
+ type: ''
+ classes: button_modifier_classes
+ modifier_classes: button_modifier_classes
+ formaction: ''
+ form: 'uw-search'
+ name: ''
+ formenctype: ''
+ value: 'submit'
+ formmethod: ''
+ formtarget: ''
+ text: ''
+ btnclick: |
+ # alert('Hello World!');
+# - classes: 'uw-input--submit'
+# id: 'submit'
+# name: 'Search'
+# type: 'submit'
diff --git a/src/patterns/03-layouts/layout/_layout-base.scss b/src/patterns/03-layouts/layout/_layout-base.scss
index 3225dc88220a138993855ba1662c12eca17e02a2..fb1c1d311f40c5101d1b7cc2616aa319f7135df1 100644
--- a/src/patterns/03-layouts/layout/_layout-base.scss
+++ b/src/patterns/03-layouts/layout/_layout-base.scss
@@ -1,11 +1,4 @@
@use '../../01-core' as *;
-@use '../../03-layouts/layout/layout--1-col/layout--1-col' as *;
-@use '../../03-layouts/layout/layout--2-col/layout--2-col' as *;
-@use '../../03-layouts/layout/layout--3-col/layout--3-col' as *;
-@use '../../03-layouts/layout/layout--4-col/layout--4-col' as *;
-@use '../../03-layouts/layout/layout--5-col/layout--5-col' as *;
-@use '../../03-layouts/layout/layout--inverted-l-left/layout--inverted-l-left' as *;
-@use '../../03-layouts/layout/layout--inverted-l-right/layout--inverted-l-right' as *;
.layout__region {
diff --git a/src/patterns/03-layouts/layout/layout--1-col/layout--1-col.twig b/src/patterns/03-layouts/layout/layout--1-col/layout--1-col.twig
index 838de14dc00de4bdf481675fa5c00ae8ffaba63f..cdff77ed5eca906e9a713e550ecf340dbaa07f65 100644
--- a/src/patterns/03-layouts/layout/layout--1-col/layout--1-col.twig
+++ b/src/patterns/03-layouts/layout/layout--1-col/layout--1-col.twig
@@ -18,4 +18,4 @@
num_of_blocks: num_of_blocks,
} %}
-{% endif %}
\ No newline at end of file
+{% endif %}
diff --git a/src/patterns/03-layouts/layout/layout--2-col/layout--2-col.twig b/src/patterns/03-layouts/layout/layout--2-col/layout--2-col.twig
index 708ac519428d5a508a3fefbbc0cdaa9c2529a6ad..43ab88b4ea5b56055815d90d02f891dcb44c2d07 100644
--- a/src/patterns/03-layouts/layout/layout--2-col/layout--2-col.twig
+++ b/src/patterns/03-layouts/layout/layout--2-col/layout--2-col.twig
@@ -18,4 +18,4 @@
num_of_blocks: num_of_blocks,
} %}
-{% endif %}
\ No newline at end of file
+{% endif %}
diff --git a/src/patterns/03-layouts/layout/layout--3-col/layout--3-col.twig b/src/patterns/03-layouts/layout/layout--3-col/layout--3-col.twig
index 94919c41522527d562e1d2bc59226417a1f281bd..1da7dbf1d203641ec11f96a73f4bdb009cde34d4 100644
--- a/src/patterns/03-layouts/layout/layout--3-col/layout--3-col.twig
+++ b/src/patterns/03-layouts/layout/layout--3-col/layout--3-col.twig
@@ -18,4 +18,4 @@
num_of_blocks: num_of_blocks,
} %}
-{% endif %}
\ No newline at end of file
+{% endif %}
diff --git a/src/patterns/03-layouts/layout/layout--4-col/layout--4-col.twig b/src/patterns/03-layouts/layout/layout--4-col/layout--4-col.twig
index 9c2a605bde37f60b19ef47df69d1c90e99463825..698f9b156fc9102de0d0324290f91597940107f0 100644
--- a/src/patterns/03-layouts/layout/layout--4-col/layout--4-col.twig
+++ b/src/patterns/03-layouts/layout/layout--4-col/layout--4-col.twig
@@ -18,4 +18,4 @@
num_of_blocks: num_of_blocks,
} %}
-{% endif %}
\ No newline at end of file
+{% endif %}
diff --git a/src/patterns/03-layouts/layout/layout--5-col/layout--5-col.twig b/src/patterns/03-layouts/layout/layout--5-col/layout--5-col.twig
index 8d53188672aadad759c57bfd943bc12fe653a8b8..f5e6862c7dfd4fa68290ffec663df39aa98ebf9a 100644
--- a/src/patterns/03-layouts/layout/layout--5-col/layout--5-col.twig
+++ b/src/patterns/03-layouts/layout/layout--5-col/layout--5-col.twig
@@ -18,4 +18,4 @@
num_of_blocks: num_of_blocks,
} %}
-{% endif %}
\ No newline at end of file
+{% endif %}
diff --git a/src/patterns/03-layouts/layout/layout--inverted-l-left/layout--inverted-l-left.twig b/src/patterns/03-layouts/layout/layout--inverted-l-left/layout--inverted-l-left.twig
index 0ce52523c768d6540e8c007a429d2b3b2050f858..491f9312e1c4d7aa131470ca3c35ed900cbcb823 100644
--- a/src/patterns/03-layouts/layout/layout--inverted-l-left/layout--inverted-l-left.twig
+++ b/src/patterns/03-layouts/layout/layout--inverted-l-left/layout--inverted-l-left.twig
@@ -20,4 +20,4 @@
inverted_l_left: 1,
} %}
-{% endif %}
\ No newline at end of file
+{% endif %}
diff --git a/src/patterns/03-layouts/layout/layout--inverted-l-right/layout--inverted-l-right.twig b/src/patterns/03-layouts/layout/layout--inverted-l-right/layout--inverted-l-right.twig
index e869a26bbb48041aae73a87ea5c92dc7095d9677..81dc64a007bd73e4421223c7d26765bec1646944 100644
--- a/src/patterns/03-layouts/layout/layout--inverted-l-right/layout--inverted-l-right.twig
+++ b/src/patterns/03-layouts/layout/layout--inverted-l-right/layout--inverted-l-right.twig
@@ -20,4 +20,4 @@
inverted_l_right: 1,
} %}
-{% endif %}
\ No newline at end of file
+{% endif %}
diff --git a/src/patterns/03-layouts/region/region.scss b/src/patterns/03-layouts/region/_region.scss
similarity index 100%
rename from src/patterns/03-layouts/region/region.scss
rename to src/patterns/03-layouts/region/_region.scss
diff --git a/src/patterns/03-layouts/region/region.twig b/src/patterns/03-layouts/region/region.twig
index 5ba6da56574b5941e158e412c32c9f137691cf38..d853dbc6cf19efe07020c5ed9d66153a3e7afcff 100644
--- a/src/patterns/03-layouts/region/region.twig
+++ b/src/patterns/03-layouts/region/region.twig
@@ -1,5 +1,3 @@
-{{ attach_library('ohana/region')}}
-
<section class="l-{{ region_name ?: 'region' }}">
{% if constrain %}
<div class="l-constrain {{ constrain }}">
diff --git a/src/patterns/03-layouts/site-container/_site-container.scss b/src/patterns/03-layouts/site-container/_site-container.scss
new file mode 100644
index 0000000000000000000000000000000000000000..6cca3390f9a302e2ff679d7feefcdab68efcf539
--- /dev/null
+++ b/src/patterns/03-layouts/site-container/_site-container.scss
@@ -0,0 +1,83 @@
+@use '../../01-core' as *;
+
+.uw-site-container {
+ display: grid;
+ grid-template-columns: 100%;
+ position: relative;
+ // Puts the site container at z-index 2
+ z-index: var(--layer-wrapper);
+ .uw-header {
+ grid-column: 1 / 2;
+ grid-row: 1 / 2;
+ position: relative;
+ // Puts the header at z-index 4
+ z-index: var(--layer-header);
+ }
+ .uw-highlighted {
+ @include layout-constrain;
+ grid-column: 1 / 2;
+ grid-row: 2 / 3;
+ position: relative;
+ width: 100%;
+ // Puts the content at z-index 3
+ z-index: var(--layer-content);
+ @media(min-width: $screen-xl) {
+ padding: 0;
+ }
+ }
+
+ .block-uw-cbl-special-alert {
+ background: #f0f0f0;
+ border: 2px solid #96172e;
+ margin: 1em 0;
+ padding: 1em;
+
+ // Prevent excess space at top from elements that have a margin-top.
+ > *:first-child {
+ margin-top: 0;
+ }
+
+ // Prevent excess space at bottom from elements that have a margin-bottom.
+ > *:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ .uw-main {
+ grid-column: 1 / 2;
+ grid-row: 3 / 4;
+ min-height: 60vh;
+ position: relative;
+ width: 100%;
+ // Puts the content at z-index 3
+ //z-index: gesso-z-index(content);
+ }
+
+ .uw-footer {
+ grid-column: 1 / 2;
+ grid-row: 4 / 5;
+ position: relative;
+ // Puts the footer at z-index 2
+ z-index: var(--layer-footer);
+ .menu--item{
+ a{
+ color: #fff;
+ }
+ }
+ .uw-footer__social-directory{
+ a{
+ color: #fff;
+ }
+ }
+ .uw-footer__territorial{
+ a{
+ color: var(--uw-gold);
+ }
+ }
+ }
+}
+
+.mobile-menu,
+.mobile-menu-button{
+ display: none !important;
+}
diff --git a/src/patterns/03-layouts/site-container/site-container.md b/src/patterns/03-layouts/site-container/site-container.md
new file mode 100644
index 0000000000000000000000000000000000000000..aed7f597de779365e3b931dc837ffce8f9748a6b
--- /dev/null
+++ b/src/patterns/03-layouts/site-container/site-container.md
@@ -0,0 +1,7 @@
+---
+el: .l-site-container
+title: Site Container Layout
+---
+
+__Blocks:__
+* site_content: Twig block for content.
diff --git a/src/patterns/03-layouts/site-container/site-container.twig b/src/patterns/03-layouts/site-container/site-container.twig
new file mode 100644
index 0000000000000000000000000000000000000000..47dbf4102f35de89be71b514a715b9521ac1a2a3
--- /dev/null
+++ b/src/patterns/03-layouts/site-container/site-container.twig
@@ -0,0 +1,27 @@
+{% if is_demo_site_container %}
+ {% set faculty = faculty ? faculty : 'org-art' %}
+ {% set branding_level = branding_level ? branding_level : 'full' %}
+{% endif %}
+<div class="uw-site-container">
+ {% block header %}
+ {% include "@layouts/header/header.twig"%}
+ {% endblock %}
+
+ {% block highlighted %}
+{# {% include '@global/06-break-hints/break-hints.twig' %}#}
+ {% endblock %}
+
+ {% block main %}
+ {% include '@layouts/content/content.twig' %}
+ {% endblock %}
+
+ {% block footer %}
+ {% include "@layouts/footer/footer.twig" with {
+ 'menu_name': footer_menu_name,
+ 'items': footer_menu
+ }%}
+ {% if pattern_lab %}
+{# {% include "@components/eu-cookie-compliance/eu-cookie-compliance.twig" %}#}
+ {% endif %}
+ {% endblock %}
+</div>
diff --git a/src/patterns/03-layouts/site-container/site-container.yml b/src/patterns/03-layouts/site-container/site-container.yml
new file mode 100644
index 0000000000000000000000000000000000000000..f67d72c30dc4005034c5d53ddceeb5196c4aae0d
--- /dev/null
+++ b/src/patterns/03-layouts/site-container/site-container.yml
@@ -0,0 +1,949 @@
+---
+site_name: 'Psychology'
+is_demo_site_container: true
+is_demo_footer: true
+header_modifier_classes: 'header'
+menu_name: 'horizontal'
+cookie:
+ text: '<h2>We use cookies on this site to enhance the user experience.</h2><p>Select "Accept all" to agree and continue. You consent to our cookies if you continue to use this website.</p>'
+header_items:
+ - title: 'Jump To'
+ url: 'Parent'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ submenu:
+ - title: 'Admissions'
+ url: 'https://uwaterloo.ca/admissions/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'About Waterloo'
+ url: 'https://uwaterloo.ca/about/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Faculties & Academics'
+ url: 'https://uwaterloo.ca/faculties-academics/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Offices & Services'
+ url: 'https://uwaterloo.ca/offices-services/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Support Waterloo'
+ url: 'https://uwaterloo.ca/support/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+classes:
+footer_menu_name: 'uw-footer'
+footer_menu:
+ - title: 'Contact Waterloo'
+ url: 'https://uwaterloo.ca/about/contact-us'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Maps & Directions'
+ url: 'https://uwaterloo.ca/map/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Watsafe'
+ url: 'https://uwaterloo.ca/watsafe/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Accessibility'
+ url: 'https://uwaterloo.ca/human-resources/accessibility'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Privacy'
+ url: 'https://uwaterloo.ca/privacy/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Copyright'
+ url: 'https://uwaterloo.ca/copyright'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'News'
+ url: 'https://uwaterloo.ca/news/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Careers'
+ url: 'https://uwaterloo.ca/careers/'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+ - title: 'Careers'
+ url: 'https://uwaterloo.ca/about/contact-us/contact-form'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ in_active_trail: false
+social_media:
+ menu_tree:
+ - text: "Facebook"
+ url: "https://www.facebook.com/university.waterloo"
+ - text: "Twitter"
+ url: "https://twitter.com/uWaterloo"
+ - text: "YouTube"
+ url: "https://www.youtube.com/user/uwaterloo"
+ - text: "Instagram"
+ url: "https://www.instagram.com/uofwaterloo/"
+ - text: "LinkedIn"
+ url: "https://www.linkedin.com/edu/school?id=10875"
+social_media_placement: "global-site-footer"
+nav_items:
+ - text: 'About Psychology'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 2
+ submenu:
+ - text: 'Our mission & vision'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Our People'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+ - text: 'Research'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 10
+ submenu:
+ - text: 'Research areas'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Research Chair and Awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Clinical'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Cognitive'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Cognitive Neuroscience'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Developmental'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Industrial-Organizational'
+ url: '#'
+ original_link:
+ options:
+ attributtes:
+ class: ''
+ active-trial: false
+ submenu:
+ - text: 'Academic Program for Graduate Study in Industrial-Organizational Psychology'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Social Psychology'
+ url: '#'
+ original_link:
+ options:
+ attributtes:
+ class: ''
+ active-trial: false
+ - text: 'Teaching excellence'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 2
+ submenu:
+ - text: 'Experiential learning'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'News'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+ - text: 'Events'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+ - text: 'Centre for Mental Health Research and Treatment'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+ - text: 'Early Childhood Education Centre'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 8
+ submenu:
+ - text: 'Programs offered | Fees'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'FAQs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Enrollment Process | Registration'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Research and academic programs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Volunteer program'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Contact us'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Resources and links'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Celebrating the Class of 2020'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 3
+ submenu:
+ - text: 'Convocation Award Winners 2020'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Student Memories 2020'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Community Partners'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+ - text: 'Department Profiles Sherman Kwok'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+secondary_modifier_classes: 'secondary'
+secondary_items:
+ - text: 'Undergraduate students '
+ url: '#Parent'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ active: true
+ menu_items_count: 39
+ submenu:
+ - text: 'Degree Options and Specializations'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'How to become a Psychology Student'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Prospective student'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Courses'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Future course offerings'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Courses requiring an application'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Honours Thesis (Psych 499)'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Conference opportunities '
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Annual Ontario Psychology Undergraduate Thesis Conference'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Publishing opportunities'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Course overrides'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Special Topics and Honours Seminars'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Syllabus Archive'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Experiential Learning'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Psychology co-op'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Research Assistant (RA) positions'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Student success'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Academic standing'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Policies'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'University policies'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Psychology Department policies'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Awards '
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Convocation and thesis awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Psychology Memorial Awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Other research awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Distinguished Teacher Awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Psychology Undergraduate Society '
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'About to graduate'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'FAQs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Career Options'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Career advising'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'College programs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Employment after Bachelors'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Employment after Masters or PhD'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Graduate studies in Psychology'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Letters of recommendation'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Other programs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Who can I ask?'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Human Resources Management program '
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 10
+ submenu:
+ - text: 'Meet your lecturers'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Minor & Diploma'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Courses'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Meet Our Students'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: true
+ active: true
+ - text: 'Student success'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Get involved'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'News'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Alumni | Friends'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'HRM Opportunities'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Graduate students'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 19
+ submenu:
+ - text: 'Programs'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Minimum admission requirements'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Application procedures'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Degree requirements'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ submenu:
+ - text: 'Submission of the Masters Thesis'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Submission of the Masters Research Paper (MASc students)'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Forming a PhD Committee'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Guideline for PhD Thesis Defense'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Submission of the PhD thesis following the defense'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Forms'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Funding & Awards'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Careers of Alumni'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'GASP (Graduate Association of Students in Psychology)'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Graduate courses'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Orientation guide'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Policies and procedures'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Showcasing graduate student research'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Teaching assistantships'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Faculty & Staff'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+ - text: 'Alumni & Friends'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 4
+ submenu:
+ - text: 'Share your story'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Profiles & Achievements'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Make a gift'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ - text: 'Positions available'
+ url: '#'
+ original_link:
+ options:
+ attributes:
+ class: ''
+ active_trail: false
+ menu_items_count: 0
+form_action: 'https://uwaterloo.ca/search'
+form_autocomplete: 'off'
+form_classes: 'uw-search--form'
+form_id: '12345'
+form_method: 'get'
+form_target: ''
+form_accept-charset : 'UTF-8'
+form_role: 'search'
+form_items:
+ - classes: 'uw-input--search'
+ id: '1text'
+ name: 'search-input'
+ type: 'text'
+ placeholder: 'Search'
+ label:
+ text: 'Search'
+ class: 'uw-search--label hidden'
+ - is_button_tag: true
+ form_item_wrapper: false
+ is_demo: false
+ is_disabled: false
+ type: ''
+ classes: button_modifier_classes
+ modifier_classes: button_modifier_classes
+ formaction: ''
+ form: 'uw-search'
+ name: ''
+ formenctype: ''
+ value: 'submit'
+ formmethod: ''
+ formtarget: ''
+ text: ''
+ btnclick: |
+ # alert('Hello World!');
+# - classes: 'uw-input--submit'
+# id: 'submit'
+# name: 'Search'
+# type: 'submit'
diff --git a/src/patterns/03-layouts/site-footer/_site-footer.scss b/src/patterns/03-layouts/site-footer/_site-footer.scss
new file mode 100644
index 0000000000000000000000000000000000000000..56770bc79177ec4cc03006595d672bb558d47d5b
--- /dev/null
+++ b/src/patterns/03-layouts/site-footer/_site-footer.scss
@@ -0,0 +1,113 @@
+@use '../../01-core' as *;
+
+.uw-site-footer {
+ background-color: var(--gray-3);
+ &__wrapper {
+ @include layout-constrain;
+ display: grid;
+ grid-template-columns: 100%;
+ grid-template-rows: auto auto auto;
+ padding-bottom: var(--size-2);
+ padding-top: var(--size-2);
+ @media(min-width: $screen-md) {
+ grid-template-columns: auto 18rem;
+ }
+ @media(min-width: $screen-xl) {
+ padding: var(--size-2) 0;
+ }
+ }
+ &__title {
+ color: var(--uw-white-1);
+ a{
+ color: var(--uw-white-1);
+ text-decoration: underline;
+ &:hover,
+ &:focus
+ {
+ color: var(--uw-white-1);
+ text-decoration: none;
+ }
+ }
+ //font-family: gesso-font-family(condensedbook);
+ //font-size: rem(gesso-font-size(3));
+ grid-column: 1 / 2;
+ grid-row: 1 / 2;
+ padding-bottom: var(--size-2);
+ text-align: center;
+ text-transform: uppercase;
+ @media(min-width: $screen-md) {
+ grid-row: 1 / 2;
+ text-align: left;
+ }
+ }
+ &__logo {
+ grid-column: 1 / 2;
+ grid-row: 1 / 2;
+ padding-bottom: var(--size-2);
+ text-align: center;
+ @media(min-width: $screen-md) {
+ grid-row: 1 / 2;
+ text-align: left;
+ }
+ }
+ &__social-media {
+ grid-column: 1 / 2;
+ grid-row: 3 / 4;
+ margin: 0 auto;
+ padding-bottom: var(--size-4);
+ width: 100%;
+ @media(min-width: $screen-md) {
+ grid-column: 2 / 3;
+ grid-row: 1 / 2;
+ margin: 0;
+ }
+
+ @media(min-width: $screen-xl) {
+ //padding:0;
+ }
+ }
+
+ &__content {
+ h2,
+ h3,
+ h4,
+ h5,
+ h6{
+ color: var(--uw-white-1);
+ }
+ color: var(--uw-white-1);
+ grid-column: 1 / 2;
+ grid-row: 2 / 3;
+ padding-bottom: var(--size-2);
+ text-align: center;
+ @media(min-width: $screen-md) {
+ grid-column: 1 / 3;
+ grid-row: 2 / 3;
+ text-align: left;
+ }
+ @media(min-width: $screen-xl) {
+ padding-left: 0;
+ padding-right: 0;
+ }
+ a{
+ color: var(--uw-white-1);
+ }
+ table {
+ caption{
+ color: var(--uw-white-1);
+ }
+ *{
+ color: var(--uw-white-1);
+ }
+ }
+ }
+
+ .uw-admin-label {
+ display: none;
+ }
+
+ .in-layout-builder {
+ border: 0;
+ margin: initial;
+ }
+}
diff --git a/src/patterns/03-layouts/site-footer/site-footer.twig b/src/patterns/03-layouts/site-footer/site-footer.twig
new file mode 100644
index 0000000000000000000000000000000000000000..933881a7207f8d815e1994059584ba33d3668446
--- /dev/null
+++ b/src/patterns/03-layouts/site-footer/site-footer.twig
@@ -0,0 +1,26 @@
+{% if site_name or logo_url %}
+<div class="uw-site-footer">
+ <div class="uw-site-footer__wrapper">
+
+ {% if logo_url %}
+ <div class="uw-site-footer__logo">
+ <a href="{{ logo_link }}">
+ <img src="{{ logo_url }}" alt="{{ logo_alt_text }}" />
+ </a>
+ </div>
+ {% else %}
+ <div class="uw-site-footer__title">
+ <a href="{{ home_link }}">
+ {{ site_name }}
+ </a>
+ </div>
+ {% endif %}
+ <div class="uw-site-footer__social-media">
+ social icons
+ </div>
+ <div class="uw-site-footer__content">
+ {{ body }}
+ </div>
+ </div>
+</div>
+{% endif %}
diff --git a/src/patterns/03-layouts/site-footer/site-footer.yml b/src/patterns/03-layouts/site-footer/site-footer.yml
new file mode 100644
index 0000000000000000000000000000000000000000..96b1ebbdb3a351425c8ac40dc6a7c715235e8d04
--- /dev/null
+++ b/src/patterns/03-layouts/site-footer/site-footer.yml
@@ -0,0 +1,22 @@
+body: "The standard Lorem Ipsum passage, used since the 1500s<br /><br />Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
+site_name: "Faculty of Environment"
+logo_link: "https://uwaterloo.ca"
+logo_url: "/uw_wcms_gesso/source/images/logos/uwaterloo-logo.svg"
+logo_alt_text: "Faculty of Health logo"
+home_link : "#"
+facebook: "https://www.facebook.com/University.Waterloo"
+social_media:
+ menu_tree:
+ - text: "Facebook"
+ url: "https://www.facebook.com/university.waterloo"
+ - text: "Twitter"
+ url: "https://twitter.com/uWaterloo"
+ - text: "YouTube"
+ url: "https://www.youtube.com/user/uwaterloo"
+ - text: "Instagram"
+ url: "https://www.instagram.com/uofwaterloo/"
+ - text: "LinkedIn"
+ url: "https://www.linkedin.com/edu/school?id=10875"
+ - text: "Snapchat"
+ url: "https://www.snapchat.com/add/uofwaterloo"
+social_media_placement: "local-site-footer"
diff --git a/src/patterns/04-components/color-bar/_color-bar.scss b/src/patterns/04-components/color-bar/_color-bar.scss
new file mode 100644
index 0000000000000000000000000000000000000000..88800fbb4ccb9aab06c308647ac1760b01dc15c5
--- /dev/null
+++ b/src/patterns/04-components/color-bar/_color-bar.scss
@@ -0,0 +1,53 @@
+$defaults: 'uw-gold';
+$faculties: 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat', 'org-sci', 'org-school', 'org-stp', 'org-cgc', 'org-stj', 'org-ren';
+$lvls: '--color1', 'lvl2', 'lvl3', 'lvl4';
+
+@each $default in $defaults {
+ @each $lvl in $lvls {
+ .uw-colour-bar__cbar {
+ &org-default__#{$default}--#{$lvl} {
+ background-color: gesso-brand('org-default', $default, $lvl);
+ }
+ }
+ }
+}
+
+@each $faculty in $faculties {
+ @each $lvl in $lvls {
+ .uw-colour-bar__cbar {
+ &#{$faculty}--#{$lvl} {
+ background-color: gesso-brand($faculty, $lvl);
+ }
+ }
+ }
+}
+
+.uw-colour-bar__cbars {
+ display: flex;
+ flex-direction: row wrap;
+ justify-content: flex-start;
+ width: 100%;
+}
+
+.uw-colour-bar__cbar {
+ -webkit-box-flex: 1;
+ -moz-flex: 1;
+ -ms-flex: 1;
+ -webkit-flex: 1;
+ flex: 1;
+ height: 0.625rem;
+ margin: 0;
+ padding: 0;
+
+ @include medium {
+ height: 0.875rem;
+ }
+
+ @include large {
+ height: 1rem;
+ }
+
+ @include xl {
+ height: 1.125rem;
+ }
+}
diff --git a/src/patterns/04-components/color-bar/color-bar.md b/src/patterns/04-components/color-bar/color-bar.md
new file mode 100644
index 0000000000000000000000000000000000000000..de2599b0fdef41f6f1eb5da165bc1a67e7f565b5
--- /dev/null
+++ b/src/patterns/04-components/color-bar/color-bar.md
@@ -0,0 +1,7 @@
+---
+el: .colour-bar
+title: Colour bar
+---
+
+__Variables:__
+* faculty: [string] The faculty of the colour bar (chooses the colour)
diff --git a/src/patterns/04-components/color-bar/color-bar.twig b/src/patterns/04-components/color-bar/color-bar.twig
new file mode 100644
index 0000000000000000000000000000000000000000..1261808b76888469b7f302830179ae5c6601c59a
--- /dev/null
+++ b/src/patterns/04-components/color-bar/color-bar.twig
@@ -0,0 +1,14 @@
+{% set lvls = 4 %}
+<div class="uw-colour-bar">
+ <div class="uw-colour-bar__wrapper">
+ <div class="uw-colour-bar__cbars">
+ {% for lvl in range(1,lvls) %}
+ {% if faculty == 'org-default' %}
+ <div class="uw-colour-bar__cbar org-default__uw-gold--lvl{{ lvl }}"></div>
+ {% else %}
+ <div class="uw-colour-bar__cbar {{ faculty }}--lvl{{ lvl }}"></div>
+ {% endif %}
+ {% endfor %}
+ </div>
+ </div>
+</div>
diff --git a/src/patterns/04-components/color-bar/color-bar.yml b/src/patterns/04-components/color-bar/color-bar.yml
new file mode 100644
index 0000000000000000000000000000000000000000..f233985715b8da55f3acac23bafaa5154d23636e
--- /dev/null
+++ b/src/patterns/04-components/color-bar/color-bar.yml
@@ -0,0 +1 @@
+faculty: 'org-ahs'
diff --git a/src/patterns/global.scss b/src/patterns/global.scss
index 78f14f32df48c808bcb9112e9cd6c069df93b610..7948a5159541eac76ef218f99a4de51e9cbbacc2 100644
--- a/src/patterns/global.scss
+++ b/src/patterns/global.scss
@@ -5,6 +5,4 @@
@use '01-core/props' as *;
@use '01-core/utilities' as *;
@use '01-core/elements' as *;
-@use '03-layouts/grid/grid' as *;
-@use '03-layouts/layout/layout-base' as *;
-@use '03-layouts/layout/layout' as *;
+@use '03-layouts' as *;
diff --git a/uw_wcms_ohana.libraries.yml b/uw_wcms_ohana.libraries.yml
new file mode 100644
index 0000000000000000000000000000000000000000..d941d3a2044b65dd0281b78cce350f07d2e59116
--- /dev/null
+++ b/uw_wcms_ohana.libraries.yml
@@ -0,0 +1,22 @@
+name: 'WCMS Ohana'
+description: 'Provides stylings to WCMS'
+type: module
+core_version_requirement: '^8 || ^9'
+components:
+ namespaces:
+ core:
+ - src/patterns/01-core
+ base:
+ - src/patterns/02-base
+ layouts:
+ - src/patterns/03-layouts
+ components:
+ - src/patterns/04-components
+ composites:
+ - src/patterns/05-composites
+ templates:
+ - src/patterns/06-templates
+ pages:
+ - src/patterns/06-pages
+dependencies:
+ - components:components