Cleanup and various fixes
This commit is contained in:
parent
a2759b7bd2
commit
31fb443562
|
@ -228,32 +228,41 @@ table thead td {
|
||||||
-ms-transition: color 0.5s;
|
-ms-transition: color 0.5s;
|
||||||
transition: color 0.5s;
|
transition: color 0.5s;
|
||||||
}
|
}
|
||||||
.mobile-nav-chapters {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.nav-chapters:hover {
|
.nav-chapters:hover {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
.nav-wrapper {
|
||||||
|
margin-top: 50px;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.mobile-nav-chapters {
|
||||||
|
font-size: 2.5em;
|
||||||
|
text-align: center;
|
||||||
|
text-decoration: none;
|
||||||
|
width: 90px;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
.previous {
|
.previous {
|
||||||
left: 15px;
|
float: left;
|
||||||
-webkit-transition: left 0.5s;
|
|
||||||
-moz-transition: left 0.5s;
|
|
||||||
-o-transition: left 0.5s;
|
|
||||||
-ms-transition: left 0.5s;
|
|
||||||
transition: left 0.5s;
|
|
||||||
}
|
}
|
||||||
.next {
|
.next {
|
||||||
|
float: right;
|
||||||
right: 15px;
|
right: 15px;
|
||||||
}
|
}
|
||||||
@media only screen and (min-width: 1251px) {
|
@media only screen and (max-width: 1080px) {
|
||||||
.sidebar-visible .previous {
|
.nav-chapters {
|
||||||
left: 315px;
|
display: none;
|
||||||
|
}
|
||||||
|
.nav-wrapper {
|
||||||
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media only screen and (max-width: 1060px) {
|
@media only screen and (max-width: 1380px) {
|
||||||
.nav-wrapper {
|
.sidebar-visible .nav-chapters {
|
||||||
max-width: 750px;
|
display: none;
|
||||||
margin: 0 auto;
|
}
|
||||||
|
.sidebar-visible .nav-wrapper {
|
||||||
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.theme-popup {
|
.theme-popup {
|
||||||
|
@ -275,37 +284,6 @@ table thead td {
|
||||||
border-top-left-radius: inherit;
|
border-top-left-radius: inherit;
|
||||||
border-top-right-radius: inherit;
|
border-top-right-radius: inherit;
|
||||||
}
|
}
|
||||||
@media only screen and (max-width: 1060px) {
|
|
||||||
.nav-chapters {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.mobile-nav-chapters {
|
|
||||||
font-size: 2.5em;
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
max-width: 150px;
|
|
||||||
min-width: 90px;
|
|
||||||
-webkit-box-pack: center;
|
|
||||||
-moz-box-pack: center;
|
|
||||||
-o-box-pack: center;
|
|
||||||
-ms-flex-pack: center;
|
|
||||||
-webkit-justify-content: center;
|
|
||||||
justify-content: center;
|
|
||||||
-ms-flex-line-pack: center;
|
|
||||||
-webkit-align-content: center;
|
|
||||||
align-content: center;
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
.next {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
.previous {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.light {
|
.light {
|
||||||
color: #333;
|
color: #333;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
|
|
@ -93,13 +93,7 @@
|
||||||
|
|
||||||
<div id="content" class="content">
|
<div id="content" class="content">
|
||||||
{{{ content }}}
|
{{{ content }}}
|
||||||
</div>
|
|
||||||
|
|
||||||
<!--
|
|
||||||
Constrain the space between buttons on small screen so the total
|
|
||||||
width of the buttons group will not exceed the main content
|
|
||||||
above.
|
|
||||||
-->
|
|
||||||
<div class="nav-wrapper">
|
<div class="nav-wrapper">
|
||||||
<!-- Mobile navigation buttons -->
|
<!-- Mobile navigation buttons -->
|
||||||
{{#previous}}
|
{{#previous}}
|
||||||
|
@ -116,7 +110,7 @@
|
||||||
|
|
||||||
<div style="clear: both"></div>
|
<div style="clear: both"></div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{{#previous}}
|
{{#previous}}
|
||||||
|
|
|
@ -9,6 +9,7 @@
|
||||||
margin: 0
|
margin: 0
|
||||||
max-width: 150px
|
max-width: 150px
|
||||||
min-width: 90px
|
min-width: 90px
|
||||||
|
|
||||||
display: flex
|
display: flex
|
||||||
justify-content: center
|
justify-content: center
|
||||||
align-content: center
|
align-content: center
|
||||||
|
@ -17,23 +18,38 @@
|
||||||
transition: color 0.5s
|
transition: color 0.5s
|
||||||
}
|
}
|
||||||
|
|
||||||
.mobile-nav-chapters { display: none }
|
|
||||||
.nav-chapters:hover { text-decoration: none }
|
.nav-chapters:hover { text-decoration: none }
|
||||||
.previous {
|
|
||||||
left: $page-padding
|
|
||||||
transition: left 0.5s
|
|
||||||
}
|
|
||||||
.next { right: $page-padding }
|
|
||||||
|
|
||||||
@media only screen and (min-width: 1251px) {
|
|
||||||
.sidebar-visible .previous {
|
|
||||||
left: $sidebar-width + $page-padding
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-wrapper {
|
.nav-wrapper {
|
||||||
@media only screen and (max-width: $max-page-width-with-hidden-sidebar) {
|
margin-top: 50px
|
||||||
max-width: $content-max-width
|
display: none
|
||||||
margin: 0 auto
|
}
|
||||||
|
|
||||||
|
.mobile-nav-chapters {
|
||||||
|
font-size: 2.5em
|
||||||
|
text-align: center
|
||||||
|
text-decoration: none
|
||||||
|
width: 90px
|
||||||
|
border-radius: 5px
|
||||||
|
}
|
||||||
|
|
||||||
|
.previous {
|
||||||
|
float: left
|
||||||
|
}
|
||||||
|
|
||||||
|
.next {
|
||||||
|
float: right
|
||||||
|
right: $page-padding
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: $page-plus-sidebar-width) {
|
||||||
|
.nav-chapters { display: none }
|
||||||
|
.nav-wrapper { display: block }
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: $page-plus-sidebar-width + $sidebar-width) {
|
||||||
|
.sidebar-visible {
|
||||||
|
.nav-chapters { display: none }
|
||||||
|
.nav-wrapper { display: block }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,36 +22,3 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: $max-page-width-with-hidden-sidebar) {
|
|
||||||
|
|
||||||
.nav-chapters {
|
|
||||||
display: none
|
|
||||||
}
|
|
||||||
|
|
||||||
.mobile-nav-chapters {
|
|
||||||
font-size: 2.5em
|
|
||||||
text-align: center
|
|
||||||
text-decoration: none
|
|
||||||
|
|
||||||
max-width: 150px
|
|
||||||
min-width: 90px
|
|
||||||
|
|
||||||
justify-content: center
|
|
||||||
align-content: center
|
|
||||||
|
|
||||||
position: relative
|
|
||||||
display: inline-block
|
|
||||||
margin-bottom: 50px
|
|
||||||
|
|
||||||
border-radius: 5px
|
|
||||||
}
|
|
||||||
|
|
||||||
.next {
|
|
||||||
float: right
|
|
||||||
}
|
|
||||||
|
|
||||||
.previous {
|
|
||||||
float: left
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
$sidebar-width = 300px
|
$sidebar-width = 300px
|
||||||
$page-padding = 15px
|
$page-padding = 15px
|
||||||
$content-max-width = 750px
|
$content-max-width = 750px
|
||||||
$max-page-width-with-hidden-sidebar = 1060px
|
|
||||||
$page-plus-sidebar-width = $content-max-width + $sidebar-width + $page-padding * 2
|
$page-plus-sidebar-width = $content-max-width + $sidebar-width + $page-padding * 2
|
||||||
|
|
Loading…
Reference in New Issue