html: avoid horizontal overflows, break-word and limit image width

[pve-docs.git] / asciidoc / pve-html.conf

diff --git a/asciidoc/pve-html.conf b/asciidoc/pve-html.conf
index 575ecae224d9d076698112d8da5a393a77f028c3..c64d2c45d8d56a13b5fb62536eb29833c5e3fdbb 100644 (file)
--- a/asciidoc/pve-html.conf
+++ b/asciidoc/pve-html.conf
@@ -302,9 +302,12 @@ endif::deprecated-quotes[]
 # Paragraph substitution.
 [paragraph]
 <div class="paragraph{role? {role}}{unbreakable-option? unbreakable}"{id? id="{id}"}>
-{thumbnail#}<a class="image" href="images/screenshot/{thumbnail}">
-{thumbnail#}<img src="images/screenshot/{thumbnail}" alt="{alt={thumbnail}}" width=250 style="float:{float=right};">
-{thumbnail#}</a>
+{thumbnail#}<a class="image" href="images/{thumbnail}">
+{thumbnail#}<img src="images/{thumbnail}" alt="{alt={thumbnail}}" width=250
+{thumbnail#}{float@left: style="padding\: 0 10px 0 0;float\:left;"}
+{thumbnail#}{float@right: style="padding\: 0 0 0 10px;float\:right;"}
+{thumbnail#}{float%} style="padding: 0 0 0 10px;float:right;"
+{thumbnail#}></a>
 {title?<div class="title">{title}</div>}<p>
 |
 </p></div>
@@ -581,6 +584,50 @@ endif::toc2[]
 include1::{stylesheet}[]
 </style>
 endif::linkcss[]
+
+ifdef::toc2[]
+<style type="text/css">
+div #toc {
+    width: 19em;
+    font-family: sans;
+    border-right: 3px solid gainsboro;
+}
+.book, .article {
+    margin-left: 22em
+}
+div #toc a:link, div #toc a:visited {
+    color: black;
+    text-decoration: none;
+}
+div #toc a:hover {
+    text-decoration: underline;
+}
+div .toclevel1 {
+    font-size: 1.1em;
+    margin-bottom: 0.3em;
+}
+
+.monospaced, code, pre {
+    overflow-wrap: break-word;
+}
+img {
+    max-width: 100%;
+}
+
+@media only screen and (min-width: 85em) {
+div #toc {
+    width: 22em
+}
+.book, .article {
+    margin-left: 25em
+}
+div .toclevel1 {
+    font-size: 1.2em;
+}
+}
+</style>
+endif::toc2[]
+
 ifndef::disable-javascript[]
 ifdef::linkcss[]
 <script type="text/javascript" src="{scriptsdir=.}/asciidoc.js"></script>