Commit 7614d434 authored by Martin Leblanc's avatar Martin Leblanc
Browse files

ISTWCMS-5063: removed the flex on social media icons and made elements...

ISTWCMS-5063: removed the flex on social media icons and made elements inline-block and forced consitent spacing
parents a8740c23 31579c78
......@@ -88,11 +88,15 @@
color: #fdd54f;
}
.org-default .uw-footer-phone a:link,
.org-default .uw-footer-phone a:visited,
.org-default .uw-territorial a:link,
.org-default .uw-territorial a:visited {
color: #fdd54f;
}
.org-default .uw-footer-phone a:hover,
.org-default .uw-footer-phone a:focus,
.org-default .uw-territorial a:hover,
.org-default .uw-territorial a:focus {
color: #fdd54f;
......@@ -3370,8 +3374,6 @@ input[size="60"] {
.uw-footer {
background-color: #000;
margin-top: 0;
min-height: 3rem;
padding: 0;
width: 100%;
}
......@@ -3382,13 +3384,21 @@ input[size="60"] {
padding: 0 16px;
display: grid;
grid-template-columns: 100%;
padding: 16px;
padding-top: 16px;
-webkit-text-size-adjust: none;
-moz-text-size-adjust: none;
-ms-text-size-adjust: none;
text-size-adjust: none;
}
@media (min-width: 75rem) {
.uw-footer__wrapper {
padding-left: 0;
padding-right: 0;
} }
@media (min-width: 30rem) {
.uw-footer__wrapper {
grid-template-columns: 50% 50%;
} }
@media (min-width: 48.06rem) {
.uw-footer__wrapper {
grid-template-columns: 28% auto 14rem;
......@@ -3399,57 +3409,65 @@ input[size="60"] {
} }
.uw-footer__address {
font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
font-size: 12.64px;
grid-column: 1 / 2;
font-size: 14.22224px;
-webkit-font-smoothing: antialiased;
grid-column: 1 / 3;
grid-row: 1 / 2;
margin-left: auto;
margin-right: auto;
padding-bottom: 16px;
padding: 16px 0 24px;
text-align: center;
}
@media (min-width: 48.06rem) {
.uw-footer__address {
grid-column: 1 / 3;
font-size: 12.64px;
grid-column: 1 / 2;
grid-row: 1 / 2;
margin: 0;
padding: 0;
text-align: left;
} }
@media (min-width: 63.1875rem) {
.uw-footer__address {
grid-column: 1 / 2;
grid-row: 1 / 2;
font-size: 14.22224px;
} }
.uw-footer__menu {
grid-column: 1 / 2;
grid-row: 2 / 3;
-webkit-font-smoothing: antialiased;
grid-column: 1 / 3;
padding-bottom: 16px;
}
@media (min-width: 48.06rem) {
@media (min-width: 30rem) {
.uw-footer__menu {
grid-column: 2 / 3;
grid-row: 1 / 2;
grid-column: 1 / 2;
grid-row: 2 / 3;
} }
@media (min-width: 63.1875rem) {
@media (min-width: 48.06rem) {
.uw-footer__menu {
grid-column: 2 / 3;
grid-row: 1 / 2;
} }
.uw-footer__social {
grid-column: 1 / 2;
grid-column: 1 / 3;
grid-row: 3 / 4;
margin: 0 auto;
margin-top: 1rem;
max-width: 13rem;
text-align: center;
width: 100%;
}
@media (min-width: 30rem) {
.uw-footer__social {
grid-column: 2 / 3;
grid-row: 2 / 3;
} }
@media (min-width: 48.06rem) {
.uw-footer__social {
grid-column: 3 / 4;
grid-row: 1 / 2;
margin: 0;
max-width: 16rem;
padding-left: 16px;
text-align: left;
} }
@media (min-width: 63.1875rem) {
.uw-footer__social {
grid-column: 3 / 4;
grid-row: 1 / 2;
} }
.uw-footer__social-directory {
text-align: center;
}
......@@ -3458,7 +3476,7 @@ input[size="60"] {
text-align: right;
} }
.uw-footer__social-directory a {
font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
font-family: Typ1451-Regular,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
font-size: 12.64px;
text-decoration: none;
}
......@@ -3469,6 +3487,12 @@ input[size="60"] {
grid-column: 1 / 4;
grid-row: 4 / 5;
}
.uw-footer__territorial a {
text-decoration: none;
}
.uw-footer__territorial a:hover {
text-decoration: underline;
}
@media (min-width: 48.06rem) {
.uw-footer__territorial {
grid-row: 3 / 4;
......@@ -4732,9 +4756,7 @@ input[size="60"] {
grid-column: 1 / 2;
grid-row: 3 / 4;
margin: 0 auto;
max-width: 17.5rem;
padding-bottom: 16px;
text-align: center;
width: 100%;
}
@media (min-width: 48.06rem) {
......@@ -8850,11 +8872,7 @@ fieldset .fieldset-wrapper .webform-container-inline .fieldset-invisible,
display: flex;
flex-direction: row;
flex-wrap: wrap;
font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif;
font-size: 0.702rem;
font-weight: 300;
justify-content: flex-start;
letter-spacing: 0.045rem;
list-style-type: none;
padding-bottom: 1rem;
text-align: center;
......@@ -8874,84 +8892,77 @@ fieldset .fieldset-wrapper .webform-container-inline .fieldset-invisible,
border-width: 1px 0 0 1px;
}
.menu--uw-footer li:nth-child(2) {
border-width: 1px 0 0 1px;
order: 2;
border-width: 1px 1px 0;
}
.menu--uw-footer li:nth-child(3) {
border-width: 1px 0 0 1px;
order: 3;
}
.menu--uw-footer li:nth-child(4) {
border-width: 1px 0 0 1px;
order: 4;
border-width: 1px 1px 0;
}
.menu--uw-footer li:nth-child(5) {
border-width: 1px;
order: 5;
border-width: 1px 0 0 1px;
}
.menu--uw-footer li:nth-child(6) {
border-width: 1px 1px 0;
order: 1;
}
.menu--uw-footer li:nth-child(7) {
border-width: 1px 1px 0;
order: 2;
border-width: 1px 0 0 1px;
}
.menu--uw-footer li:nth-child(8) {
border-width: 1px 1px 0;
order: 3;
}
.menu--uw-footer li:nth-child(9) {
border-width: 1px 1px 0;
order: 4;
border-width: 1px;
}
@media (min-width: 30rem) {
.menu--uw-footer li {
padding: 0.25rem 0 0.25rem 1rem;
padding: 0 0 0 0.5rem;
text-align: left;
}
.menu--uw-footer li:nth-child(1) {
border-width: 0 1px 0 0;
order: 1;
}
.menu--uw-footer li:nth-child(2) {
border-width: 0 1px 0 0;
order: 2;
}
.menu--uw-footer li:nth-child(3) {
border-width: 0 1px 0 0;
order: 3;
}
.menu--uw-footer li:nth-child(4) {
border-width: 0 1px 0 0;
order: 4;
}
.menu--uw-footer li:nth-child(5) {
border-width: 0;
order: 5;
border-width: 0 1px 0 0;
}
.menu--uw-footer li:nth-child(6) {
border-width: 0 1px 0 0;
order: 1;
}
.menu--uw-footer li:nth-child(7) {
border-width: 0 1px 0 0;
order: 2;
}
.menu--uw-footer li:nth-child(8) {
border-width: 0 1px 0 0;
order: 3;
}
.menu--uw-footer li:nth-child(9) {
border-width: 0 1px 0 0;
order: 4;
} }
@media (min-width: 48.06rem) {
.menu--uw-footer li {
flex: 1 0 33%;
padding: 0 0 0 1rem;
padding: 0 0.25rem 0 1rem;
}
.menu--uw-footer li:nth-child(1),
.menu--uw-footer li:nth-child(4),
.menu--uw-footer li:nth-child(7) {
border-width: 0 1px;
} }
.menu--uw-footer li a {
display: block;
font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif;
font-size: 0.88889rem;
font-weight: 300;
line-height: 1.50;
outline: none;
text-decoration: none;
}
......@@ -10040,24 +10051,28 @@ fieldset .fieldset-wrapper .webform-container-inline .fieldset-invisible,
}
.social-media-list {
align-items: flex-start;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
list-style-type: none;
margin: 0;
margin: 0 auto;
padding: 0;
padding-bottom: 16px;
text-align: center;
}
.uw-site-footer .social-media-list {
justify-content: center;
}
@media (min-width: 30rem) {
.social-media-list {
margin: 0;
max-width: inherit;
} }
@media (min-width: 48.06rem) {
.uw-site-footer .social-media-list {
justify-content: flex-end;
.social-media-list {
text-align: right;
} }
.social-media-list li {
padding-left: 0.4rem;
display: inline-block;
padding-left: 4px;
padding-top: 0;
}
.social-media-list li:first-of-type {
padding-left: 0;
}
@media (min-width: 48.06rem) {
......@@ -11618,7 +11633,7 @@ html:not(.js) .uw-tabcontent[role="tabpanel"][hidden] {
}
.uw-territorial p {
color: #fff;
font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
font-family: Typ1451-Regular,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
font-size: 0.79rem;
font-weight: 200;
letter-spacing: 0.5px;
......
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
......@@ -76,6 +76,7 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color:$uw-gold;
}
}
.uw-footer-phone a,
.uw-territorial a{
&:link,
&:visited {
......
......@@ -40,7 +40,6 @@ $uw-input-padding: 0.46667rem;
padding: $uw-input-padding;
transition: border-color;
width: 100%;
&:focus {
border: 1px solid $uw-input-border-color-focus !important;
box-shadow: inset 0 1px 3px rgba(0,0,0,.06), 0 0 5px rgba(104,104,104,.7);
......
......@@ -3,77 +3,85 @@
.uw-footer {
background-color: #000;
margin-top: 0;
min-height: 3rem;
padding: 0;
width: 100%;
&__wrapper {
@include uw-contained-width;
display: grid;
grid-template-columns: 100%;
padding: gesso-spacing(sm);
padding-top: gesso-spacing(sm);
text-size-adjust: none;
@include xs {
grid-template-columns:50% 50%;
}
@include medium {
grid-template-columns: 28% auto 14rem;
}
@include large {
grid-template-columns: 28% auto 16rem;
}
}
&__address {
font-family: gesso-font-family(systemmedium);
font-size: gesso-font-size(-2);
grid-column: 1 / 2;
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-bottom: gesso-spacing(sm);
padding: gesso-spacing(sm) 0 gesso-spacing(md);
text-align:center;
@include medium {
grid-column: 1 / 3;
font-size: gesso-font-size(-2);
grid-column: 1 / 2;
grid-row: 1 / 2;
margin:0;
padding:0;
text-align:left;
}
@include large {
grid-column: 1 / 2;
grid-row: 1 / 2;
font-size: gesso-font-size(-1);
}
}
&__menu {
grid-column: 1 / 2;
grid-row: 2 / 3;
@include medium {
grid-column: 2 / 3;
grid-row: 1 / 2;
-webkit-font-smoothing: antialiased;
grid-column: 1 / 3;
padding-bottom: gesso-spacing(sm);
@include xs {
grid-column: 1 / 2;
grid-row: 2 / 3;
}
@include large {
@include medium {
grid-column: 2 / 3;
grid-row: 1 / 2;
}
}
&__social {
grid-column: 1 / 2;
//background:$test-color-2;
grid-column: 1 / 3;
grid-row: 3 / 4;
margin:0 auto;
margin-top:1rem;
max-width:13rem;
text-align: center;
width:100%;
@include xs {
grid-column: 2 / 3;
grid-row: 2 / 3;
}
@include medium {
grid-column: 3 / 4;
grid-row: 1 / 2;
margin:0;
max-width:16rem;
padding-left:gesso-spacing(sm);
text-align: left;
}
@include large {
grid-column: 3 / 4;
grid-row: 1 / 2;
}
}
&__social-directory {
text-align: center;
@include medium {
......@@ -81,7 +89,7 @@
}
a {
font-family: gesso-font-family(systemmedium);
font-family: gesso-font-family(system);
font-size: gesso-font-size(-2);
text-decoration: none;
}
......@@ -91,6 +99,12 @@
}
}
&__territorial {
a{
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
grid-column: 1 / 4;
grid-row: 4 / 5;
@include medium {
......
......@@ -63,9 +63,7 @@
grid-column: 1 / 2;
grid-row: 3 / 4;
margin:0 auto;
max-width:17.5rem;
padding-bottom: gesso-spacing(sm);
text-align: center;
width:100%;
@include medium {
......
// @file
// Styles for the footer menu.
.menu--uw-footer {
align-items:flex-start;
display:flex;
flex-direction:row;
flex-wrap:wrap;
font-family: gesso-font-family(condensedbook);
font-size: rem(gesso-font-size(-3));
font-weight:300;
justify-content: flex-start;
letter-spacing: 0.045rem;
list-style-type: none;
padding-bottom: 1rem;
text-align: center;
......@@ -28,85 +23,76 @@
border-width: 1px 0 0 1px;
}
&:nth-child(2) {
border-width: 1px 0 0 1px;
order: 2;
border-width:1px 1px 0;
}
&:nth-child(3) {
border-width: 1px 0 0 1px;
order: 3;
}
&:nth-child(4) {
border-width: 1px 0 0 1px;
order: 4;
border-width:1px 1px 0;
}
&:nth-child(5) {
border-width: 1px;
order:5;
border-width: 1px 0 0 1px;
}
&:nth-child(6) {
border-width: 1px 1px 0;
order: 1;
}
&:nth-child(7) {
border-width: 1px 1px 0;
order: 2;
border-width: 1px 0 0 1px;
}
&:nth-child(8) {
border-width: 1px 1px 0;
order: 3;
}
&:nth-child(9) {
border-width: 1px 1px 0;
order: 4;
border-width: 1px;
}
@include xs {
padding: 0.25rem 0 0.25rem 1rem;
padding: 0 0 0 0.5rem;
text-align:left;
&:nth-child(1) {
border-width: 0 1px 0 0;
order:1;
}
&:nth-child(2) {
border-width: 0 1px 0 0;
order:2;
}
&:nth-child(3) {
border-width: 0 1px 0 0;
order:3;
}
&:nth-child(4) {
border-width: 0 1px 0 0;
order:4;
}
&:nth-child(5) {
border-width: 0;
order:5;
border-width: 0 1px 0 0;
}
&:nth-child(6) {
border-width: 0 1px 0 0;
order:1;
}
&:nth-child(7) {
border-width: 0 1px 0 0;
order:2;
}
&:nth-child(8) {
border-width: 0 1px 0 0;
order:3;
}
&:nth-child(9) {
border-width: 0 1px 0 0;
order:4;
}
}
@include medium {
flex: 1 0 33%;
padding: 0 0 0 1rem;
flex: 1 0 33%;
padding: 0 0.25rem 0 1rem;
&:nth-child(1),
&:nth-child(4),
&:nth-child(7){
border-width: 0 1px;
}
}
a {
display:block;
font-family: gesso-font-family(condensedbook);
font-size: rem(gesso-font-size(-1));
font-weight:300;
line-height:1.50;
outline:none;
text-decoration: none;
}
......
.social-media-list {
align-items: flex-start;
display: flex;
flex-wrap: wrap;