diff --git a/src/tests/book-minimal-with-assets/assets/_html-template/_layouts/page.hbs b/src/tests/book-minimal-with-assets/assets/_html-template/_layouts/page.hbs
index ec5a88ff..d4b30941 100644
--- a/src/tests/book-minimal-with-assets/assets/_html-template/_layouts/page.hbs
+++ b/src/tests/book-minimal-with-assets/assets/_html-template/_layouts/page.hbs
@@ -2,7 +2,7 @@
- {{ title }}
+ {{ page-title }}
@@ -11,16 +11,11 @@
-
-
-
+
-
-
-
@@ -41,6 +36,10 @@
@@ -53,13 +52,19 @@
-
+
+ {{#translation-links}}{{/translation-links}}
+
+
+
+
+
{{{ content }}}
@@ -93,6 +98,9 @@
+
+ {{{livereload}}}
+
diff --git a/src/tests/book-minimal-with-assets/assets/_html-template/css/book.css b/src/tests/book-minimal-with-assets/assets/_html-template/css/book.css
index 3646bc65..3129b114 100644
--- a/src/tests/book-minimal-with-assets/assets/_html-template/css/book.css
+++ b/src/tests/book-minimal-with-assets/assets/_html-template/css/book.css
@@ -1,3 +1,162 @@
+body.highlightjs-light .hljs {
+ display: block;
+ overflow-x: auto;
+ background: #f1f1f1;
+ color: #6e6b5e;
+ padding: 0.5em;
+ -webkit-text-size-adjust: none;
+}
+body.highlightjs-light .hljs-comment {
+ color: #aaa;
+}
+body.highlightjs-light .hljs-variable,
+body.highlightjs-light .hljs-tag,
+body.highlightjs-light .hljs-regexp,
+body.highlightjs-light .hljs-name,
+body.highlightjs-light .ruby .hljs-constant,
+body.highlightjs-light .xml .hljs-tag .hljs-title,
+body.highlightjs-light .xml .hljs-pi,
+body.highlightjs-light .xml .hljs-doctype,
+body.highlightjs-light .html .hljs-doctype,
+body.highlightjs-light .css .hljs-id,
+body.highlightjs-light .css .hljs-class,
+body.highlightjs-light .css .hljs-pseudo {
+ color: #d73737;
+}
+body.highlightjs-light .hljs-number,
+body.highlightjs-light .hljs-preprocessor,
+body.highlightjs-light .hljs-built_in,
+body.highlightjs-light .hljs-literal,
+body.highlightjs-light .hljs-params,
+body.highlightjs-light .hljs-attribute,
+body.highlightjs-light .hljs-constant {
+ color: #b65611;
+}
+body.highlightjs-light .ruby .hljs-class .hljs-title,
+body.highlightjs-light .css .hljs-rule .hljs-attribute {
+ color: #ae9513;
+}
+body.highlightjs-light .hljs-string,
+body.highlightjs-light .hljs-value,
+body.highlightjs-light .hljs-inheritance,
+body.highlightjs-light .ruby .hljs-symbol,
+body.highlightjs-light .xml .hljs-cdata {
+ color: #2a9292;
+}
+body.highlightjs-light .hljs-title,
+body.highlightjs-light .css .hljs-hexcolor {
+ color: #1fad83;
+}
+body.highlightjs-light .hljs-function,
+body.highlightjs-light .python .hljs-decorator,
+body.highlightjs-light .python .hljs-title,
+body.highlightjs-light .ruby .hljs-function .hljs-title,
+body.highlightjs-light .ruby .hljs-title .hljs-keyword,
+body.highlightjs-light .perl .hljs-sub,
+body.highlightjs-light .javascript .hljs-title,
+body.highlightjs-light .coffeescript .hljs-title {
+ color: #6684e1;
+}
+body.highlightjs-light .hljs-keyword,
+body.highlightjs-light .javascript .hljs-function {
+ color: #b854d4;
+}
+body.highlightjs-light .coffeescript .javascript,
+body.highlightjs-light .javascript .xml,
+body.highlightjs-light .tex .hljs-formula,
+body.highlightjs-light .xml .javascript,
+body.highlightjs-light .xml .vbscript,
+body.highlightjs-light .xml .css,
+body.highlightjs-light .xml .hljs-cdata {
+ opacity: 0.5;
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+ filter: alpha(opacity=50);
+}
+body.highlightjs-light .hljs-header {
+ color: #a30000;
+}
+body.highlightjs-light .hljs-link_label {
+ color: #3cc;
+}
+body.highlightjs-light .hljs-link_url {
+ color: #c6f;
+}
+body.highlightjs-dark .hljs-comment {
+ color: #969896;
+}
+body.highlightjs-dark .hljs-variable,
+body.highlightjs-dark .hljs-attribute,
+body.highlightjs-dark .hljs-tag,
+body.highlightjs-dark .hljs-regexp,
+body.highlightjs-dark .ruby .hljs-constant,
+body.highlightjs-dark .xml .hljs-tag .hljs-title,
+body.highlightjs-dark .xml .hljs-pi,
+body.highlightjs-dark .xml .hljs-doctype,
+body.highlightjs-dark .html .hljs-doctype,
+body.highlightjs-dark .css .hljs-id,
+body.highlightjs-dark .css .hljs-class,
+body.highlightjs-dark .css .hljs-pseudo {
+ color: #c66;
+}
+body.highlightjs-dark .hljs-number,
+body.highlightjs-dark .hljs-preprocessor,
+body.highlightjs-dark .hljs-pragma,
+body.highlightjs-dark .hljs-built_in,
+body.highlightjs-dark .hljs-literal,
+body.highlightjs-dark .hljs-params,
+body.highlightjs-dark .hljs-constant {
+ color: #de935f;
+}
+body.highlightjs-dark .ruby .hljs-class .hljs-title,
+body.highlightjs-dark .css .hljs-rule .hljs-attribute {
+ color: #f0c674;
+}
+body.highlightjs-dark .hljs-string,
+body.highlightjs-dark .hljs-value,
+body.highlightjs-dark .hljs-inheritance,
+body.highlightjs-dark .hljs-header,
+body.highlightjs-dark .hljs-name,
+body.highlightjs-dark .ruby .hljs-symbol,
+body.highlightjs-dark .xml .hljs-cdata {
+ color: #b5bd68;
+}
+body.highlightjs-dark .hljs-title,
+body.highlightjs-dark .css .hljs-hexcolor {
+ color: #8abeb7;
+}
+body.highlightjs-dark .hljs-function,
+body.highlightjs-dark .python .hljs-decorator,
+body.highlightjs-dark .python .hljs-title,
+body.highlightjs-dark .ruby .hljs-function .hljs-title,
+body.highlightjs-dark .ruby .hljs-title .hljs-keyword,
+body.highlightjs-dark .perl .hljs-sub,
+body.highlightjs-dark .javascript .hljs-title,
+body.highlightjs-dark .coffeescript .hljs-title {
+ color: #81a2be;
+}
+body.highlightjs-dark .hljs-keyword,
+body.highlightjs-dark .javascript .hljs-function {
+ color: #b294bb;
+}
+body.highlightjs-dark .hljs {
+ display: block;
+ overflow-x: auto;
+ background: #1d1f21;
+ color: #c5c8c6;
+ padding: 0.5em;
+ -webkit-text-size-adjust: none;
+}
+body.highlightjs-dark .coffeescript .javascript,
+body.highlightjs-dark .javascript .xml,
+body.highlightjs-dark .tex .hljs-formula,
+body.highlightjs-dark .xml .javascript,
+body.highlightjs-dark .xml .vbscript,
+body.highlightjs-dark .xml .css,
+body.highlightjs-dark .xml .hljs-cdata {
+ opacity: 0.5;
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+ filter: alpha(opacity=50);
+}
html,
body {
font-family: "Open Sans", sans-serif;
@@ -37,7 +196,7 @@ table thead td {
font-weight: 700;
}
.sidebar {
- position: fixed;
+ position: absolute;
left: 0;
top: 0;
bottom: 0;
@@ -99,6 +258,7 @@ table thead td {
}
.page-wrapper {
position: absolute;
+ overflow-y: auto;
left: 315px;
right: 0;
top: 0;
@@ -133,14 +293,7 @@ table thead td {
left: 0;
bottom: 0;
padding-right: 15px;
-}
-@media only screen and (max-width: 400px) {
- .page {
- /* Only prevent horizontal scrolling on screens with less than 100px for the content
- A better way would be to somehow prevent horizontal scrolling all the time, but this causes scrolling problems on iOS Safari.
- Also, would be better to only enable horizontal scrolling when it is needed (content does not fit on page) but I have no idea how to do that. */
- overflow-x: hidden;
- }
+ overflow-y: auto;
}
.content {
margin-left: auto;
@@ -157,6 +310,42 @@ table thead td {
.content img {
max-width: 100%;
}
+div.translation-indexes ul {
+ margin: 10px 0 0 0;
+ padding: 0;
+ text-align: center;
+ list-style-type: none;
+}
+div.translation-indexes ul li {
+ display: inline-block;
+ padding: 0.2em 0.5em;
+}
+div.translation-indexes ul li a {
+ text-decoration: none;
+}
+div.translation-indexes ul li a:hover {
+ text-decoration: underline;
+}
+div.translation-links {
+ float: left;
+ height: 50px;
+}
+div.translation-links ul {
+ margin: 10px 0 0 0;
+ padding: 0 0 0 1em;
+ text-align: left;
+ list-style-type: none;
+}
+div.translation-links ul li {
+ display: inline-block;
+ padding: 0.2em 0.5em;
+}
+div.translation-links ul li a {
+ text-decoration: none;
+}
+div.translation-links ul li a:hover {
+ text-decoration: underline;
+}
.menu-bar {
position: relative;
height: 50px;
@@ -181,18 +370,13 @@ table thead td {
.menu-bar .right-buttons {
float: right;
}
-.menu-title {
- display: inline-block;
+h1.menu-title {
+ float: left;
+ margin: 0 0 0 2em;
+ padding: 0;
font-weight: 200;
font-size: 20px;
line-height: 50px;
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- text-align: center;
- margin: 0;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
@@ -211,7 +395,7 @@ table thead td {
font-size: 2.5em;
text-align: center;
text-decoration: none;
- position: fixed;
+ position: absolute;
top: 50px /* Height of menu-bar */;
bottom: 0;
margin: 0;
@@ -250,13 +434,7 @@ table thead td {
.nav-chapters:hover {
text-decoration: none;
}
-.sidebar-hidden .previous {
- left: 0;
-}
-.sidebar-visible .nav-chapters .previous {
- left: 300px;
-}
-.sidebar-visible .mobile-nav-chapters .previous {
+.previous {
left: 0;
}
.next {
@@ -266,7 +444,6 @@ table thead td {
position: relative;
left: 10px;
z-index: 1000;
- -webkit-border-radius: 4px;
border-radius: 4px;
font-size: 0.7em;
}
@@ -303,7 +480,6 @@ table thead td {
position: relative;
display: inline-block;
margin-bottom: 50px;
- -webkit-border-radius: 5px;
border-radius: 5px;
}
.next {
@@ -406,7 +582,6 @@ table thead td {
display: inline-block;
vertical-align: middle;
padding: 0.1em 0.3em;
- -webkit-border-radius: 3px;
border-radius: 3px;
}
.light pre {
@@ -521,7 +696,6 @@ table thead td {
display: inline-block;
vertical-align: middle;
padding: 0.1em 0.3em;
- -webkit-border-radius: 3px;
border-radius: 3px;
}
.coal pre {
@@ -636,7 +810,6 @@ table thead td {
display: inline-block;
vertical-align: middle;
padding: 0.1em 0.3em;
- -webkit-border-radius: 3px;
border-radius: 3px;
}
.navy pre {
@@ -751,7 +924,6 @@ table thead td {
display: inline-block;
vertical-align: middle;
padding: 0.1em 0.3em;
- -webkit-border-radius: 3px;
border-radius: 3px;
}
.rust pre {
@@ -794,7 +966,6 @@ table thead td {
}
code {
background-color: #666;
- -webkit-border-radius: 5px;
border-radius: 5px;
/* Force background to be printed in Chrome */
-webkit-print-color-adjust: exact;