59 lines
850 B
SCSS
59 lines
850 B
SCSS
/*
|
|
* Featured Blog Section
|
|
* Section for featuring a large blog item.
|
|
*
|
|
* Version:
|
|
* 1.0.0 - 2018/10/30
|
|
*/
|
|
@import '~@styles/global';
|
|
|
|
.c-featured-article {
|
|
display: block;
|
|
width: 100%;
|
|
|
|
&__content {width: 100%;}
|
|
|
|
&__box {}
|
|
|
|
&__image {
|
|
display: block;
|
|
width: 100%;
|
|
}
|
|
|
|
&__heading {
|
|
transform: translateY(-60%);
|
|
margin-bottom: -2em;
|
|
overflow: visible;
|
|
}
|
|
|
|
&__title {
|
|
margin: 0;
|
|
}
|
|
|
|
@include t-media-query($s-small-up) {
|
|
padding: 1em;
|
|
|
|
&__content { display: flex; }
|
|
|
|
&__heading {
|
|
transform: translate(-10%, -60%);
|
|
}
|
|
|
|
&__box {
|
|
width: 40%;
|
|
padding: 0.5em;
|
|
|
|
&.is-image{order:2;width: 60%;}
|
|
}
|
|
}
|
|
|
|
@include t-media-query($s-medium-up) {
|
|
padding: 2em;
|
|
&__box {
|
|
width: 50%;
|
|
&.is-image {width: 50%;}
|
|
padding: 2em;
|
|
}
|
|
}
|
|
}
|