Toc updates

.gitignore

@@ -1,3 +1,4 @@
 build
 dist
 mkdocs_cinder.egg-info/
+*.pyc

cinder/base.html

@@ -58,9 +58,28 @@
     ga('send', 'pageview');
     </script>
     {% endif %}
+
+    {# Figure out if we should collapse the ToC on this page or not #}
+    {% if 'collapse_toc' in meta %}
+      {% if meta.collapse_toc|first == 'true' %}
+        {% set collapse_toc = True %}
+      {% else %}
+        {% set collapse_toc = False %}
+      {% endif %}
+    {% elif 'collapse_toc' in config.extra %}
+      {% set collapse_toc = config.extra.collapse_toc %}
+    {% endif %}
+    {% if collapse_toc %}
+    <style>
+        /* Collapse ToC */
+        .bs-sidebar .nav .nav {
+            display: none;
+        }
+    </style>
+    {% endif %}
 </head>
 
-<body{% if current_page and current_page.is_homepage %} class="homepage" {% endif %}>
+<body{% if current_page and current_page.is_homepage %} class="homepage" {% endif %} data-spy="scroll" data-target=".bs-sidebar">
 
     {% include "nav.html" %}
 

cinder/css/base.css

@@ -9,14 +9,6 @@ h1[id]:before, h2[id]:before, h3[id]:before, h4[id]:before, h5[id]:before, h6[id
     height: 75px;
 }
 
-ul.nav li.first-level {
-    font-weight: bold;
-}
-
-ul.nav li.third-level {
-    padding-left: 12px;
-}
-
 div.col-md-3 {
     padding-left: 0;
 }
@@ -73,18 +65,38 @@ div.source-links {
     border-right: 1px solid;
 }
 
-/* Nav: second level (shown on .active) */
+/* Default show all ToC */
 .bs-sidebar .nav .nav {
-    display: none; /* Hide by default, but at >768px, show it */
-    margin-bottom: 8px;
+    display: block;
 }
+
 .bs-sidebar .nav .nav > li > a {
     padding-top:    3px;
     padding-bottom: 3px;
     padding-left: 30px;
     font-size: 90%;
 }
 
+/* Third level */
+.bs-sidebar .nav .nav .nav > li > a {
+    padding-left: 45px;
+}
+
+/* Fourth level */
+.bs-sidebar .nav .nav .nav .nav > li > a {
+    padding-left: 60px;
+}
+
+/* Fifth level */
+.bs-sidebar .nav .nav .nav .nav .nav > li > a {
+    padding-left: 75px;
+}
+
+/* Sixth level */
+.bs-sidebar .nav .nav .nav .nav .nav .nav > li > a {
+    padding-left: 90px;
+}
+
 /* Show and affix the side nav when space allows it */
 @media (min-width: 992px) {
     .bs-sidebar .nav > .active > ul {

cinder/css/highlight.css

@@ -1,5 +1,4 @@
 /*
-This is the GitHub theme for highlight.js
 
 github.com style (c) Vasily Polovnyov <vast@whiteants.net>
 
@@ -10,100 +9,75 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
   overflow-x: auto;
   padding: 0.5em;
   color: #333;
-  -webkit-text-size-adjust: none;
+  background: #f8f8f8;
 }
 
 .hljs-comment,
-.diff .hljs-header,
-.hljs-javadoc {
+.hljs-quote {
   color: #998;
   font-style: italic;
 }
 
 .hljs-keyword,
-.css .rule .hljs-keyword,
-.hljs-winutils,
-.nginx .hljs-title,
-.hljs-subst,
-.hljs-request,
-.hljs-status {
+.hljs-selector-tag,
+.hljs-subst {
   color: #333;
   font-weight: bold;
 }
 
 .hljs-number,
-.hljs-hexcolor,
-.ruby .hljs-constant {
+.hljs-literal,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-tag, .hljs-attr {
   color: #008080;
 }
 
 .hljs-string,
-.hljs-tag .hljs-value,
-.hljs-phpdoc,
-.hljs-dartdoc,
-.tex .hljs-formula {
+.hljs-doctag {
   color: #d14;
 }
 
 .hljs-title,
-.hljs-id,
-.scss .hljs-preprocessor {
+.hljs-section,
+.hljs-selector-id {
   color: #900;
   font-weight: bold;
 }
 
-.hljs-list .hljs-keyword,
 .hljs-subst {
   font-weight: normal;
 }
 
-.hljs-class .hljs-title,
 .hljs-type,
-.vhdl .hljs-literal,
-.tex .hljs-command {
+.hljs-class .hljs-title {
   color: #458;
   font-weight: bold;
 }
 
 .hljs-tag,
-.hljs-tag .hljs-title,
-.hljs-rule .hljs-property,
-.django .hljs-tag .hljs-keyword {
+.hljs-name,
+.hljs-attribute {
   color: #000080;
   font-weight: normal;
 }
 
-.hljs-attribute,
-.hljs-variable,
-.lisp .hljs-body,
-.hljs-name {
-  color: #008080;
-}
-
-.hljs-regexp {
+.hljs-regexp,
+.hljs-link {
   color: #009926;
 }
 
 .hljs-symbol,
-.ruby .hljs-symbol .hljs-string,
-.lisp .hljs-keyword,
-.clojure .hljs-keyword,
-.scheme .hljs-keyword,
-.tex .hljs-special,
-.hljs-prompt {
+.hljs-bullet {
   color: #990073;
 }
 
-.hljs-built_in {
+.hljs-built_in,
+.hljs-builtin-name {
   color: #0086b3;
 }
 
-.hljs-preprocessor,
-.hljs-pragma,
-.hljs-pi,
-.hljs-doctype,
-.hljs-shebang,
-.hljs-cdata {
+.hljs-meta {
   color: #999;
   font-weight: bold;
 }
@@ -116,10 +90,10 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
   background: #dfd;
 }
 
-.diff .hljs-change {
-  background: #0086b3;
+.hljs-emphasis {
+  font-style: italic;
 }
 
-.hljs-chunk {
-  color: #aaa;
+.hljs-strong {
+  font-weight: bold;
 }

cinder/js/base.js

@@ -5,16 +5,7 @@ $( document ).ready(function() {
     $('table').addClass('table table-striped table-hover');
 });
 
-
-$('body').scrollspy({
-    target: '.bs-sidebar',
-});
-
-
 /* Prevent disabled links from causing a page reload */
 $("li.disabled a").click(function() {
     event.preventDefault();
 });
-
-
-

cinder/toc.html

@@ -1,13 +1,52 @@
+{# Figure out how deep we go down the rabbit hole #}
+{% if 'toc_depth' in meta %}
+  {% set depth = meta.toc_depth|first|int %}
+{% elif 'toc_depth' in config.extra %}
+  {% set depth = config.extra.toc_depth %}
+{% else %}
+  {% set depth = 3 %}
+{% endif %}
 <div class="bs-sidebar hidden-print affix well" role="complementary">
     <ul class="nav bs-sidenav">
     {% for toc_item in toc %}
-        <li class="first-level {% if toc_item.active %}active{% endif %}"><a href="{{ toc_item.url }}">{{ toc_item.title }}</a></li>
-        {% for toc_item in toc_item.children %}
-            <li class="second-level"><a href="{{ toc_item.url }}">{{ toc_item.title }}</a></li>
-            {% for toc_item in toc_item.children %}
-                <li class="third-level"><a href="{{ toc_item.url }}">{{ toc_item.title }}</a></li>
+        <li class="{% if toc_item.active %}active{% endif %}">
+            <a href="{{ toc_item.url }}">{{ toc_item.title }}</a>
+            {% if depth >= 2 and toc_item.children|length > 0 %}<ul class="nav">
+                {% for toc_item in toc_item.children %}
+                    <li class="second-level">
+                        <a href="{{ toc_item.url }}">{{ toc_item.title }}</a>
+                        {% if depth >= 3 and toc_item.children|length > 0 %}<ul class="nav">
+                        {% for toc_item in toc_item.children %}
+                            <li class="third-level">
+                                <a href="{{ toc_item.url }}">{{ toc_item.title }}</a>
+                                {% if depth >= 4 and toc_item.children|length > 0 %}<ul class="nav">
+                                {% for toc_item in toc_item.children %}
+                                    <li class="fourth-level">
+                                        <a href="{{ toc_item.url }}">{{ toc_item.title }}</a>
+                                        {% if depth >= 5 and toc_item.children|length > 0 %}<ul class="nav">
+                                        {% for toc_item in toc_item.children %}
+                                            <li class="fifth-level">
+                                                <a href="{{ toc_item.url }}">{{ toc_item.title }}</a>
+                                                {% if depth >= 6 and toc_item.children|length > 0 %}<ul class="nav">
+                                                {% for toc_item in toc_item.children %}
+                                                    <li class="sixth-level">
+                                                        <a href="{{ toc_item.url }}">{{ toc_item.title }}</a>
+                                                    </li>
+                                                {% endfor %}
+                                                </ul>{% endif %}
+                                            </li>
+                                        {% endfor %}
+                                        </ul>{% endif %}
+                                    </li>
+                                {% endfor %}
+                                </ul>{% endif %}
+                            </li>
+                        {% endfor %}
+                        </ul>{% endif %}
+                    </li>
             {% endfor %}
-        {% endfor %}
+            </ul>{% endif %}
+        </li>
     {% endfor %}
     </ul>
 </div>