Size and spacing improvements, killed secondary CTA, changed contributor layout, other fixes
This commit is contained in:
@ -21,20 +21,21 @@ body {
|
||||
|
||||
h1 {
|
||||
font-weight: $bold;
|
||||
font-size: $medium;
|
||||
line-height: $large;
|
||||
font-size: 36px;
|
||||
line-height: 48px;
|
||||
margin: 0 0 $small 0;
|
||||
|
||||
@media screen and (min-width: $tablet) {
|
||||
font-size: 36px;
|
||||
line-height: 48px;
|
||||
font-size: 42px;
|
||||
line-height: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: $roboto;
|
||||
font-size: $small;
|
||||
font-weight: $regular;
|
||||
font-size: 32px;
|
||||
font-weight: $bold;
|
||||
color: $darkGrey;
|
||||
margin: 0 auto $tiny auto;
|
||||
|
||||
&.subhead {
|
||||
@ -44,9 +45,9 @@ h2 {
|
||||
|
||||
h3 {
|
||||
font-family: $roboto;
|
||||
font-size: $tiny;
|
||||
font-weight: $bold;
|
||||
line-height: 32px;
|
||||
font-size: 18px;
|
||||
font-weight: $semibold;
|
||||
line-height: 40px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
@ -4,32 +4,35 @@
|
||||
padding: $xl 0 $large 0;
|
||||
|
||||
.community-features {
|
||||
@neat-span-columns 8;
|
||||
|
||||
@media screen and (min-width: $desktop) {
|
||||
@neat-span-columns 6;
|
||||
}
|
||||
|
||||
.feature {
|
||||
margin-top: $small;
|
||||
|
||||
@media screen and (min-width: $tablet) {
|
||||
@neat-span-columns 6;
|
||||
}
|
||||
|
||||
&.contributors {
|
||||
|
||||
@media screen and (min-width: $tablet) {
|
||||
@neat-span-columns 8;
|
||||
}
|
||||
|
||||
.contributor-list {
|
||||
margin-top: $micro;
|
||||
img {
|
||||
width: 32px;
|
||||
margin: 0 $micro $micro 0;
|
||||
border-radius: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.contributors {
|
||||
@neat-span-columns 10;
|
||||
margin-top: $small;
|
||||
|
||||
@media screen and (min-width: $desktop) {
|
||||
@neat-span-columns 5;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.contributor-list {
|
||||
margin-top: $micro;
|
||||
img {
|
||||
width: 32px;
|
||||
margin: 0 $micro $micro 0;
|
||||
border-radius: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
@ -38,23 +38,27 @@
|
||||
color: white;
|
||||
text-transform: uppercase;
|
||||
font-size: $tiny;
|
||||
letter-spacing: 0.5px;
|
||||
background-color: $blue;
|
||||
background-image: linear-gradient(-180deg, #4A7FDD 0%, #3A69C7 100%);
|
||||
box-shadow: 0 4px 12px 0 rgba(68,74,87,0.10), 0 1px 3px 0 rgba(68,74,87,0.20);
|
||||
border-radius: $borderRadius;
|
||||
padding: 12px 18px 12px 18px;
|
||||
transition: .2s;
|
||||
text-align: center;
|
||||
|
||||
@media screen and (min-width: $desktop) {
|
||||
min-width: 122px;
|
||||
min-width: 120px;
|
||||
margin: 0 0 0 $small;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
margin-right: -4px;
|
||||
transform: scale(1.05);
|
||||
box-shadow: 0 4px 12px 0 rgba(68,74,87,0.20), 0 1px 3px 0 rgba(68,74,87,0.40);
|
||||
}
|
||||
&:active {
|
||||
transform: scale(0.9);
|
||||
transform: scale(0.95);
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -5,7 +5,7 @@
|
||||
text-align: center;
|
||||
|
||||
h2, p {
|
||||
max-width: 800px;
|
||||
max-width: $desktop;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
@ -21,7 +21,7 @@
|
||||
}
|
||||
|
||||
.feature {
|
||||
max-width: 320px;
|
||||
max-width: 340px;
|
||||
|
||||
img {
|
||||
max-width: 280px;
|
||||
|
@ -43,11 +43,12 @@
|
||||
|
||||
.subhead {
|
||||
display: inline-block;
|
||||
margin: $tiny auto;
|
||||
margin: $micro auto;
|
||||
font-size: 18px;
|
||||
line-height: 26px;
|
||||
|
||||
@media screen and (min-width: $mobile) {
|
||||
display: block;
|
||||
margin: calc($micro * 0.5) 0 $small 0;
|
||||
@media screen and (min-width: $desktop) {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -66,6 +67,7 @@
|
||||
|
||||
h3 {
|
||||
color: $green;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.hero-features {
|
||||
|
Reference in New Issue
Block a user