diff --git a/css/styles.css b/css/styles.css index 93ae42245c01f378a15829254eaa4ebe77fd58a9..55a9db550630336da603c5a58a2ec0e51d142228 100644 --- a/css/styles.css +++ b/css/styles.css @@ -2008,7 +2008,9 @@ svg:not(:root) { @media (min-width: 48.06rem) { .uw-node.uw-node__with-sidebar .uw-node__grid { flex-direction: row; - gap: 1rem; } + gap: 1rem; + /* Match the width of WCMS2's narrow: 496px */ + /* Match the width of WCMS2's wide: 753px */ } .uw-node.uw-node__with-sidebar .uw-node__grid .layout { width: clamp(320px, 875px, calc(100vw - 333px)); } .uw-node.uw-node__with-sidebar .uw-node__grid .uw-contained-width { @@ -2143,6 +2145,23 @@ svg:not(:root) { @media (min-width: 75rem) { .uw-site-footer__wrapper { padding: 16px 0; } } + .uw-site-footer__title { + font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif; + font-size: 1.424rem; + grid-column: 1 / 2; + grid-row: 1 / 2; + padding-bottom: 16px; + text-align: center; + text-transform: uppercase; } + .uw-site-footer__title a { + color: #fff; + text-decoration: underline; } + .uw-site-footer__title a:hover, .uw-site-footer__title a:focus { + text-decoration: none; } + @media (min-width: 48.06rem) { + .uw-site-footer__title { + grid-row: 1 / 2; + text-align: left; } } .uw-site-footer__logo { grid-column: 1 / 2; grid-row: 1 / 2; @@ -3213,7 +3232,6 @@ button { height: 1.125rem; } } .uw-footer-address { - background-color: #000; color: #fff; } .uw-footer-address .uw-footer-phone a { color: #fdd54f; @@ -4298,7 +4316,6 @@ fieldset, font-size: 1rem; } .menu--uw-footer { - background-color: #000; display: grid; font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif; font-size: 0.702rem; diff --git a/source/_patterns/03-layouts/site-footer/_site-footer.scss b/source/_patterns/03-layouts/site-footer/_site-footer.scss index c1b59e8efcd822adfc7f7b8544188b73651f89ae..0ac965fc4bc51243996228e29067973b4405a273 100644 --- a/source/_patterns/03-layouts/site-footer/_site-footer.scss +++ b/source/_patterns/03-layouts/site-footer/_site-footer.scss @@ -1,5 +1,6 @@ .uw-site-footer { background-color: $uw-local-site-footer-background-color; + &__wrapper { @include uw-contained-width(); display: grid; @@ -17,7 +18,33 @@ padding:gesso-spacing(sm) 0; } } + &__title { + a{ + color:#fff; + text-decoration:underline; + + + &:hover, + &:focus + { + 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: gesso-spacing(sm); + text-align: center; + text-transform:uppercase; + @include medium { + grid-row: 1 / 2; + text-align: left; + + } + } &__logo { grid-column: 1 / 2; grid-row: 1 / 2; diff --git a/source/_patterns/03-layouts/site-footer/site-footer.twig b/source/_patterns/03-layouts/site-footer/site-footer.twig index bb2b01ce6fe48ea89b7b439ca2aa476c6bb9dbfc..069828315a98ca5356bb416fba3d27422fb025e4 100644 --- a/source/_patterns/03-layouts/site-footer/site-footer.twig +++ b/source/_patterns/03-layouts/site-footer/site-footer.twig @@ -1,10 +1,19 @@ <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="{{ logo_link }}"> + {{ site_name }} + </a> + </div> + {% endif %} <div class="uw-site-footer__social-media"> {% include "@components/menu/menu--social/menu--social.twig" with { social_media_placement: 'local-site-footer', diff --git a/source/_patterns/03-layouts/site-footer/site-footer.yml b/source/_patterns/03-layouts/site-footer/site-footer.yml index 433d85c8ecf70424ffbd2d5360b8287bfad8d2e4..96b1ebbdb3a351425c8ac40dc6a7c715235e8d04 100644 --- a/source/_patterns/03-layouts/site-footer/site-footer.yml +++ b/source/_patterns/03-layouts/site-footer/site-footer.yml @@ -1,8 +1,9 @@ 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://www.wlu.ca/" +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: diff --git a/source/_patterns/04-components/contact-info/_contact-info.scss b/source/_patterns/04-components/contact-info/_contact-info.scss index 9ec2733d2e612bc5f6ea4a6c34f23dd23f57f038..5129e4716123b2958595dea315bb21e58ae96e34 100644 --- a/source/_patterns/04-components/contact-info/_contact-info.scss +++ b/source/_patterns/04-components/contact-info/_contact-info.scss @@ -1,5 +1,4 @@ .uw-footer-address { - background-color: #000; color: #fff; .uw-footer-phone { diff --git a/source/_patterns/04-components/menu/menu--footer/_menu--footer.scss b/source/_patterns/04-components/menu/menu--footer/_menu--footer.scss index 345c7b552a78b71f5a3c352aa19a8c84b5e9fe82..f14688524b15bd7f1d5e4e8ff0de1778ff27a03c 100644 --- a/source/_patterns/04-components/menu/menu--footer/_menu--footer.scss +++ b/source/_patterns/04-components/menu/menu--footer/_menu--footer.scss @@ -2,7 +2,6 @@ // Styles for the footer menu. .menu--uw-footer { - background-color: #000; display: grid; font-family: gesso-font-family(condensedbook); font-size: rem(gesso-font-size(-3));