mirror of
https://github.com/graphql-python/graphene.git
synced 2025-07-06 21:33:28 +03:00
Improved mobile styling
This commit is contained in:
parent
ace871a49f
commit
5a5ce2439f
89
style.css
89
style.css
|
@ -162,7 +162,7 @@ strong {
|
||||||
font-weight: 100;
|
font-weight: 100;
|
||||||
font-size: 42px;
|
font-size: 42px;
|
||||||
color: #747474;
|
color: #747474;
|
||||||
line-height: 49px;
|
line-height: 1.2em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
animation: fadeIn .5s ease-in-out forwards;
|
animation: fadeIn .5s ease-in-out forwards;
|
||||||
animation-fill-mode: both;
|
animation-fill-mode: both;
|
||||||
|
@ -243,7 +243,7 @@ strong {
|
||||||
#page-nav a {
|
#page-nav a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin: 0 0;
|
margin: 0 0;
|
||||||
color: #C4C4C4;
|
color: #BBB;
|
||||||
line-height: 32px;
|
line-height: 32px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
padding: 52px 16px 51px;
|
padding: 52px 16px 51px;
|
||||||
|
@ -269,11 +269,11 @@ strong {
|
||||||
}
|
}
|
||||||
#page-headline h3 {
|
#page-headline h3 {
|
||||||
font-family: 'Helvetica Neue';
|
font-family: 'Helvetica Neue';
|
||||||
font-weight: 100;
|
font-weight: 200;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
color: #999999;
|
color: #AAA;
|
||||||
letter-spacing: 0.6px;
|
letter-spacing: 0.6px;
|
||||||
line-height: 16px;
|
line-height: 16px;
|
||||||
}
|
}
|
||||||
|
@ -319,27 +319,74 @@ strong {
|
||||||
|
|
||||||
|
|
||||||
@keyframes logo-dash {
|
@keyframes logo-dash {
|
||||||
to {
|
to {
|
||||||
stroke-dashoffset: 0;
|
stroke-dashoffset: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes logo-dot {
|
@keyframes logo-dot {
|
||||||
from {
|
from {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
transform:scale(0);
|
transform:scale(0);
|
||||||
}
|
}
|
||||||
to {
|
to {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
transform:scale(1);
|
transform:scale(1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fadeIn {
|
@keyframes fadeIn {
|
||||||
from {
|
from {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
to {
|
to {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width:599px) {
|
||||||
|
#main-logo {
|
||||||
|
margin: 50px auto;
|
||||||
|
}
|
||||||
|
#headline h1 {
|
||||||
|
font-size: 32px;
|
||||||
|
}
|
||||||
|
#main-nav {
|
||||||
|
margin-top: 40px;
|
||||||
|
}
|
||||||
|
#main-nav a {
|
||||||
|
padding: 5px 0;
|
||||||
|
float: left;
|
||||||
|
display: block;
|
||||||
|
clear: left;
|
||||||
|
}
|
||||||
|
#top-header {
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
#page-nav {
|
||||||
|
float: right;
|
||||||
|
margin-right: -20px;
|
||||||
|
margin-top: 6px;
|
||||||
|
}
|
||||||
|
#page-nav a {
|
||||||
|
padding: 0;
|
||||||
|
display: block;
|
||||||
|
text-align: right;
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
#page-nav .github-icon {
|
||||||
|
text-indent: 10000px;
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
#page-nav a.active {
|
||||||
|
box-shadow: inset -4px 0px 0 #D06D6D;
|
||||||
|
}
|
||||||
|
#page-headline {
|
||||||
|
padding: 48px 0;
|
||||||
|
}
|
||||||
|
#page-article {
|
||||||
|
padding-top: 24px;
|
||||||
|
padding-bottom: 24px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user