Add responsive nav styles when Javascript is disabled

This commit is contained in:
Michael Rose 2013-07-03 13:44:22 -04:00
parent 92ef268031
commit 3d54cdc60e
2 changed files with 627 additions and 2955 deletions

File diff suppressed because it is too large Load diff

View file

@ -47,6 +47,7 @@ body {
// Responsive nav toggle stuff // Responsive nav toggle stuff
#site-nav { #site-nav {
z-index: 9999; z-index: 9999;
display: none;
@media @medium { @media @medium {
-webkit-animation-duration: 1s; -webkit-animation-duration: 1s;
-moz-animation-duration: 1s; -moz-animation-duration: 1s;
@ -58,17 +59,21 @@ body {
animation-delay: .05s; animation-delay: .05s;
} }
&.closed { &.closed {
display: none;
@media @medium { @media @medium {
display: block; display: block;
} }
} }
&.opened { &.opened {
display: block;
max-height: 100%; max-height: 100%;
li { li {
float: none; float: none;
} }
} }
}
.no-js #site-nav {
display: block;
} }
#nav-toggle { #nav-toggle {
display: block; display: block;
@ -290,14 +295,14 @@ span + .entry-title {
border-bottom-width: 0; border-bottom-width: 0;
} }
} }
// Pagination
.pagination {
text-align: center;
}
// Disqus Comments // Disqus Comments
#disqus_thread { #disqus_thread {
margin-top: 2em; margin-top: 2em;
} }
// Pagination
.pagination {
text-align: center;
}
// Page layout // Page layout
#home, #home,
#page { #page {