{%- block document -%}
<div class="sphinxsidebar">
<div class="sphinxsidebarwrapper">
- {# bootstrapify nav #}
- {{ toc|replace("<ul>", '<ul class="nav">') }}
+ {{ toctree(maxdepth=4, collapse=False, includehidden=True,
+ main_navbar=False, titles_only=False) }}
</div>
</div>
{{ super() }}
if toc is None:
return None
- if main_navbar:
- navbarify(toc[0])
+ navbarify(toc[0], main_navbar=main_navbar)
return toc
@monkey(StandaloneHTMLBuilder)
""" _get_local_toctree generates a documentation toctree for the local
document (?), called from handle_page
"""
- return old_local(self, *args, main_navbar=True, **kwargs)
+ # so can call toctree(main_navbar=False)
+ d = {'main_navbar': True}
+ d.update(kwargs)
+ return old_local(self, *args, **d)
# monkeypatch visit_table to remove border and add .table
HTMLTranslator.visit_table = visit_table
# copy data- attributes straight from source to dest
HTMLTranslator.starttag = starttag_data
-def navbarify(node):
+def navbarify(node, main_navbar=False):
# add classes to toplevel
- node['classes'].extend(['nav', 'navbar-nav', 'navbar-right'])
- for list_item in node.children:
- # bullet_list
- # list_item
- # compact_paragraph
- # reference
- # bullet_list
- # list_item
- # compact_paragraph
- # reference
- list_item['classes'].append('dropdown')
- # list_item.compact_paragraph.reference
- link = list_item.children[0].children[0]
- link['classes'].append('dropdown-toggle')
- link.attributes['data-toggle'] = 'dropdown'
- # list_item.bullet_list
- list_item.children[1]['classes'].append('dropdown-menu')
+ if not main_navbar:
+ navify([node])
+ else:
+ node['classes'].extend(['nav', 'navbar-nav', 'navbar-right'])
+ for list_item in node.children:
+ # bullet_list
+ # list_item
+ # compact_paragraph
+ # reference
+ # bullet_list
+ # list_item
+ # compact_paragraph
+ # reference
+ list_item['classes'].append('dropdown')
+ # list_item.compact_paragraph.reference
+ link = list_item.children[0].children[0]
+ link['classes'].append('dropdown-toggle')
+ link.attributes['data-toggle'] = 'dropdown'
+ # list_item.bullet_list
+ list_item.children[1]['classes'].append('dropdown-menu')
+def navify(nodes):
+ for node in nodes:
+ if node.tagname == 'bullet_list':
+ node['classes'].append('nav')
+ navify(node.children)
def visit_table(self, node):
"""
width: 25%;
}
}
-.sphinxsidebarwrapper {
- width: 100%;
-}
-@media (max-width: 767px) {
- .sphinxsidebarwrapper {
- display: none !important;
- }
-}
-@media (min-width: 768px) and (max-width: 991px) {
- .sphinxsidebarwrapper {
- display: none !important;
- }
-}
-@media print {
- .sphinxsidebarwrapper {
- display: none !important;
- }
-}
-.sphinxsidebarwrapper > .nav > li > a {
- display: none !important;
-}
-.sphinxsidebarwrapper > .nav .nav .nav .nav {
- display: none !important;
-}
.btn-outline {
color: #a24689;
background-color: transparent;
padding-left: 20px;
}
}
-/* First level of nav */
+/* Side navigation visibility changes */
+.sphinxsidebarwrapper > .nav .nav {
+ display: none;
+}
+.sphinxsidebarwrapper > .nav li.active > .nav,
+.sphinxsidebarwrapper > .nav li.current > .nav {
+ display: block;
+}
+/* Side navigation graphical styling */
+.sphinxsidebarwrapper {
+ width: 100%;
+ /* First level of nav */
+ /* All levels of nav */
+}
+@media (max-width: 767px) {
+ .sphinxsidebarwrapper {
+ display: none !important;
+ }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+ .sphinxsidebarwrapper {
+ display: none !important;
+ }
+}
+@media print {
+ .sphinxsidebarwrapper {
+ display: none !important;
+ }
+}
.sphinxsidebarwrapper > .nav {
margin-top: 20px;
margin-bottom: 20px;
}
-/* All levels of nav */
+.sphinxsidebarwrapper .nav > li > a {
+ font-size: 13px;
+ font-weight: bold;
+ padding-left: 20px;
+}
+.sphinxsidebarwrapper .nav .nav > li > a {
+ font-size: 12px;
+ padding-left: 25px;
+}
+.sphinxsidebarwrapper .nav .nav .nav > li > a {
+ font-weight: normal;
+ padding-left: 30px;
+}
+.sphinxsidebarwrapper .nav .nav .nav .nav > li > a {
+ font-size: 11px;
+ padding-left: 35px;
+}
.sphinxsidebarwrapper .nav > li > a {
display: block;
padding: 4px 20px;
- font-size: 13px;
- font-weight: 500;
color: #999;
}
.sphinxsidebarwrapper .nav > li > a:hover,
background-color: transparent;
border-left: 1px solid #a24689;
}
+.sphinxsidebarwrapper .nav > .current > a,
+.sphinxsidebarwrapper .nav > .current:hover > a,
+.sphinxsidebarwrapper .nav > .current:focus > a,
.sphinxsidebarwrapper .nav > .active > a,
.sphinxsidebarwrapper .nav > .active:hover > a,
.sphinxsidebarwrapper .nav > .active:focus > a {
background-color: transparent;
border-left: 2px solid #a24689;
}
-/* Nav: second level (shown on .active) */
+.sphinxsidebarwrapper .nav .nav > li > a:hover,
+.sphinxsidebarwrapper .nav .nav > li > a:focus {
+ padding-left: 24px;
+}
+.sphinxsidebarwrapper .nav .nav > .current > a,
+.sphinxsidebarwrapper .nav .nav > .current:hover > a,
+.sphinxsidebarwrapper .nav .nav > .current:focus > a,
+.sphinxsidebarwrapper .nav .nav > .active > a,
+.sphinxsidebarwrapper .nav .nav > .active:hover > a,
+.sphinxsidebarwrapper .nav .nav > .active:focus > a {
+ padding-left: 23px;
+}
.sphinxsidebarwrapper .nav .nav .nav {
- display: none;
- /* Hide by default, but at >768px, show it */
padding-bottom: 10px;
}
.sphinxsidebarwrapper .nav .nav .nav > li > a {
padding-top: 1px;
padding-bottom: 1px;
- padding-left: 30px;
- font-size: 12px;
- font-weight: normal;
}
.sphinxsidebarwrapper .nav .nav .nav > li > a:hover,
.sphinxsidebarwrapper .nav .nav .nav > li > a:focus {
.sphinxsidebarwrapper .nav .nav .nav > .active:hover > a,
.sphinxsidebarwrapper .nav .nav .nav > .active:focus > a {
padding-left: 28px;
- font-weight: 500;
+ font-weight: bold;
+}
+.sphinxsidebarwrapper .nav .nav .nav .nav > li > a:hover,
+.sphinxsidebarwrapper .nav .nav .nav .nav > li > a:focus {
+ padding-left: 34px;
+}
+.sphinxsidebarwrapper .nav .nav .nav .nav > .active > a,
+.sphinxsidebarwrapper .nav .nav .nav .nav > .active:hover > a,
+.sphinxsidebarwrapper .nav .nav .nav .nav > .active:focus > a {
+ padding-left: 33px;
}
/* Show and affix the side nav when space allows it */
@media (min-width: 992px) {
.make-md-column(3);
}
-.sphinxsidebarwrapper {
- width: 100%;
-
- .hidden-xs();
- .hidden-sm();
- .hidden-print();
-
- // hide level 0 (root title)
- > .nav > li > a {
- display: none !important;
- }
- // hide levels 3+
- > .nav .nav .nav .nav {
- display: none !important;
- }
-}
-
.btn-outline {
color: @brand-primary;
background-color: transparent;
}
}
-/* First level of nav */
-.sphinxsidebarwrapper > .nav {
- margin-top: 20px;
- margin-bottom: 20px;
+/* Side navigation visibility changes */
+.sphinxsidebarwrapper {
+ > .nav { // root (contains document categories), always show
+ .nav {
+ // hide sub-everything by default
+ display: none;
+ }
+
+ li.active > .nav,
+ li.current > .nav {
+ // sub-items of a current or active li are shown
+ display: block;
+ }
+ }
}
-/* All levels of nav */
-.sphinxsidebarwrapper .nav {
- > li > a {
- display: block;
- padding: 4px 20px;
- font-size: 13px;
- font-weight: 500;
- color: #999;
+/* Side navigation graphical styling */
+@nav-spacing: 20px;
+@nav-spacing-increment: 5px;
+@nav-hover-offset: 1px;
+@nav-hover: @nav-spacing - @nav-hover-offset;
+@nav-current-offset: 2px;
+@nav-current: @nav-spacing - @nav-current-offset;
- &:hover, &:focus {
- padding-left: 19px;
- color: @brand-primary;
- text-decoration: none;
- background-color: transparent;
- border-left: 1px solid @brand-primary;
- }
+.sphinxsidebarwrapper {
+ width: 100%;
+
+ .hidden-xs();
+ .hidden-sm();
+ .hidden-print();
+
+ /* First level of nav */
+ > .nav {
+ margin-top: 20px;
+ margin-bottom: 20px;
}
- > .active > a, > .active:hover > a, > .active:focus > a {
- padding-left: 18px;
+ .nav > li > a {
+ font-size: 13px;
font-weight: bold;
- color: @brand-primary;
- background-color: transparent;
- border-left: 2px solid @brand-primary;
+ padding-left: @nav-spacing;
}
-}
-
-/* Nav: second level (shown on .active) */
-.sphinxsidebarwrapper .nav .nav .nav {
- display: none; /* Hide by default, but at >768px, show it */
- padding-bottom: 10px;
-
- > li > a {
- padding-top: 1px;
- padding-bottom: 1px;
- padding-left: 30px;
+ .nav .nav > li > a {
font-size: 12px;
+ padding-left: @nav-spacing + @nav-spacing-increment;
+ }
+ .nav .nav .nav > li > a {
font-weight: normal;
+ padding-left: @nav-spacing + 2*@nav-spacing-increment;
+ }
+ .nav .nav .nav .nav > li > a {
+ font-size: 11px;
+ padding-left: @nav-spacing + 3*@nav-spacing-increment;
}
- > li > a:hover, > li > a:focus {
- padding-left: 29px;
+ /* All levels of nav */
+ .nav {
+ > li > a {
+ display: block;
+ padding: 4px @nav-spacing;
+ color: #999;
+
+ &:hover, &:focus {
+ padding-left: @nav-hover;
+ color: @brand-primary;
+ text-decoration: none;
+ background-color: transparent;
+ border-left: @nav-hover-offset solid @brand-primary;
+ }
+ }
+
+ // before scrollspy is applied, need to use current for docs
+ > .current > a, > .current:hover > a, > .current:focus > a,
+ > .active > a, > .active:hover > a, > .active:focus > a {
+ padding-left: @nav-current;
+ font-weight: bold;
+ color: @brand-primary;
+ background-color: transparent;
+ border-left: @nav-current-offset solid @brand-primary;
+ }
}
+ .nav .nav {
+ > li > a:hover, > li > a:focus {
+ padding-left: @nav-hover + @nav-spacing-increment;
+ }
+ > .current > a, > .current:hover > a, > .current:focus > a,
+ > .active > a, > .active:hover > a, > .active:focus > a {
+ padding-left: @nav-current + @nav-spacing-increment;
+ }
+ }
+ .nav .nav .nav {
+ padding-bottom: 10px;
- > .active > a, > .active:hover > a, > .active:focus > a {
- padding-left: 28px;
- font-weight: 500;
+ > li > a {
+ padding-top: 1px;
+ padding-bottom: 1px;
+ }
+
+ > li > a:hover, > li > a:focus {
+ padding-left: @nav-hover + 2 * @nav-spacing-increment;
+ }
+ > .active > a, > .active:hover > a, > .active:focus > a {
+ padding-left: @nav-current + 2 * @nav-spacing-increment;
+ font-weight: bold;
+ }
+ }
+ .nav .nav .nav .nav {
+ > li > a:hover, > li > a:focus {
+ padding-left: @nav-hover + 3 * @nav-spacing-increment;
+ }
+ > .active > a, > .active:hover > a, > .active:focus > a {
+ padding-left: @nav-current + 3 * @nav-spacing-increment;
+ }
}
}
.. TODO: replace or style
+.. hidden toctree w/o titlesonly otherwise the titlesonly "sticks" to
+ in-document toctrees and we can't have a toctree showing both "sibling"
+ pages and current document sections
+
.. toctree::
- :titlesonly:
+ :hidden:
tutorials
guides