Skip to content

Commit 31fb443

Browse files
committed
Cleanup and various fixes
1 parent a2759b7 commit 31fb443

File tree

5 files changed

+70
-116
lines changed

5 files changed

+70
-116
lines changed

src/theme/book.css

Lines changed: 24 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -228,32 +228,41 @@ table thead td {
228228
-ms-transition: color 0.5s;
229229
transition: color 0.5s;
230230
}
231-
.mobile-nav-chapters {
231+
.nav-chapters:hover {
232+
text-decoration: none;
233+
}
234+
.nav-wrapper {
235+
margin-top: 50px;
232236
display: none;
233237
}
234-
.nav-chapters:hover {
238+
.mobile-nav-chapters {
239+
font-size: 2.5em;
240+
text-align: center;
235241
text-decoration: none;
242+
width: 90px;
243+
border-radius: 5px;
236244
}
237245
.previous {
238-
left: 15px;
239-
-webkit-transition: left 0.5s;
240-
-moz-transition: left 0.5s;
241-
-o-transition: left 0.5s;
242-
-ms-transition: left 0.5s;
243-
transition: left 0.5s;
246+
float: left;
244247
}
245248
.next {
249+
float: right;
246250
right: 15px;
247251
}
248-
@media only screen and (min-width: 1251px) {
249-
.sidebar-visible .previous {
250-
left: 315px;
252+
@media only screen and (max-width: 1080px) {
253+
.nav-chapters {
254+
display: none;
251255
}
252-
}
253-
@media only screen and (max-width: 1060px) {
254256
.nav-wrapper {
255-
max-width: 750px;
256-
margin: 0 auto;
257+
display: block;
258+
}
259+
}
260+
@media only screen and (max-width: 1380px) {
261+
.sidebar-visible .nav-chapters {
262+
display: none;
263+
}
264+
.sidebar-visible .nav-wrapper {
265+
display: block;
257266
}
258267
}
259268
.theme-popup {
@@ -275,37 +284,6 @@ table thead td {
275284
border-top-left-radius: inherit;
276285
border-top-right-radius: inherit;
277286
}
278-
@media only screen and (max-width: 1060px) {
279-
.nav-chapters {
280-
display: none;
281-
}
282-
.mobile-nav-chapters {
283-
font-size: 2.5em;
284-
text-align: center;
285-
text-decoration: none;
286-
max-width: 150px;
287-
min-width: 90px;
288-
-webkit-box-pack: center;
289-
-moz-box-pack: center;
290-
-o-box-pack: center;
291-
-ms-flex-pack: center;
292-
-webkit-justify-content: center;
293-
justify-content: center;
294-
-ms-flex-line-pack: center;
295-
-webkit-align-content: center;
296-
align-content: center;
297-
position: relative;
298-
display: inline-block;
299-
margin-bottom: 50px;
300-
border-radius: 5px;
301-
}
302-
.next {
303-
float: right;
304-
}
305-
.previous {
306-
float: left;
307-
}
308-
}
309287
.light {
310288
color: #333;
311289
background-color: #fff;

src/theme/index.hbs

Lines changed: 16 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -93,30 +93,24 @@
9393

9494
<div id="content" class="content">
9595
{{{ content }}}
96-
</div>
97-
98-
<!--
99-
Constrain the space between buttons on small screen so the total
100-
width of the buttons group will not exceed the main content
101-
above.
102-
-->
103-
<div class="nav-wrapper">
104-
<!-- Mobile navigation buttons -->
105-
{{#previous}}
106-
<a rel="prev" href="{{link}}" class="mobile-nav-chapters previous" title="Previous chapter">
107-
<i class="fa fa-angle-left"></i>
108-
</a>
109-
{{/previous}}
11096

111-
{{#next}}
112-
<a rel="next" href="{{link}}" class="mobile-nav-chapters next" title="Next chapter">
113-
<i class="fa fa-angle-right"></i>
114-
</a>
115-
{{/next}}
116-
117-
<div style="clear: both"></div>
97+
<div class="nav-wrapper">
98+
<!-- Mobile navigation buttons -->
99+
{{#previous}}
100+
<a rel="prev" href="{{link}}" class="mobile-nav-chapters previous" title="Previous chapter">
101+
<i class="fa fa-angle-left"></i>
102+
</a>
103+
{{/previous}}
104+
105+
{{#next}}
106+
<a rel="next" href="{{link}}" class="mobile-nav-chapters next" title="Next chapter">
107+
<i class="fa fa-angle-right"></i>
108+
</a>
109+
{{/next}}
110+
111+
<div style="clear: both"></div>
112+
</div>
118113
</div>
119-
120114
</div>
121115

122116
{{#previous}}

src/theme/stylus/nav-icons.styl

Lines changed: 29 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
margin: 0
1010
max-width: 150px
1111
min-width: 90px
12+
1213
display: flex
1314
justify-content: center
1415
align-content: center
@@ -17,23 +18,38 @@
1718
transition: color 0.5s
1819
}
1920

20-
.mobile-nav-chapters { display: none }
2121
.nav-chapters:hover { text-decoration: none }
22+
23+
.nav-wrapper {
24+
margin-top: 50px
25+
display: none
26+
}
27+
28+
.mobile-nav-chapters {
29+
font-size: 2.5em
30+
text-align: center
31+
text-decoration: none
32+
width: 90px
33+
border-radius: 5px
34+
}
35+
2236
.previous {
23-
left: $page-padding
24-
transition: left 0.5s
37+
float: left
2538
}
26-
.next { right: $page-padding }
2739

28-
@media only screen and (min-width: 1251px) {
29-
.sidebar-visible .previous {
30-
left: $sidebar-width + $page-padding
31-
}
40+
.next {
41+
float: right
42+
right: $page-padding
3243
}
3344

34-
.nav-wrapper {
35-
@media only screen and (max-width: $max-page-width-with-hidden-sidebar) {
36-
max-width: $content-max-width
37-
margin: 0 auto
38-
}
45+
@media only screen and (max-width: $page-plus-sidebar-width) {
46+
.nav-chapters { display: none }
47+
.nav-wrapper { display: block }
48+
}
49+
50+
@media only screen and (max-width: $page-plus-sidebar-width + $sidebar-width) {
51+
.sidebar-visible {
52+
.nav-chapters { display: none }
53+
.nav-wrapper { display: block }
54+
}
3955
}

src/theme/stylus/theme-popup.styl

Lines changed: 1 addition & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -21,37 +21,4 @@
2121
}
2222
}
2323

24-
}
25-
26-
@media only screen and (max-width: $max-page-width-with-hidden-sidebar) {
27-
28-
.nav-chapters {
29-
display: none
30-
}
31-
32-
.mobile-nav-chapters {
33-
font-size: 2.5em
34-
text-align: center
35-
text-decoration: none
36-
37-
max-width: 150px
38-
min-width: 90px
39-
40-
justify-content: center
41-
align-content: center
42-
43-
position: relative
44-
display: inline-block
45-
margin-bottom: 50px
46-
47-
border-radius: 5px
48-
}
49-
50-
.next {
51-
float: right
52-
}
53-
54-
.previous {
55-
float: left
56-
}
57-
}
24+
}

src/theme/stylus/variables.styl

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
$sidebar-width = 300px
22
$page-padding = 15px
33
$content-max-width = 750px
4-
$max-page-width-with-hidden-sidebar = 1060px
54
$page-plus-sidebar-width = $content-max-width + $sidebar-width + $page-padding * 2

0 commit comments

Comments
 (0)