docs: update CSS for small screens (#177)

This commit is contained in:
Andrew Rynhard 2018-10-31 07:47:55 -07:00 committed by GitHub
parent 93c55aff97
commit 6152fa2539
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 80 additions and 44 deletions

View File

@ -140,33 +140,19 @@ pre {
.sidebar .button {
font-size: 12px;
margin: 5px;
}
.github-actions{
text-align: center;
.column .github-actions {
display: flex;
align-content: center;
justify-content: center;
}
.copyright {
color: #86929d;
}
@media screen and (max-width: 700px) {
.sidebar {
width: 100%;
height: auto;
position: relative;
}
.sidebar a {float: left;}
div.content {margin-left: 0;}
}
@media screen and (max-width: 400px) {
.sidebar a {
text-align: center;
float: none;
}
}
.nav {
/* position: fixed;
top: 0;
@ -179,7 +165,7 @@ pre {
text-align: center;
}
.nav > i {
.nav>i {
display: table-cell;
vertical-align: middle;
text-align: center;
@ -208,11 +194,43 @@ pre {
padding: 50px;
}
@media screen and (max-width: 700px) {}
@media screen and (max-width: 400px) {}
/* Larger than mobile screen */
@media (min-width: 40.0rem) {}
@media (max-width: 40.0rem) {
.sidebar a {
text-align: center;
float: none;
}
.footer {
flex-shrink: 0;
margin-left: 0px;
}
}
/* Larger than tablet screen */
@media (min-width: 80.0rem) {}
@media (max-width: 80.0rem) {
.sidebar {
width: 100%;
height: auto;
position: relative;
}
.sidebar a {
float: left;
}
div.content {
margin-left: 0;
}
.footer {
flex-shrink: 0;
margin-left: 0px;
}
}
/* Larger than desktop screen */
@media (min-width: 120.0rem) {}

View File

@ -140,33 +140,19 @@ pre {
.sidebar .button {
font-size: 12px;
margin: 5px;
}
.github-actions{
text-align: center;
.column .github-actions {
display: flex;
align-content: center;
justify-content: center;
}
.copyright {
color: #86929d;
}
@media screen and (max-width: 700px) {
.sidebar {
width: 100%;
height: auto;
position: relative;
}
.sidebar a {float: left;}
div.content {margin-left: 0;}
}
@media screen and (max-width: 400px) {
.sidebar a {
text-align: center;
float: none;
}
}
.nav {
/* position: fixed;
top: 0;
@ -179,7 +165,7 @@ pre {
text-align: center;
}
.nav > i {
.nav>i {
display: table-cell;
vertical-align: middle;
text-align: center;
@ -208,11 +194,43 @@ pre {
padding: 50px;
}
@media screen and (max-width: 700px) {}
@media screen and (max-width: 400px) {}
/* Larger than mobile screen */
@media (min-width: 40.0rem) {}
@media (max-width: 40.0rem) {
.sidebar a {
text-align: center;
float: none;
}
.footer {
flex-shrink: 0;
margin-left: 0px;
}
}
/* Larger than tablet screen */
@media (min-width: 80.0rem) {}
@media (max-width: 80.0rem) {
.sidebar {
width: 100%;
height: auto;
position: relative;
}
.sidebar a {
float: left;
}
div.content {
margin-left: 0;
}
.footer {
flex-shrink: 0;
margin-left: 0px;
}
}
/* Larger than desktop screen */
@media (min-width: 120.0rem) {}