qdoc: Prepare QDoc for the new style on qt.io

The new template and CSS have some requirements that need changes
in the generated .html:

    - Generate a new div 'sidebar' and place the TOC (if one
      exists) inside it, allowing the template to extend the
      sidebar contents dynamically. Do this for all pages
      except index.html.

    - Change the DOCTYPE declaration to be html5-compliant

    - Replace <tt> tags with <code> to be html5-compliant

    - Add a new config variable HTML.prologue - this allows
      the template to insert custom html into beginning of
      the page, before the page title but after any navigation
      or table-of-contents items.

    - Wrap tables inside <div> elements. This allows for
      better-working CSS design for small-screen devices.

    - Write out extra parameters first when outputting
      function synopsis to have better styling.

    - Inject zero-width-space characters into function
      names to allow the browser break up long function
      signatures in a nice manner.

    - Edit the CSS for the offline style to adapt to
      above changes.

Task-number: QTBUG-42086
Change-Id: I3075cdc11bcb07a66150388519263fd721c8002b
Reviewed-by: Martin Smith <martin.smith@digia.com>

1 files changed, 17 insertions, 2 deletions

diff --git a/doc/global/template/style/offline.css b/doc/global/template/style/offline.css
index 126df9d806..dc0a6d1ec9 100644
--- a/doc/global/template/style/offline.css
+++ b/doc/global/template/style/offline.css
@@ -359,7 +359,9 @@ h3.fn, span.fn {
     margin: 0px;
     margin-top: 45px;
 }
-
+h3.fn code {
+    float: right;
+}
 h3.fn:target {
     background-color: #F6F6D6;
 }
@@ -705,8 +707,21 @@ Landing page
     float: left;
 }
 
-.icons1of3  h2 {
+.icons1of3 h2, .doc-column h2 {
     font-size: 15px;
     margin: 0px;
     padding: 0px;
 }
+
+div.multi-column {
+    position: relative;
+}
+
+div.multi-column div {
+    display: -moz-inline-box;
+    display: inline-block;
+    vertical-align: top;
+    margin-top: 1em;
+    margin-right: 4em;
+    width: 24em;
+}