You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

145 lines
2.9 KiB

//overrides
.masonry-layout .masonry-item {
width: 100%;
@include breakpoint($tablet-up) {
width: 30.5%;
}
background-color: #f6f6f2;
border: 0;
margin: 0.5%;
padding: 0;
}
.page-node-type-landing-page .main-content {
background-color: #f8f9fa;
}
//rounded corners
.teaser-card {
$border-radius: 6px;
border-radius: $border-radius;
&__icon {
border-radius: 0 $border-radius 0 0;
}
img {
border-radius: $border-radius $border-radius 0 0;
}
}
.teaser-card {
&.green {
.teaser-card__category,
.teaser-card__icon {
background: #226f23;
background: $color01;
}
}
&.red {
.teaser-card__category,
.teaser-card__icon {
background: #d22b2e;
background: $color02;
}
}
&.blue {
.teaser-card__category,
.teaser-card__icon {
background: #1377ba;
background: $color03;
}
}
&.teal {
.teaser-card__category,
.teaser-card__icon {
background: #37868e;
background: $color04;
}
}
&.purple {
.teaser-card__category,
.teaser-card__icon {
background: #7201a1;
background: $color05;
}
}
&.aqua {
.teaser-card__category,
.teaser-card__icon {
background: #1fe5aa;
background: $color06;
}
}
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
background: #fff;
margin-bottom: 16px;
position: relative;
p {
padding-bottom: 0;
}
&__body {
flex: 1 1 auto;
padding: 1.25rem;
}
&__title {
font-family: $serif;
font-size: 2.2rem;
line-height: 2.8rem;
font-weight: 600;
}
&__author,
.field--name-field-affiliation-contributor {
font-family: $sans-serif;
text-transform: uppercase;
font-size: 1.8rem;
padding-top: 4px;
}
&__category {
color: #fff;
padding: 0.5rem 1.25rem;
text-transform: uppercase;
}
&__icon {
position: absolute;
top: 0;
right: 0;
padding: 5px 10px;
color: #fff;
font-size: 2rem;
}
img {
width: 100%;
}
}
/*====lp article preview cards==================*/
.preview-card__grid-row {
display: flex;
justify-content: space-between;
}
.preview-card {
box-shadow: 0 2px 14px rgba(100, 100, 100, 0.1),
0 2px 2px rgba(100, 100, 100, 0.1);
border: 1px solid #e4e4e4;
}
.preview-card {
margin: 0 1em 2em 1em;
height: 250px;
}
.preview-card:last-child {
margin: 0 0 2em 1em;
}
.preview-card:first-child {
margin: 0 1em 2rem 0;
}
.preview-card__caption {
margin: 10px;
}
.masonry-layout {
//xxx
@include breakpoint(mobile-only) {
.masonry-item {
//position: initial !important;
}
}
}