mirror of
https://github.com/seigler/dash-website
synced 2025-07-27 07:16:10 +00:00
[Update] Home: Lead text size
This commit is contained in:
parent
c4f1504d2d
commit
976c096122
3 changed files with 22 additions and 4 deletions
|
@ -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>
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue