some spacing things

This commit is contained in:
Lisa P 2015-10-27 17:17:37 +01:00
parent fda6e7f6f9
commit 8719b1a772

View File

@ -1,4 +1,14 @@
.landing-pro .landing-pro
p a
text-decoration: none
border-bottom: 1px solid #bfc0c1
padding-bottom: 0.1em
&:hover,
&:active
color: #303030
border-color: transparent
.wrapper .wrapper
width: 100% width: 100%
padding-bottom: 0 padding-bottom: 0
@ -7,147 +17,167 @@
.landing-footer .landing-footer
margin-top: 0 margin-top: 0
.inner .inner
margin: auto margin: auto
max-width: 1024px max-width: 1024px
padding: 0 $column-gutter/2 padding: 0 $column-gutter/2
.h1 .h1
font-size: 50px font-size: 64px
color: #408692 !important color: #408692 !important
font-weight: 300 font-weight: 300
margin: 0 margin: 0
line-height: 1.3
%h2 %h2
font-size: 40px margin: 0 0 .5em
font-weight: 300 font-size: 32px
line-height: 1.2 font-weight: 300
line-height: 1.3
.h2--green .h2--green
@extend %h2 @extend %h2
color: #39A85B color: #39A85B
.h2--teal .h2--teal
@extend %h2 @extend %h2
color: #408692 margin-bottom: 1em
color: #408692
.h3 .h3
margin: .5em 0 margin: .5em 0
font-size: 22px font-size: 20px
font-weight: 300 font-weight: 300
.text-big .text-big
font-size: 26px font-size: 20px
font-weight: 300 font-weight: 300
line-height: 1.55 line-height: 1.55
.text-small .text-small
margin: 0 margin: 0 0 2.5em
font-size: 18px
.landing-button
.landing-button display: inline-block
display: inline-block padding: 0.9em 1em
padding: 0.9em 1em margin: 0 auto
margin: 0 auto
color: white
border-radius: 2px
font-size: 27px
text-decoration: none
background-color: #39A85B
&:hover
color: white color: white
background-color: #73c78d border-radius: 2px
font-size: 27px
text-decoration: none
background-color: #39A85B
&:hover
color: white
background-color: #73c78d
.hero-button .hero-button
@extend .landing-button @extend .landing-button
padding: 0.9em 1em 0.9em 3em padding: 0.9em 1em 0.9em 3em
background: background:
image: inline-image('landing-page/sign-in-mascot.svg') image: inline-image('landing-page/sign-in-mascot.svg')
size: 1.7em size: 1.7em
position: 0.8em center position: 0.8em center
repeat: no-repeat repeat: no-repeat
.hero-computer .hero-computer
width: 100% width: 100%
height: 100% height: 35em
position: absolute
transform: translateY(-.1rem)
.section--grey .section--grey
background-color: #F6F6F6 padding: 4rem 0 5rem
background-color: #F6F6F6
.section--white .section--white
background-color: white padding: 6rem 0
background-color: white
.section--center .section--center
text-align: center text-align: center
.section--feature .section--feature
.inner .inner
display: flex
justify-content: space-between
flex-direction: column
@media #{$medium-up}
flex-direction: row
.section-list,
.section-text
flex: 0 0 47%
.section--hero
.inner
display: flex
justify-content: space-between
flex-direction: column
@media #{$medium-up}
flex-direction: row
.section-text
flex: 0 0 47%
.section-image
flex: 0 0 50%
.section-image
position: relative
.text-big
margin: 0.8em 0 1.7em
%list
list-style: none
padding: 0
margin: 0
.list--customers
@extend %list
display: flex display: flex
justify-content: space-around
.section-list, flex-wrap: wrap
.section-text width: 88%
flex: 1 0 50% margin: auto
li
flex: 0 0 12em
.list--languages
.section--hero @extend %list
.inner
display: flex display: flex
justify-content: space-around
.section-image, flex-wrap: wrap
.section-text li
flex: 1 0 50% flex: 0 0 9%
%list .list--check
list-style: none @extend %list
padding: 0 li
margin: 0 @extend .text-big
line-height: 1.65
&:before
content: ""
display: inline-block
height: 1.2em
width: 1.2em
margin-right: .3em
vertical-align: middle
background:
image: inline-image('line-icons/icon-passed.svg')
.list--customers .list--features
@extend %list @extend %list
display: flex display: flex
justify-content: space-around justify-content: space-between
flex-wrap: wrap flex-wrap: wrap
li
flex: 1 0 20%
.list--languages li
@extend %list flex: 0 0 43%
display: flex
justify-content: space-around
flex-wrap: wrap
li
flex: 0 0 9%
.list--check
@extend %list
li
@extend .text-big
&:before
content: ""
display: inline-block
height: 1.2em
width: 1.2em
margin-right: .3em
vertical-align: middle
background:
image: inline-image('line-icons/icon-passed.svg')
.list--features
@extend %list
display: flex
justify-content: space-around
flex-wrap: wrap
li
flex: 0 0 50%
.landing-pro
[class^="customer-"] [class^="customer-"]
display: block display: block
@ -173,8 +203,8 @@
[class^="feature-"] [class^="feature-"]
display: block display: block
height: 2.5em height: 2em
width: 2.5em width: 2em
overflow: hidden overflow: hidden
margin: auto margin: auto
background: background: