Skip to content
Snippets Groups Projects
Commit f2f28afc authored by m26lebla's avatar m26lebla
Browse files

additional css to make the label same size as wcms2 - presentation layer... 

additional css to make the label same size as wcms2 -  presentation layer changes to grid the outputfor the views for blog,news, events landing pages
parent d90bd5cb
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
css/styles.css
+ 35
− 161
View file @ f2f28afc
......@@ -989,12 +989,14 @@ fieldset {
input {
line-height: normal; }
label {
label,
.label {
font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif;
font-size: 16px;
font-size: 20.256px;
font-weight: 400;
margin-bottom: 1rem; }
label abbr {
margin-bottom: 0.5rem; }
label abbr,
.label abbr {
display: inline;
font-size: 18px; }
......@@ -1718,163 +1720,6 @@ svg:not(:root) {
padding: 0;
width: 100%; }
.layout--uwfivecol {
display: grid; }
.layout--uwfivecol.even-split {
grid-template-columns: 20% 20% 20% 20% 20%; }
.layout--uwfivecol.larger-left {
grid-template-columns: 40% 15% 15% 15% 15%; }
.layout--uwfivecol.larger-second {
grid-template-columns: 15% 40% 15% 15% 15%; }
.layout--uwfivecol.larger-third {
grid-template-columns: 15% 15% 40% 15% 15%; }
.layout--uwfivecol.larger-fourth {
grid-template-columns: 15% 15% 15% 40% 15%; }
.layout--uwfivecol.larger-right {
grid-template-columns: 15% 15% 15% 15% 40%; }
.layout--uwfivecol.legacy-23-19-19-19-20 {
grid-template-columns: 23% 19% 19% 19% 20%; }
.layout--uwfivecol .layout__region--first {
grid-column: 1 / 2; }
.layout--uwfivecol .layout__region--second {
grid-column: 2 / 3; }
.layout--uwfivecol .layout__region--third {
grid-column: 3 / 4; }
.layout--uwfivecol .layout__region--fourth {
grid-column: 4 / 5; }
.layout--uwfivecol .layout__region--fifth {
grid-column: 5 / 6; }
.layout--uwfourcol {
display: grid; }
.layout--uwfourcol .layout__region--first {
grid-column: 1 / 2; }
.layout--uwfourcol .layout__region--second {
grid-column: 2 / 3; }
.layout--uwfourcol .layout__region--third {
grid-column: 3 / 4; }
.layout--uwfourcol .layout__region--fourth {
grid-column: 4 / 5; }
.layout--uwfourcol.even-split {
grid-template-columns: 25% 25% 25% 25%; }
.layout--uwfourcol.larger-left {
grid-template-columns: 50% 16.67% 16.67% 16.66%; }
.layout--uwfourcol.larger-second {
grid-template-columns: 16.67% 50% 16.67% 16.66%; }
.layout--uwfourcol.larger-third {
grid-template-columns: 16.67% 16.67% 50% 16.66%; }
.layout--uwfourcol.larger-right {
grid-template-columns: 16.67% 16.67% 16.66% 50%; }
.layout--uwfourcol.legacy-23-27-27-23 {
grid-template-columns: 23% 27% 27% 23%; }
.layout--invertedlleft {
display: grid; }
.layout--invertedlleft.even-split {
grid-template-columns: 50% 25% 25%; }
.layout--invertedlleft.larger-left {
grid-template-columns: 50% 33.5% 16.5%; }
.layout--invertedlleft.larger-right {
grid-template-columns: 50% 16.5% 33.5%; }
.layout--invertedlleft .layout__region--first {
grid-column: 1 / 2;
grid-row: 1 / 3; }
.layout--invertedlleft .layout__region--second {
grid-column: 2 / 3;
grid-row: 1 / 2; }
.layout--invertedlleft .layout__region--third {
grid-column: 3 / 4;
grid-row: 1 / 2; }
.layout--invertedlleft .layout__region--fourth {
grid-column: 2 / 4;
grid-row: 2 / 3; }
.layout--invertedlright {
display: grid; }
.layout--invertedlright.even-split {
grid-template-columns: 25% 25% 50%; }
.layout--invertedlright.larger-left {
grid-template-columns: 33.5% 16.5% 50%; }
.layout--invertedlright.larger-right {
grid-template-columns: 16.5% 33.5% 50%; }
.layout--invertedlright .layout__region--first {
grid-column: 1 / 2;
grid-row: 1 / 2; }
.layout--invertedlright .layout__region--first {
grid-column: 2 / 3;
grid-row: 1 / 2; }
.layout--invertedlright .layout__region--third {
grid-column: 1 / 3;
grid-row: 2 / 3; }
.layout--invertedlright .layout__region--fourth {
grid-column: 3 / 4;
grid-row: 1 / 3; }
.layout--uwfourcol {
display: grid;
grid-template-columns: 100%; }
.layout--uwfourcol .layout__region--first {
grid-column: 1 / 2; }
.layout--uwthreecol {
display: grid; }
.layout--uwthreecol .layout__region--first {
grid-column: 1 / 2; }
.layout--uwthreecol .layout__region--second {
grid-column: 2 / 3; }
.layout--uwthreecol .layout__region--third {
grid-column: 3 / 4; }
.layout--uwthreecol.even-split {
grid-template-columns: 33% 34% 33%; }
.layout--uwthreecol.larger-left {
grid-template-columns: 50% 25% 25%; }
.layout--uwthreecol.larger-middle {
grid-template-columns: 25% 50% 25%; }
.layout--uwthreecol.larger-right {
grid-template-columns: 25% 25% 50%; }
.layout--uwthreecol.legacy-38-38-24 {
grid-template-columns: 38% 38% 24%; }
.layout--uwthreecol.legacy-24-38-38 {
grid-template-columns: 24% 38% 38%; }
.layout.uw-contained-width {
margin-left: auto;
margin-right: auto;
max-width: 63.1875rem;
padding: 0 16px; }
@media (min-width: 80rem) {
.layout.uw-contained-width {
padding-left: 0;
padding-right: 0; } }
.layout--uwtwocol {
display: grid; }
.layout--uwtwocol .layout__region--first {
grid-column: 1 / 2; }
.layout--uwtwocol .layout__region--second {
grid-column: 2 / 3; }
.layout--uwtwocol.larger-left {
grid-template-columns: 67% 33%; }
.layout--uwtwocol.larger-right {
grid-template-columns: 33% 67%; }
.layout--uwtwocol.even-split {
grid-template-columns: 50% 50%; }
.l-media {
display: flex;
flex-direction: column; }
......@@ -5062,6 +4907,35 @@ html:not(.js) .uw-tabcontent[role="tabpanel"][hidden] {
margin-right: auto;
text-align: center; }
.views-element-container {
margin-left: auto;
margin-right: auto;
max-width: 63.1875rem;
padding: 0 16px;
padding: 1rem; }
@media (min-width: 80rem) {
.views-element-container {
padding-left: 0;
padding-right: 0; } }
@media (min-width: 80rem) {
.views-element-container {
padding: 1rem 0; } }
.view-content {
display: inline-flex;
flex-flow: row wrap; }
.view.view-uw-view-blogs .views-row, .view.view-uw-view-events .views-row, .view.view-uw-view-news-items .views-row {
margin: 1rem;
width: 100%; }
@media (min-width: 40.06rem) {
.view.view-uw-view-blogs .views-row, .view.view-uw-view-events .views-row, .view.view-uw-view-news-items .views-row {
flex-grow: 1;
width: 45%; } }
@media (min-width: 63.1875rem) {
.view.view-uw-view-blogs .views-row, .view.view-uw-view-events .views-row, .view.view-uw-view-news-items .views-row {
width: 32%; } }
.view__filters {
margin-bottom: 1rem; }
......
source/_patterns/02-base/02-html-elements/25-forms/_forms.scss
+ 4
− 3
View file @ f2f28afc
......@@ -63,11 +63,12 @@ input {
// input[type='url'] {}
// input[type='week'] {}
label {
label,
.label{
font-family: $form-label-font-family;
font-size: gesso-font-size(0);
font-size: gesso-font-size(2);
font-weight: gesso-font-weight(regular);
margin-bottom: rem(gesso-spacing(sm));
margin-bottom: rem(gesso-spacing(xs));
abbr {
display: inline;
font-size: gesso-font-size(1);
......
source/_patterns/04-components/view/_view.scss
+ 47
− 1
View file @ f2f28afc
// @file
// Styles for a view.
// .view {}
// Align the views container to the max width contain-width function.
.views-element-container{
@include uw-contained-width;
padding: rem(gesso-spacing(sm));
@include xl {
padding:rem(gesso-spacing(sm)) 0;
}
}
// set the layout for the Views container when being used with Blog, news, events
// to match flexbox in multi list usage.
.view{
// View content container.
&-content{
display:inline-flex;
flex-flow: row wrap;
}
//View container for blog landing page.
&.view-uw-view-blogs,
// View container for events landing page.
&.view-uw-view-events,
// View container for newslanding page.
&.view-uw-view-news-items{
// Universal row for views
.views-row{
margin: rem(gesso-spacing(sm));
width:100%;
@include small{
flex-grow: 1;
width: 45%;
}
@include large{
width: 32%;
}
}
}
}
.view-filters{
// Universal filter form used on events, blog and news.
.views-exposed-form{
}
}
// Previous code .
.view__filters {
margin-bottom: rem(gesso-spacing(sm));
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment