Manual: Tweak HTML version for smaller screens

diff --git a/Docs/Manual/Shared/css/all.css b/Docs/Manual/Shared/css/all.css
index 5be1518..b10c156 100644 (file)
--- a/Docs/Manual/Shared/css/all.css
+++ b/Docs/Manual/Shared/css/all.css
@@ -1,7 +1,6 @@
 body {
   margin: 0;
   padding: 0;
-  min-width: 40em;
   font-family: Calibri,Helvetica,Arial,sans-serif;
 }
 
@@ -104,6 +103,12 @@ div.section h4 {
   margin-top: 10px;
 }
 
+/* Responsive Image */
+.mediaobject img {
+  max-width: 100%;
+  height: auto;
+}
+
 .screen {
   padding: 5px;
   background-color: #eee;
@@ -235,3 +240,21 @@ div.toc p {
 div.toc a:visited, div.toc a:link {
   text-decoration: none;
 }
+
+/* media queries */
+@media (max-width: 30em) {
+  div.section {
+    margin: 0;
+  }
+  .variablelist dl {
+    margin-left: 0;
+  }
+  .variablelist dd {
+    margin-left: .5em;
+  }
+  .caution, .important, .note, .tip, .warning {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    padding: 0 .5em;
+  }
+}

diff --git a/Docs/Manual/Shared/xsl/html.xsl b/Docs/Manual/Shared/xsl/html.xsl
index b07d29d..6187e86 100644 (file)
--- a/Docs/Manual/Shared/xsl/html.xsl
+++ b/Docs/Manual/Shared/xsl/html.xsl
@@ -41,6 +41,7 @@ html/docbook.xsl
     <xsl:copy-of select="$title"/>
   </title>
 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
   <meta name="generator" content="DocBook {$DistroTitle} V{$VERSION}"/>
 </xsl:template>