Fix for TOC "click/expand" & "scroll position" problem on mobile.

Fixes:

 - Click/expand
 - Scroll pos.
 - TOC table scroll-down arrow.
 - TOC title scrolls to top.

Docker-DCO-1.1-Signed-off-by: O.S. Tezer <ostezer@gmail.com> (github: ostezer)

docs/theme/mkdocs/css/base.css

@@ -40,6 +40,7 @@ h6,
   /* Desktop click-to-scroll margin/padding fixes */
   padding-top: 2em !important;
   margin-top: -2em !important;
+  pointer-events:none;
 }
 #content h3 {
   padding: 0.7em 0em 0.3em 0em;
@@ -354,11 +355,16 @@ h6,
   font-weight: bold;
   color: #0e6b8d;
 }
+#toc_table > h2 > a > b {
+  display: none;
+  border-top-color: #0e6b8d !important;
+}
 #toc_table > h3 {
   font-size: 1em;
   color: #0e6b8d;
 }
 #toc_table > #toc_navigation {
+  display: block;
   margin-top: 1.5em !important;
   background: #fff;
   border-bottom: 3px solid #ddd;
@@ -572,6 +578,9 @@ ol.breadcrumb > li:last-child > a {
     margin-bottom: 0.3em;
     font-size: 2em;
   }
+  #toc_table > h2 > a > b {
+    display: inline-block;
+  }
   #toc_table > h3 {
     display: block;
     margin: 0;
@@ -590,13 +599,6 @@ ol.breadcrumb > li:last-child > a {
     display: none;
   }
 
-  /* Mobile click-to-scroll margin/padding fixes */
-  #content h2 {
-    padding: 0.5em 0em 0.3em 0em;
-    padding-top: 13.5em !important;
-    margin-top: -13.5em !important;
-  }
-
 }
 
 /* Container responsiveness fixes to maximise realestate expenditure */

docs/theme/mkdocs/js/base.js

@@ -30,13 +30,13 @@ $(document).ready(function ()
   });
 
   /* Toggle TOC view for Mobile */
-  $('#toc_table').on('click', function ()
+  $('#toc_table > h2').on('click', function ()
   {
     if ( $(window).width() <= 991 )
     {
       $('#toc_table > #toc_navigation').slideToggle();
     }
-  })
+  });
 
   /* Follow TOC links (ScrollSpy) */
   $('body').scrollspy({
@@ -61,6 +61,9 @@ function checkToScrollTOC ()
 {
   if ( $(window).width() >= 768 )
   {
+    // If TOC is hidden, expand.
+    $('#toc_table > #toc_navigation').css("display", "block");
+    // Then attach or detach fixed-scroll
     if ( ($('#toc_table').height() + 100) >= $(window).height() )
     {
       $('#toc_table').trigger('detach.ScrollToFixed');

docs/theme/mkdocs/toc.html

@@ -1,6 +1,6 @@
 <div id="toc_table" class="bs-sidebar hidden-print" role="complementary">
 {% if current_page.title != '**HIDDEN**' %}
-  <h2>{{ current_page.title }}</h2>
+  <h2><a href="#">{{ current_page.title }} <b class="caret"></b></a></h2>
 {% endif %}
   <h3>TABLE OF CONTENTS</h3>
   <ul id="toc_navigation" class="nav bs-sidenav">