[Update] Home: Lead text size

This commit is contained in:
0xfff 2016-11-06 22:46:35 +01:00
parent c4f1504d2d
commit 976c096122
3 changed files with 22 additions and 4 deletions

View file

@ -16,7 +16,7 @@ description: pages.home.description
<section class="section section--home-cta"> <section class="section section--home-cta">
<div class="section__content"> <div class="section__content">
<h2 class="section__title">{% t pages.home.video-heading %}</h2> <h2 class="section__title">{% t pages.home.video-heading %}</h2>
{% tmd pages.home.video-text %} <div class="section__lead">{% tmd pages.home.video-text %}</div>
<div class="section__btn-grp"> <div class="section__btn-grp">
<a href="https://www.youtube.com/watch?v=S0oNO3mbBE8" class="btn-blue btn-large" target="_blank" data-js-popup="video">{% t pages.home.video-btn %}</a> <a href="https://www.youtube.com/watch?v=S0oNO3mbBE8" class="btn-blue btn-large" target="_blank" data-js-popup="video">{% t pages.home.video-btn %}</a>

View file

@ -21,6 +21,9 @@
&--grey { &--grey {
background: $color-gray-light; background: $color-gray-light;
} }
&--blue {
background: $color-blue;
}
&--grey-blue { &--grey-blue {
background: $color-gray-light-blueish; background: $color-gray-light-blueish;
} }
@ -36,6 +39,9 @@
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
z-index: 3; z-index: 3;
@include mq($to: extrasmall) {
padding: 0;
}
@include mq($from: large) { @include mq($from: large) {
padding-top: 60px; padding-top: 60px;
padding-bottom: 120px; padding-bottom: 120px;

View file

@ -68,14 +68,26 @@ $m: 'section';
text-align: center; text-align: center;
padding-bottom: 60px; padding-bottom: 60px;
width: 100%; width: 100%;
@include mq($to: small) { // optical
text-align: left;
padding: 0 30px;
}
@include mq($to: extrasmall) {
padding: 0;
}
.#{$m} { .#{$m} {
&__title { &__title {
@include font-title-large(); @include font-title-xlarge();
margin-bottom: 20px; margin-bottom: 20px;
} }
&__lead {
@include font-lead();
color: $color-gray-dark;
}
&__btn-grp { &__btn-grp {
margin: 25px 0; margin: 30px 0 20px;
@include mq($to: 600px) { // optical @include mq($to: 600px) { // optical
& > * { & > * {
width: 100%; width: 100%;
@ -83,7 +95,7 @@ $m: 'section';
} }
} }
&__content { &__content {
max-width: 800px; max-width: 860px;
} }
} }
} }