Merge pull request #325 from bitjson/ref/design

design(onboarding): polish font-sizes on very thin screens
This commit is contained in:
Matias Alejo Garcia 2016-10-10 12:14:18 -03:00 committed by GitHub
commit 2370fc97ad
1 changed files with 10 additions and 1 deletions

View File

@ -22,18 +22,27 @@
font-size: 24px; font-size: 24px;
margin-top: .5rem; margin-top: .5rem;
line-height: 1.3; line-height: 1.3;
@media(max-width: 350px) {
font-size: 20px;
}
} }
.onboarding-description { .onboarding-description {
margin-top: 1rem; margin-top: 1rem;
font-size: 16px; font-size: 16px;
color: rgba(255,255,255,0.5); color: rgba(255,255,255,0.5);
line-height: 1.5; line-height: 1.5;
@media(max-width: 350px) {
line-height: 1.3;
}
} }
.onboarding-tldr { .onboarding-tldr {
font-size: 18px; font-size: 18px;
margin-top: 1rem; margin-top: 1rem;
margin-bottom: 1em; margin-bottom: 1em;
line-height: 1.3; line-height: 1.3;
@media(max-width: 350px) {
font-size: 16px;
}
} }
} }
@ -55,7 +64,7 @@
%onboarding-illustration { %onboarding-illustration {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 40%; height: 45%;
margin-top: 25vh; margin-top: 25vh;
top: 0; top: 0;
background-position: center; background-position: center;