diff --git a/components/_patterns/00-base/_global.scss b/components/_patterns/00-base/_global.scss
index ab0dd1757d5ce495c13967bd2a5caf8f47af2d33..0cd9c4218a158c5f1095c6ce451f996c57460308 100644
--- a/components/_patterns/00-base/_global.scss
+++ b/components/_patterns/00-base/_global.scss
@@ -5,7 +5,7 @@
.layout-container {
display: grid;
grid-template-columns: auto;
- grid-template-rows: auto minmax(451.5px, auto) auto;
+ grid-template-rows: minmax(60px, auto) minmax(451.5px, auto) minmax(100px, auto);
}
.layout-container header {
@@ -23,6 +23,10 @@
grid-row: 3;
}
+html {
+ background-color: black;
+}
+
body {
font-family: georgia, "droid serif", "Times New Roman", Times, serif;
font-size: 1rem;
diff --git a/components/_patterns/00-base/global/01-colors/_color-vars.scss b/components/_patterns/00-base/global/01-colors/_color-vars.scss
index 067205f3dcace8a009a2e022fd697b231381cc09..c8652d505c87d42e460397e1e215e595bb3331a1 100644
--- a/components/_patterns/00-base/global/01-colors/_color-vars.scss
+++ b/components/_patterns/00-base/global/01-colors/_color-vars.scss
@@ -8,6 +8,6 @@ $gray-dark: #4c4c4c;
$gray-darker: #333;
$black: black;
$uw-black: #000;
-$uw-gray: #757575;
$uw-gold: #fdd54f;
$uw-white: #fff;
+$uw-grey: #787878;
diff --git a/components/_patterns/00-base/global/01-colors/colors.yml b/components/_patterns/00-base/global/01-colors/colors.yml
index e2081232a5e05be6c57c252cf818c30f82bff7f4..6fd832b696b9bea8b19d1be84a842f7b81709de8 100644
--- a/components/_patterns/00-base/global/01-colors/colors.yml
+++ b/components/_patterns/00-base/global/01-colors/colors.yml
@@ -19,12 +19,12 @@ items:
value: black
- name: $uw-black
value: '#000'
- - name: $uw-gray
- value: '#757575'
- name: $uw-gold
value: '#fdd54f'
- name: $uw-white
value: '#fff'
+ - name: $uw-grey
+ value: '#787878'
meta:
description: >-
To add to these items, use Sass variables that start with <code>$</code> in
diff --git a/components/_patterns/01-atoms/09-menu/social-media/_social-media.scss b/components/_patterns/01-atoms/09-menu/social-media/_social-media.scss
index 5d9f616ee8ef38794fc6c93900c383b440c9693e..f36a04c388e3d113f81131947390445a1a7de189 100644
--- a/components/_patterns/01-atoms/09-menu/social-media/_social-media.scss
+++ b/components/_patterns/01-atoms/09-menu/social-media/_social-media.scss
@@ -23,25 +23,23 @@ i.fdsu-snapchat::before {
}
i.social-media-i {
+ font-size: 2rem;
padding: 0.2rem;
- font-size: 2.02729rem;
border-radius: 3px;
color: #000;
+ font-style: normal;
background-color: $uw-white;
}
i.social-media-i:hover {
color: $uw-gold;
background-color: $uw-black;
- transition-property: color, background-color;
- transition-duration: 0.2s;
- transition-delay: 0s;
}
a.social-media-link {
color: black;
text-decoration: none;
- background-color: $uw-white;
+ background-color: $uw-black;
}
a.social-media-link:hover {
@@ -54,4 +52,5 @@ li.social-media-list-item {
list-style-type: none;
background-color: $uw-black;
margin: 0;
+ padding-top: 0.4rem;
}
diff --git a/components/_patterns/02-molecules/menus/global-footer-menu/_global-footer-menu.scss b/components/_patterns/02-molecules/menus/global-footer-menu/_global-footer-menu.scss
index 6d493d0aaeb8fd5a13f2b776b124ce54e0815fbb..969f2ac58bd0246d9799574337ca916f75a539c5 100644
--- a/components/_patterns/02-molecules/menus/global-footer-menu/_global-footer-menu.scss
+++ b/components/_patterns/02-molecules/menus/global-footer-menu/_global-footer-menu.scss
@@ -3,14 +3,26 @@
font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif;
}
+ul.global-footer-menu {
+ margin: 0;
+}
+
.global-footer-menu {
display: grid;
grid-template-columns: auto auto auto;
grid-template-rows: auto auto auto;
- padding: 1rem 0;
list-style-type: none;
}
+.global-footer-menu li:nth-child(3n+1) {
+ border-left: 1px solid $uw-grey;
+}
+
+.global-footer-menu li:nth-child(n) {
+ padding-left: 0.8rem;
+ border-right: 1px solid grey;
+}
+
.global-footer-menu li:nth-child(1) {
grid-column: 1;
grid-row: 1;
diff --git a/components/_patterns/02-molecules/menus/global-header-menu/_global-header-menu.scss b/components/_patterns/02-molecules/menus/global-header-menu/_global-header-menu.scss
index c41cfa3dcc73812cbecb72b559586196b4725e44..5e584a12684289f4b247a7e204035f311d411fbc 100644
--- a/components/_patterns/02-molecules/menus/global-header-menu/_global-header-menu.scss
+++ b/components/_patterns/02-molecules/menus/global-header-menu/_global-header-menu.scss
@@ -5,8 +5,8 @@
font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif;
text-transform: uppercase;
letter-spacing: 0.045rem;
- font-size: 0.88889rem;
- margin-top: 1.2rem;
+ font-size: 1rem;
+ margin-top: 1rem;
}
.global-menu li {
diff --git a/components/_patterns/02-molecules/menus/social-media-menu/social-media-menu.scss b/components/_patterns/02-molecules/menus/social-media-menu/_social-media-menu.scss
similarity index 91%
rename from components/_patterns/02-molecules/menus/social-media-menu/social-media-menu.scss
rename to components/_patterns/02-molecules/menus/social-media-menu/_social-media-menu.scss
index e03dcefc3202a6073ea9fecf3d6ee48d40e3d492..a0aff9b47e186db01a6c5da9ddf44bfa3a9c34d8 100644
--- a/components/_patterns/02-molecules/menus/social-media-menu/social-media-menu.scss
+++ b/components/_patterns/02-molecules/menus/social-media-menu/_social-media-menu.scss
@@ -11,7 +11,7 @@ ul.social-media-list {
flex-wrap: wrap;
width: 100%;
max-width: 95%;
- padding: 1rem 0;
+ padding-bottom: 0.5rem;
}
.uw-footer-social-media {
diff --git a/components/_patterns/02-molecules/menus/social-media-menu/social-media-menu.twig b/components/_patterns/02-molecules/menus/social-media-menu/social-media-menu.twig
index e70ea6fafbc567fbf4b0ab23e3580231bde8a06d..0714ae4a85758ff9ec33beaeb87493acfca454b3 100644
--- a/components/_patterns/02-molecules/menus/social-media-menu/social-media-menu.twig
+++ b/components/_patterns/02-molecules/menus/social-media-menu/social-media-menu.twig
@@ -7,7 +7,4 @@
}%}
{% endfor %}
</ul>
- <div class="uw-footer-social-directory">
- <a href="https://uwaterloo.ca/social-media/">@uwaterloo social directory</a>
- </div>
</div>
\ No newline at end of file
diff --git a/components/_patterns/02-molecules/search-button/_search-button.scss b/components/_patterns/02-molecules/search-button/_search-button.scss
index 02c46467a284225dd3329756758593ad7fb2192c..908d3659f6dd96931f8f961a0ece4ca137e974f1 100644
--- a/components/_patterns/02-molecules/search-button/_search-button.scss
+++ b/components/_patterns/02-molecules/search-button/_search-button.scss
@@ -1,20 +1,10 @@
-#uw-header-search-button {
- background-color: $uw-black;
-}
-
-.uw-header--buttons {
- border: none;
- display: block;
- width: 100%;
- height: 100%;
- background-color: $uw-black;
-}
-
.uw-header--buttons__search {
display: block;
border: none;
text-transform: uppercase;
text-align: center;
+ background-color: $uw-black;
+ padding-top: 0.4rem;
}
a.search-button {
@@ -32,5 +22,5 @@ a.search-button:hover {
.uw-header--buttons__search a.search-button .ifdsu {
display: block;
- font-size: 1.26562rem;
+ font-size: 1.3rem;
}
diff --git a/components/_patterns/02-molecules/search-button/search-button.twig b/components/_patterns/02-molecules/search-button/search-button.twig
index c1d5a1a4e8ee4e195a5978b3b9ddb5e2dab066e8..1c844c660e7e8edb2e4c69ac88a7d4bd7d93610a 100644
--- a/components/_patterns/02-molecules/search-button/search-button.twig
+++ b/components/_patterns/02-molecules/search-button/search-button.twig
@@ -1,4 +1,4 @@
<div id="uw-header-search-button" class="uw-header--buttons__search">
- <a href="/search_modal/nojs" title="" class="ctools-use-modal search-button ctools-use-modal-processed" aria-label="search" aria-expanded="false">
+ <a href="/search_modal/nojs" title="" class="search-button" aria-label="search" aria-expanded="false">
<span class="ifdsu fdsu-search-2"></span>search</a>
</div>
\ No newline at end of file
diff --git a/components/_patterns/03-organisms/site/site-footer/_site-footer.scss b/components/_patterns/03-organisms/site/site-footer/_site-footer.scss
index 73a22b9c2e699078fa28778d33b82320d7bd50c6..5a475e67ba981992a278af27ffffe83757e6757a 100644
--- a/components/_patterns/03-organisms/site/site-footer/_site-footer.scss
+++ b/components/_patterns/03-organisms/site/site-footer/_site-footer.scss
@@ -11,21 +11,33 @@ footer {
margin-left: auto;
margin-right: auto;
display: grid;
- grid-template-columns: auto auto auto;
+ grid-template-columns: 25% auto 30%;
grid-template-rows: auto;
+ padding: 1rem;
}
.uw-footer-grid .footer-1 {
- grid-column: 1;
- grid-row: 1;
+ grid-column: 1 / 2;
+ grid-row: 1 / 2;
}
-.uw-footer-flex .footer-2 {
- grid-column: 2;
- grid-row: 1;
+.uw-footer-grid .footer-2 {
+ grid-column: 2 / 3;
+ grid-row: 1 / 2;
}
-.uw-footer-flex .footer-3 {
- grid-column: 3;
- grid-row: 1;
+.uw-footer-grid .footer-3 {
+ grid-column: 3 / 4;
+ grid-row: 1 / 2;
+ text-align: right;
+}
+
+.uw-footer-social-directory a {
+ color: $uw-white;
+ text-decoration: none;
+}
+
+.uw-footer-social-directory a:hover {
+ color: $uw-gold;
+ text-decoration: underline;
}
diff --git a/components/_patterns/03-organisms/site/site-footer/site-footer.twig b/components/_patterns/03-organisms/site/site-footer/site-footer.twig
index 6e0d185e50ebd324945e44abe6451ee8f8ce0774..208fab1ea45586914b81e6ed36ac6dbd903e286f 100644
--- a/components/_patterns/03-organisms/site/site-footer/site-footer.twig
+++ b/components/_patterns/03-organisms/site/site-footer/site-footer.twig
@@ -13,6 +13,9 @@
{% include "@molecules/menus/social-media-menu/social-media-menu.twig" with {
"social_media": social_media
} %}
+ <div class="uw-footer-social-directory">
+ <a href="https://uwaterloo.ca/social-media/">@uwaterloo social directory</a>
+ </div>
</div>
</div>
</footer>
diff --git a/components/_patterns/03-organisms/site/site-header/_site-header.scss b/components/_patterns/03-organisms/site/site-header/_site-header.scss
index 9d060d546a44c5516278083dac7e0a5c8f1a647e..5937a953eb30ee39571a7f05d133dd7c1fceff9c 100644
--- a/components/_patterns/03-organisms/site/site-header/_site-header.scss
+++ b/components/_patterns/03-organisms/site/site-header/_site-header.scss
@@ -20,23 +20,23 @@
.uw-header-grid {
display: grid;
- grid-template-columns: auto auto auto;
+ grid-template-columns: 17% auto 10%;
grid-template-rows: auto;
}
.uw-header-grid .header-1 {
- grid-column: 1;
- grid-row: 1;
+ grid-column: 1 / 2;
+ grid-row: 1 / 2;
}
.uw-header-grid .header-2 {
- grid-column: 2;
- grid-row: 1;
+ grid-column: 2 / 3;
+ grid-row: 1 / 2;
}
.uw-header-grid .header-3 {
- grid-column: 3;
- grid-row: 1;
+ grid-column: 3 / 4;
+ grid-row: 1 / 2;
}
.uw-header--content {