Merge branch 'master' into Blendify/fix-1108

This was fixed before releasing 0.5.2,
but looks like the change was lost after merging it to master.

MANIFEST.in

@@ -1,6 +1,7 @@
 include *.txt
 include babel.cfg
 include LICENSE
+include bin/preinstall.js
 recursive-include sphinx_rtd_theme *.conf
 recursive-include sphinx_rtd_theme *.css
 recursive-include sphinx_rtd_theme *.eot

bin/preinstall.js

@@ -0,0 +1,20 @@
+#!/usr/bin/env node
+
+const package = require('../package.json');
+
+// Sorry everyone, this is the closest we can get to commenting on package.json
+// dependencies :(
+if (package.devDependencies['bourbon-neat'] !== '~1.9') {
+    // Wyrm is not compatible with Neat 2.0+, and Neat 1.9 at least pins a
+    // node-sass version that doesn't require Python 2. The changes to Wyrm to
+    // support Neat 2.0+ are all fairly minor changes, but it deeply affects the
+    // grid system and might be more of a liability than an old release of Neat.
+    // See: https://github.com/readthedocs/sphinx_rtd_theme/pull/771
+    console.error(
+        'bourbon-neat 1.9 is required, Wyrm is not compatible with Neat 2.0+.'
+    );
+    console.error(
+        'The expected selector for the bourbon-neat dependency in package.json is "~1.9".'
+    );
+    process.exit(1);
+}

docs/changelog.rst

@@ -5,6 +5,50 @@ Changelog
 master
 ======
 
+v1.0.0
+======
+
+Incompatible Changes
+--------------------
+
+* The minimum supported python version is now 2.7 or 3.4 and greater (#1093)
+* The minimum supported Sphinx version is now 1.6 (#1091)
+
+Deprecated
+----------
+
+* Support for sphinx's html4 writer is deprecated and will be removed in version 2.0 (#1091)
+
+Other Changes
+-------------
+
+* Update npm development dependencies (#1096)
+* Don't require npm to build from source (#1039)
+* Use regular toctree instead of toc for singlehtml builder (#507)
+* Templates: Cleanup Whitespace (#1060)
+
+Fixes
+-----
+
+* Javascript: Add support for deep toc levels (#1089)
+* Use Proper Sass Syntax (#1069)
+* Nav: Fix right padding on level2+ (#1068)
+* Fix Nav Buttons Size (#1067)
+* Fix: wrap inline literals (#1050)
+* Fix aria label (#1056)
+* Respect tab order for prev/next buttons (#1051)
+* Nav: Don't toggle terminal nodes (#1049)
+
+v0.5.2
+======
+
+:Date: April 5, 2021
+
+.. note:: This commit will not be in ``master``, but was branched directly off ``0.5.1`` to minimize issues.
+          The next full release will contain all PR's previously merged.
+
+* Depend on docutils < 0.17 (#1113)
+
 v0.5.1
 ======
 

docs/conf.py

@@ -41,7 +41,7 @@ pygments_style = 'default'
 
 intersphinx_mapping = {
     'rtd': ('https://docs.readthedocs.io/en/stable/', None),
-    'sphinx': ('https://www.sphinx-doc.org/en/stable/', None),
+    'sphinx': ('https://www.sphinx-doc.org/en/master/', None),
 }
 
 html_theme = 'sphinx_rtd_theme'

docs/contributing.rst

@@ -59,6 +59,7 @@ can be used to test built assets:
 .. _Webpack: https://webpack.js.org/
 .. _node-sass: https://github.com/sass/node-sass
 .. _SASS: http://www.sass-lang.com
+.. _Wyrm: http://www.github.com/snide/wyrm/
 .. _Sphinx: http://www.sphinx-doc.org/en/stable/
 
 Translations

docs/demo/lists_tables.rst

@@ -226,7 +226,7 @@ Hlists
 ------
 
 .. hlist::
-    :columns: 2
+    :columns: 3
 
     - First item
     - Second item
@@ -234,6 +234,18 @@ Hlists
     - Forth item
     - Fifth item
     - Sixths item
+    - First item
+    - Second item
+    - Third item
+    - Forth item
+    - Fifth item
+    - Sixths item
+    - First item
+    - Second item
+    - Third item
+    - Forth item
+    - Fifth item
+    - Sixths item
 
 .. rubric:: Hlist with images
 

package.json

@@ -1,10 +1,11 @@
 {
   "name": "sphinx_rtd_theme",
   "main": "js/theme.js",
-  "version": "0.5.1",
+  "version": "0.5.2",
   "scripts": {
     "dev": "webpack-dev-server --open --config webpack.dev.js",
-    "build": "webpack --config webpack.prod.js"
+    "build": "webpack --config webpack.prod.js",
+    "preinstall": "bin/preinstall.js"
   },
   "repository": {
     "type": "git",
@@ -18,26 +19,28 @@
   "homepage": "https://github.com/readthedocs/sphinx_rtd_theme",
   "dependencies": {},
   "devDependencies": {
-    "bootstrap": "^4.6.0",
-    "copy-webpack-plugin": "^5.1.1",
-    "css-loader": "^3.1.0",
+    "bourbon": "~4.3",
+    "bourbon-neat": "~1.9",
+    "copy-webpack-plugin": "^5.1.2",
+    "css-loader": "^3.6.0",
     "file-loader": "^3.0.1",
     "font-awesome": "^4.7.0",
+    "html5shiv": "^3.7.3",
     "imports-loader": "^0.8.0",
-    "jquery": "^3.4.1",
+    "jquery": "^3.6.0",
     "lato-font": "^3.0.0",
     "mini-css-extract-plugin": "^0.6.0",
-    "optimize-css-assets-webpack-plugin": "^5.0.3",
-    "popper.js": "^1.16.1",
+    "node-sass": "^4.13.1",
+    "optimize-css-assets-webpack-plugin": "^5.0.4",
     "roboto-fontface": "^0.10.0",
-    "sass": "^1.32.8",
     "sass-loader": "^7.3.0",
     "style-loader": "^0.23.1",
-    "webpack": "^4.30.0",
-    "webpack-cli": "^3.3.1",
-    "webpack-dev-server": "^3.3.1",
+    "webpack": "^4.46.0",
+    "webpack-cli": "^3.3.12",
+    "webpack-dev-server": "^3.11.2",
     "webpack-merge": "^4.2.1",
     "webpack-shell-plugin": "^0.5.0",
-    "webpack-watch-files-plugin": "^1.0.3"
+    "webpack-watch-files-plugin": "^1.1.0",
+    "wyrm": "^1.0.9"
   }
 }

setup.py

@@ -87,7 +87,7 @@ class TransifexCommand(distutils.cmd.Command):
 
 setup(
     name='sphinx_rtd_theme',
-    version='0.5.1',
+    version='0.5.2',
     url='https://github.com/readthedocs/sphinx_rtd_theme',
     license='MIT',
     author='Dave Snider, Read the Docs, Inc. & contributors',
@@ -117,7 +117,8 @@ setup(
         ]
     },
     install_requires=[
-        'sphinx>=1.6'
+        'sphinx>=1.6',
+        'docutils<0.17', # https://github.com/sphinx-doc/sphinx/issues/9001
     ],
     tests_require=[
         'pytest',

sphinx_rtd_theme/__init__.py

@@ -5,8 +5,9 @@ From https://github.com/ryan-roemer/sphinx-bootstrap-theme.
 """
 
 from os import path
+from sys import version_info as python_version
 
-from sphinx import version_info
+from sphinx import version_info as sphinx_version
 from sphinx.locale import _
 from sphinx.util.logging import getLogger
 
@@ -33,8 +34,11 @@ def config_initiated(app, config):
 
 # See http://www.sphinx-doc.org/en/stable/theming.html#distribute-your-theme-as-a-python-package
 def setup(app):
+    if python_version[0] < 3:
+        logger.warning("Python 2 is deprecated with sphinx_rtd_theme, update to Python 3")
     app.require_sphinx('1.6')
-    if version_info <= (2, 0, 0):
+    if sphinx_version <= (2, 0, 0):
+        logger.warning("Sphinx 1.x is deprecated with sphinx_rtd_theme, update to Sphinx 2.x or greater")
         if not app.config.html_experimental_html5_writer:
             logger.warning("'html4_writer' is deprecated with sphinx_rtd_theme")
     else:
@@ -44,7 +48,7 @@ def setup(app):
     # Register the theme that can be referenced without adding a theme path
     app.add_html_theme('sphinx_rtd_theme', path.abspath(path.dirname(__file__)))
 
-    if version_info >= (1, 8, 0):
+    if sphinx_version >= (1, 8, 0):
         # Add Sphinx message catalog for newer versions of Sphinx
         # See http://www.sphinx-doc.org/en/master/extdev/appapi.html#sphinx.application.Sphinx.add_message_catalog
         rtd_locale_path = path.join(path.abspath(path.dirname(__file__)), 'locale')

sphinx_rtd_theme/breadcrumbs.html

@@ -1,11 +1,3 @@
-{#- Support for Sphinx 1.3+ page_source_suffix, but don't break old builds. #}
-
-{%- if page_source_suffix %}
-   {%- set suffix = page_source_suffix %}
-{%- else %}
-   {%- set suffix = source_suffix %}
-{%- endif %}
-
 {%- if meta is defined and meta is not none %}
    {%- set check_meta = True %}
 {%- else %}
@@ -27,56 +19,55 @@
 {%- set display_vcs_links = display_vcs_links if display_vcs_links is defined else True %}
 
 <div role="navigation" aria-label="{{ _('Breadcrumbs') }}">
-
-  <ol class="breadcrumb">
+  <ul class="wy-breadcrumbs">
     {%- block breadcrumbs %}
-      <li class="breadcrumb-item"><a href="{{ pathto(master_doc) }}" class="icon icon-home"></a></li>
-      {%- for doc in parents %}
-        <li class="breadcrumb-item"><a href="{{ doc.link|e }}">{{ doc.title }}</a></li>
-      {%- endfor %}
-      <li class="breadcrumb-item active">{{ title }}</li>
+      <li><a href="{{ pathto(master_doc) }}" class="icon icon-home"></a> &raquo;</li>
+        {%- for doc in parents %}
+          <li><a href="{{ doc.link|e }}">{{ doc.title }}</a> &raquo;</li>
+        {%- endfor %}
+      <li>{{ title }}</li>
     {%- endblock %}
     {%- block breadcrumbs_aside %}
-      <li class="breadcrumb-aside">
+      <li class="wy-breadcrumbs-aside">
         {%- if hasdoc(pagename) and display_vcs_links %}
           {%- if display_github %}
             {%- if check_meta and 'github_url' in meta %}
               <!-- User defined GitHub URL -->
               <a href="{{ meta['github_url'] }}" class="fa fa-github"> {{ _('Edit on GitHub') }}</a>
             {%- else %}
-              <a href="https://{{ github_host|default("github.com") }}/{{ github_user }}/{{ github_repo }}/{{ theme_vcs_pageview_mode or "blob" }}/{{ github_version }}{{ conf_py_path }}{{ pagename }}{{ suffix }}" class="fa fa-github"> {{ _('Edit on GitHub') }}</a>
+              <a href="https://{{ github_host|default("github.com") }}/{{ github_user }}/{{ github_repo }}/{{ theme_vcs_pageview_mode or "blob" }}/{{ github_version }}{{ conf_py_path }}{{ pagename }}{{ page_source_suffix }}" class="fa fa-github"> {{ _('Edit on GitHub') }}</a>
             {%- endif %}
           {%- elif display_bitbucket %}
             {%- if check_meta and 'bitbucket_url' in meta %}
               <!-- User defined Bitbucket URL -->
               <a href="{{ meta['bitbucket_url'] }}" class="fa fa-bitbucket"> {{ _('Edit on Bitbucket') }}</a>
             {%- else %}
-              <a href="https://bitbucket.org/{{ bitbucket_user }}/{{ bitbucket_repo }}/src/{{ bitbucket_version}}{{ conf_py_path }}{{ pagename }}{{ suffix }}?mode={{ theme_vcs_pageview_mode or "view" }}" class="fa fa-bitbucket"> {{ _('Edit on Bitbucket') }}</a>
+              <a href="https://bitbucket.org/{{ bitbucket_user }}/{{ bitbucket_repo }}/src/{{ bitbucket_version}}{{ conf_py_path }}{{ pagename }}{{ page_source_suffix }}?mode={{ theme_vcs_pageview_mode or "view" }}" class="fa fa-bitbucket"> {{ _('Edit on Bitbucket') }}</a>
             {%- endif %}
           {%- elif display_gitlab %}
             {%- if check_meta and 'gitlab_url' in meta %}
               <!-- User defined GitLab URL -->
               <a href="{{ meta['gitlab_url'] }}" class="fa fa-gitlab"> {{ _('Edit on GitLab') }}</a>
             {%- else %}
-              <a href="https://{{ gitlab_host|default("gitlab.com") }}/{{ gitlab_user }}/{{ gitlab_repo }}/{{ theme_vcs_pageview_mode or "blob" }}/{{ gitlab_version }}{{ conf_py_path }}{{ pagename }}{{ suffix }}" class="fa fa-gitlab"> {{ _('Edit on GitLab') }}</a>
+              <a href="https://{{ gitlab_host|default("gitlab.com") }}/{{ gitlab_user }}/{{ gitlab_repo }}/{{ theme_vcs_pageview_mode or "blob" }}/{{ gitlab_version }}{{ conf_py_path }}{{ pagename }}{{ page_source_suffix }}" class="fa fa-gitlab"> {{ _('Edit on GitLab') }}</a>
             {%- endif %}
           {%- elif show_source and source_url_prefix %}
-            <a href="{{ source_url_prefix }}{{ pagename }}{{ suffix }}">{{ _('View page source') }}</a>
+            <a href="{{ source_url_prefix }}{{ pagename }}{{ page_source_suffix }}">{{ _('View page source') }}</a>
           {%- elif show_source and has_source and sourcename %}
             <a href="{{ pathto('_sources/' + sourcename, true)|e }}" rel="nofollow"> {{ _('View page source') }}</a>
           {%- endif %}
         {%- endif %}
       </li>
     {%- endblock %}
-  </ol>
+  </ul>
 
   {%- if (theme_prev_next_buttons_location == 'top' or theme_prev_next_buttons_location == 'both') and (next or prev) %}
   <div class="rst-breadcrumbs-buttons" role="navigation" aria-label="{{ _('Breadcrumbs') }}">
       {%- if prev %}
-        <a href="{{ prev.link|e }}" class="btn btn-light float-left" title="{{ prev.title|striptags|e }}" accesskey="p"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> {{ _('Previous') }}</a>
+        <a href="{{ prev.link|e }}" class="btn btn-neutral float-left" title="{{ prev.title|striptags|e }}" accesskey="p"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> {{ _('Previous') }}</a>
       {%- endif %}
       {%- if next %}
-        <a href="{{ next.link|e }}" class="btn btn-light float-right" title="{{ next.title|striptags|e }}" accesskey="n">{{ _('Next') }} <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
+        <a href="{{ next.link|e }}" class="btn btn-neutral float-right" title="{{ next.title|striptags|e }}" accesskey="n">{{ _('Next') }} <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
       {%- endif %}
   </div>
   {%- endif %}

sphinx_rtd_theme/footer.html

@@ -2,10 +2,10 @@
   {%- if (theme_prev_next_buttons_location == 'bottom' or theme_prev_next_buttons_location == 'both') and (next or prev) %}
     <div class="rst-footer-buttons" role="navigation" aria-label="{{ _('Footer') }}">
       {%- if prev %}
-        <a href="{{ prev.link|e }}" class="btn btn-light float-left" title="{{ prev.title|striptags|e }}" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> {{ _('Previous') }}</a>
+        <a href="{{ prev.link|e }}" class="btn btn-neutral float-left" title="{{ prev.title|striptags|e }}" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> {{ _('Previous') }}</a>
       {%- endif %}
       {%- if next %}
-        <a href="{{ next.link|e }}" class="btn btn-light float-right" title="{{ next.title|striptags|e }}" accesskey="n" rel="next">{{ _('Next') }} <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
+        <a href="{{ next.link|e }}" class="btn btn-neutral float-right" title="{{ next.title|striptags|e }}" accesskey="n" rel="next">{{ _('Next') }} <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
       {%- endif %}
     </div>
   {%- endif %}

sphinx_rtd_theme/layout.html

@@ -6,10 +6,11 @@
 {%- else %}
   {%- set titlesuffix = "" %}
 {%- endif %}
-{%- set lang_attr = 'en' if language == None else (language | replace('_', '-')) -%}
+{%- set lang_attr = 'en' if language == None else (language | replace('_', '-')) %}
+{%- set sphinx_writer = 'writer-html5' if html5_doctype else 'writer-html4' -%}
 
 <!DOCTYPE html>
-<html lang="{{ lang_attr }}" >
+<html class="{{ sphinx_writer }}" lang="{{ lang_attr }}" >
 <head>
   <meta charset="utf-8" />
   {{- metatags }}
@@ -50,6 +51,9 @@
 
   {#- JAVASCRIPTS #}
   {%- block scripts %}
+  <!--[if lt IE 9]>
+    <script src="{{ pathto('_static/js/html5shiv.min.js', 1) }}"></script>
+  <![endif]-->
   {%- if not embedded %}
   {# XXX Sphinx 1.8.0 made this an external js-file, quick fix until we refactor the template to inherert more blocks directly from sphinx #}
     {%- if sphinx_version >= "1.8.0" -%}
@@ -107,23 +111,22 @@
   {%- block extrahead %} {% endblock %}
 </head>
 
-<body>
+<body class="wy-body-for-nav">
+
   {%- block extrabody %} {% endblock %}
-
-  <div class="d-flex" id="wrapper">
-
-    <!-- Sidebar -->
-    <div class="sidebar-right" id="sidebar-wrapper">
-      <div class="sidebar-scroll">
-        <div class="sidebar-heading">
+  <div class="wy-grid-for-nav">
+    {#- SIDE NAV, TOGGLES ON MOBILE #}
+    <nav data-toggle="wy-nav-shift" class="wy-nav-side">
+      <div class="wy-side-scroll">
+        <div class="wy-side-nav-search" {% if theme_style_nav_header_background %} style="background: {{theme_style_nav_header_background}}" {% endif %}>
           {%- block sidebartitle %}
- 
+
           {%- if logo and theme_logo_only %}
             <a href="{{ pathto(master_doc) }}">
           {%- else %}
             <a href="{{ pathto(master_doc) }}" class="icon icon-home"> {{ project }}
           {%- endif %}
- 
+
           {%- if logo %}
             {#- Not strictly valid HTML, but it's the only way to display/scale
                 it properly, without weird scripting or heaps of work
@@ -131,7 +134,7 @@
             <img src="{{ pathto('_static/' + logo, 1) }}" class="logo" alt="{{ _('Logo') }}"/>
           {%- endif %}
           </a>
- 
+
           {%- if theme_display_version %}
             {%- set nav_version = version %}
             {%- if READTHEDOCS and current_version %}
@@ -143,14 +146,14 @@
               </div>
             {%- endif %}
           {%- endif %}
- 
+
           {%- include "searchbox.html" %}
- 
+
           {%- endblock %}
         </div>
 
         {%- block navigation %}
-        <div class="sidebar-navigation" data-spy="affix" role="navigation" aria-label="{{ _('Main') }}">
+        <div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="{{ _('Main') }}">
           {%- block menu %}
             {%- set toctree = toctree(maxdepth=theme_navigation_depth|int,
                                       collapse=theme_collapse_navigation|tobool,
@@ -163,49 +166,48 @@
               <div class="local-toc">{{ toc }}</div>
             {%- endif %}
           {%- endblock %}
-       </div>
-       {%- endblock %}
+        </div>
+        {%- endblock %}
       </div>
-    </div>
-    <!-- /#sidebar-wrapper -->
+    </nav>
 
-    <!-- Page Content -->
-   <div class="page-content-wrapper">
-      <nav class="wy-nav-top navbar navbar-expand-lg navbar-light bg-light border-bottom" aria-label="{{ _('Top') }}">
+    <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap">
+
+      {#- MOBILE NAV, TRIGGLES SIDE NAV ON TOGGLE #}
+      <nav class="wy-nav-top" aria-label="{{ _('Top') }}">
         {%- block mobile_nav %}
-           <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-           <a href="{{ pathto(master_doc) }}">{{ project }}</a>
+          <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
+          <a href="{{ pathto(master_doc) }}">{{ project }}</a>
         {%- endblock %}
       </nav>
 
-      <div class="container-fluid">
-         {%- block content %}
-           {%- if theme_style_external_links|tobool %}
-           <div class="rst-content style-external-links">
-           {%- else %}
-           <div class="rst-content">
-           {%- endif %}
-             {% include "breadcrumbs.html" %}
-             <div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
-             {%- block document %}
-              <div itemprop="articleBody">
-               {% block body %}{% endblock %}
-              </div>
-              {%- if self.comments()|trim %}
-              <div class="articleComments">
-               {%- block comments %}{% endblock %}
-              </div>
-              {%- endif%}
-             </div>
-             {%- endblock %}
-             {%- include "footer.html" %}
+      <div class="wy-nav-content">
+      {%- block content %}
+        {%- if theme_style_external_links|tobool %}
+        <div class="rst-content style-external-links">
+        {%- else %}
+        <div class="rst-content">
+        {%- endif %}
+          {% include "breadcrumbs.html" %}
+          <div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
+          {%- block document %}
+           <div itemprop="articleBody">
+             {% block body %}{% endblock %}
            </div>
-         {%- endblock %}
+           {%- if self.comments()|trim %}
+             <div class="articleComments">
+               {%- block comments %}{% endblock %}
+             </div>
+           {%- endif%}
+          </div>
+          {%- endblock %}
+          {% include "footer.html" %}
+        </div>
+      {%- endblock %}
       </div>
-    </div>
-    <!-- /#page-content-wrapper -->
+    </section>
   </div>
-  {%- include "versions.html" -%}
+  {% include "versions.html" -%}
 
   <script type="text/javascript">
       jQuery(function () {

sphinx_rtd_theme/searchbox.html

@@ -1,7 +1,7 @@
 {%- if 'singlehtml' not in builder %}
-<div class="form-outline" role="search">
-  <form id="rtd-search-form" action="{{ pathto('search') }}" method="get">
-    <input type="search" name="q" class="form-control" placeholder="{{ _('Search docs') }}" />
+<div role="search">
+  <form id="rtd-search-form" class="wy-form" action="{{ pathto('search') }}" method="get">
+    <input type="text" name="q" placeholder="{{ _('Search docs') }}" />
     <input type="hidden" name="check_keywords" value="yes" />
     <input type="hidden" name="area" value="default" />
   </form>

sphinx_rtd_theme/static/css/theme.css

@@ -1,4 +1,4 @@
 html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}[hidden],audio:not([controls]){display:none}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}blockquote{margin:0}dfn{font-style:italic}ins{background:#ff9;text-decoration:none}ins,mark{color:#000}mark{background:#ff0;font-style:italic;font-weight:700}.rst-content code,.rst-content tt,code,kbd,pre,samp{font-family:monospace,serif;_font-family:courier new,monospace;font-size:1em}pre{white-space:pre}q{quotes:none}q:after,q:before{content:"";content:none}small{font-size:85%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}dl,ol,ul{margin:0;padding:0;list-style:none;list-style-image:none}li{list-style:none}dd{margin:0}img{border:0;-ms-interpolation-mode:bicubic;vertical-align:middle;max-width:100%}svg:not(:root){overflow:hidden}figure,form{margin:0}label{cursor:pointer}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button;*overflow:visible}button[disabled],input[disabled]{cursor:default}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}textarea{resize:vertical}table{border-collapse:collapse;border-spacing:0}td{vertical-align:top}.chromeframe{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}.ir{display:block;border:0;text-indent:-999em;overflow:hidden;background-color:transparent;background-repeat:no-repeat;text-align:left;direction:ltr;*line-height:0}.ir br{display:none}.hidden{display:none!important;visibility:hidden}.visuallyhidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}.invisible{visibility:hidden}.relative{position:relative}big,small{font-size:100%}@media print{body,html,section{background:none!important}*{box-shadow:none!important;text-shadow:none!important;filter:none!important;-ms-filter:none!important}a,a:visited{text-decoration:underline}.ir a:after,a[href^="#"]:after,a[href^="javascript:"]:after{content:""}blockquote,pre{page-break-inside:avoid}thead{display:table-header-group}img,tr{page-break-inside:avoid}img{max-width:100%!important}@page{margin:.5cm}.rst-content .toctree-wrapper>p.caption,h2,h3,p{orphans:3;widows:3}.rst-content .toctree-wrapper>p.caption,h2,h3{page-break-after:avoid}}.btn,.fa:before,.icon:before,.rst-content .admonition,.rst-content .admonition-title:before,.rst-content .admonition-todo,.rst-content .attention,.rst-content .caution,.rst-content .code-block-caption .headerlink:before,.rst-content .danger,.rst-content .error,.rst-content .hint,.rst-content .important,.rst-content .note,.rst-content .seealso,.rst-content .tip,.rst-content .warning,.rst-content code.download span:first-child:before,.rst-content dl dt .headerlink:before,.rst-content h1 .headerlink:before,.rst-content h2 .headerlink:before,.rst-content h3 .headerlink:before,.rst-content h4 .headerlink:before,.rst-content h5 .headerlink:before,.rst-content h6 .headerlink:before,.rst-content p.caption .headerlink:before,.rst-content table>caption .headerlink:before,.rst-content tt.download span:first-child:before,.wy-alert,.wy-dropdown .caret:before,.wy-inline-validate.wy-inline-validate-danger .wy-input-context:before,.wy-inline-validate.wy-inline-validate-info .wy-input-context:before,.wy-inline-validate.wy-inline-validate-success .wy-input-context:before,.wy-inline-validate.wy-inline-validate-warning .wy-input-context:before,.wy-menu-vertical li.current>a,.wy-menu-vertical li.current>a span.toctree-expand:before,.wy-menu-vertical li.on a,.wy-menu-vertical li.on a span.toctree-expand:before,.wy-menu-vertical li span.toctree-expand:before,.wy-nav-top a,.wy-side-nav-search .wy-dropdown>a,.wy-side-nav-search>a,input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{-webkit-font-smoothing:antialiased}.clearfix{*zoom:1}.clearfix:after,.clearfix:before{display:table;content:""}.clearfix:after{clear:both}/*!
  *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
  *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
- */@font-face{font-family:FontAwesome;src:url(fonts/fontawesome-webfont.eot?674f50d287a8c48dc19ba404d20fe713);src:url(fonts/fontawesome-webfont.eot?674f50d287a8c48dc19ba404d20fe713?#iefix&v=4.7.0) format("embedded-opentype"),url(fonts/fontawesome-webfont.woff2?af7ae505a9eed503f8b8e6982036873e) format("woff2"),url(fonts/fontawesome-webfont.woff?fee66e712a8a08eef5805a46892932ad) format("woff"),url(fonts/fontawesome-webfont.ttf?b06871f281fee6b241d60582ae9369b9) format("truetype"),url(fonts/fontawesome-webfont.svg?912ec66d7572ff821749319396470bde#fontawesomeregular) format("svg");font-weight:400;font-style:normal}.fa,.icon,.rst-content .admonition-title,.rst-content .code-block-caption .headerlink,.rst-content code.download span:first-child,.rst-content dl dt .headerlink,.rst-content h1 .headerlink,.rst-content h2 .headerlink,.rst-content h3 .headerlink,.rst-content h4 .headerlink,.rst-content h5 .headerlink,.rst-content h6 .headerlink,.rst-content p.caption .headerlink,.rst-content table>caption .headerlink,.rst-content tt.download span:first-child,.wy-menu-vertical li.current>a span.toctree-expand,.wy-menu-vertical li.on a span.toctree-expand,.wy-menu-vertical li span.toctree-expand{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14286em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14286em;width:2.14286em;top:.14286em;text-align:center}.fa-li.fa-lg{left:-1.85714em}.fa-border{padding:.2em .25em .15em;border:.08em solid #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa-pull-left.icon,.fa.fa-pull-left,.rst-content .code-block-caption .fa-pull-left.headerlink,.rst-content .fa-pull-left.admonition-title,.rst-content code.download span.fa-pull-left:first-child,.rst-content dl dt .fa-pull-left.headerlink,.rst-content h1 .fa-pull-left.headerlink,.rst-content h2 .fa-pull-left.headerlink,.rst-content h3 .fa-pull-left.headerlink,.rst-content h4 .fa-pull-left.headerlink,.rst-content h5 .fa-pull-left.headerlink,.rst-content h6 .fa-pull-left.headerlink,.rst-content p.caption .fa-pull-left.headerlink,.rst-content table>caption .fa-pull-left.headerlink,.rst-content tt.download span.fa-pull-left:first-child,.wy-menu-vertical li.current>a span.fa-pull-left.toctree-expand,.wy-menu-vertical li.on a span.fa-pull-left.toctree-expand,.wy-menu-vertical li span.fa-pull-left.toctree-expand{margin-right:.3em}.fa-pull-right.icon,.fa.fa-pull-right,.rst-content .code-block-caption .fa-pull-right.headerlink,.rst-content .fa-pull-right.admonition-title,.rst-content code.download span.fa-pull-right:first-child,.rst-content dl dt .fa-pull-right.headerlink,.rst-content h1 .fa-pull-right.headerlink,.rst-content h2 .fa-pull-right.headerlink,.rst-content h3 .fa-pull-right.headerlink,.rst-content h4 .fa-pull-right.headerlink,.rst-content h5 .fa-pull-right.headerlink,.rst-content h6 .fa-pull-right.headerlink,.rst-content p.caption .fa-pull-right.headerlink,.rst-content table>caption .fa-pull-right.headerlink,.rst-content tt.download span.fa-pull-right:first-child,.wy-menu-vertical li.current>a span.fa-pull-right.toctree-expand,.wy-menu-vertical li.on a span.fa-pull-right.toctree-expand,.wy-menu-vertical li span.fa-pull-right.toctree-expand{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left,.pull-left.icon,.rst-content .code-block-caption .pull-left.headerlink,.rst-content .pull-left.admonition-title,.rst-content code.download span.pull-left:first-child,.rst-content dl dt .pull-left.headerlink,.rst-content h1 .pull-left.headerlink,.rst-content h2 .pull-left.headerlink,.rst-content h3 .pull-left.headerlink,.rst-content h4 .pull-left.headerlink,.rst-content h5 .pull-left.headerlink,.rst-content h6 .pull-left.headerlink,.rst-content p.caption .pull-left.headerlink,.rst-content table>caption .pull-left.headerlink,.rst-content tt.download span.pull-left:first-child,.wy-menu-vertical li.current>a span.pull-left.toctree-expand,.wy-menu-vertical li.on a span.pull-left.toctree-expand,.wy-menu-vertical li span.pull-left.toctree-expand{margin-right:.3em}.fa.pull-right,.pull-right.icon,.rst-content .code-block-caption .pull-right.headerlink,.rst-content .pull-right.admonition-title,.rst-content code.download span.pull-right:first-child,.rst-content dl dt .pull-right.headerlink,.rst-content h1 .pull-right.headerlink,.rst-content h2 .pull-right.headerlink,.rst-content h3 .pull-right.headerlink,.rst-content h4 .pull-right.headerlink,.rst-content h5 .pull-right.headerlink,.rst-content h6 .pull-right.headerlink,.rst-content p.caption .pull-right.headerlink,.rst-content table>caption .pull-right.headerlink,.rst-content tt.downloadLine truncated
+ */@font-face{font-family:FontAwesome;src:url(fonts/fontawesome-webfont.eot?674f50d287a8c48dc19ba404d20fe713);src:url(fonts/fontawesome-webfont.eot?674f50d287a8c48dc19ba404d20fe713?#iefix&v=4.7.0) format("embedded-opentype"),url(fonts/fontawesome-webfont.woff2?af7ae505a9eed503f8b8e6982036873e) format("woff2"),url(fonts/fontawesome-webfont.woff?fee66e712a8a08eef5805a46892932ad) format("woff"),url(fonts/fontawesome-webfont.ttf?b06871f281fee6b241d60582ae9369b9) format("truetype"),url(fonts/fontawesome-webfont.svg?912ec66d7572ff821749319396470bde#fontawesomeregular) format("svg");font-weight:400;font-style:normal}.fa,.icon,.rst-content .admonition-title,.rst-content .code-block-caption .headerlink,.rst-content code.download span:first-child,.rst-content dl dt .headerlink,.rst-content h1 .headerlink,.rst-content h2 .headerlink,.rst-content h3 .headerlink,.rst-content h4 .headerlink,.rst-content h5 .headerlink,.rst-content h6 .headerlink,.rst-content p.caption .headerlink,.rst-content table>caption .headerlink,.rst-content tt.download span:first-child,.wy-menu-vertical li.current>a span.toctree-expand,.wy-menu-vertical li.on a span.toctree-expand,.wy-menu-vertical li span.toctree-expand{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14286em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14286em;width:2.14286em;top:.14286em;text-align:center}.fa-li.fa-lg{left:-1.85714em}.fa-border{padding:.2em .25em .15em;border:.08em solid #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa-pull-left.icon,.fa.fa-pull-left,.rst-content .code-block-caption .fa-pull-left.headerlink,.rst-content .fa-pull-left.admonition-title,.rst-content code.download span.fa-pull-left:first-child,.rst-content dl dt .fa-pull-left.headerlink,.rst-content h1 .fa-pull-left.headerlink,.rst-content h2 .fa-pull-left.headerlink,.rst-content h3 .fa-pull-left.headerlink,.rst-content h4 .fa-pull-left.headerlink,.rst-content h5 .fa-pull-left.headerlink,.rst-content h6 .fa-pull-left.headerlink,.rst-content p.caption .fa-pull-left.headerlink,.rst-content table>caption .fa-pull-left.headerlink,.rst-content tt.download span.fa-pull-left:first-child,.wy-menu-vertical li.current>a span.fa-pull-left.toctree-expand,.wy-menu-vertical li.on a span.fa-pull-left.toctree-expand,.wy-menu-vertical li span.fa-pull-left.toctree-expand{margin-right:.3em}.fa-pull-right.icon,.fa.fa-pull-right,.rst-content .code-block-caption .fa-pull-right.headerlink,.rst-content .fa-pull-right.admonition-title,.rst-content code.download span.fa-pull-right:first-child,.rst-content dl dt .fa-pull-right.headerlink,.rst-content h1 .fa-pull-right.headerlink,.rst-content h2 .fa-pull-right.headerlink,.rst-content h3 .fa-pull-right.headerlink,.rst-content h4 .fa-pull-right.headerlink,.rst-content h5 .fa-pull-right.headerlink,.rst-content h6 .fa-pull-right.headerlink,.rst-content p.caption .fa-pull-right.headerlink,.rst-content table>caption .fa-pull-right.headerlink,.rst-content tt.download span.fa-pull-right:first-child,.wy-menu-vertical li.current>a span.fa-pull-right.toctree-expand,.wy-menu-vertical li.on a span.fa-pull-right.toctree-expand,.wy-menu-vertical li span.fa-pull-right.toctree-expand{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left,.pull-left.icon,.rst-content .code-block-caption .pull-left.headerlink,.rst-content .pull-left.admonition-title,.rst-content code.download span.pull-left:first-child,.rst-content dl dt .pull-left.headerlink,.rst-content h1 .pull-left.headerlink,.rst-content h2 .pull-left.headerlink,.rst-content h3 .pull-left.headerlink,.rst-content h4 .pull-left.headerlink,.rst-content h5 .pull-left.headerlink,.rst-content h6 .pull-left.headerlink,.rst-content p.caption .pull-left.headerlink,.rst-content table>caption .pull-left.headerlink,.rst-content tt.download span.pull-left:first-child,.wy-menu-vertical li.current>a span.pull-left.toctree-expand,.wy-menu-vertical li.on a span.pull-left.toctree-expand,.wy-menu-vertical li span.pull-left.toctree-expand{margin-right:.3em}.fa.pull-right,.pull-right.icon,.rst-content .code-block-caption .pull-right.headerlink,.rst-content .pull-right.admonition-title,.rst-content code.download span.pull-right:first-child,.rst-content dl dt .pull-right.headerlink,.rst-content h1 .pull-right.headerlink,.rst-content h2 .pull-right.headerlink,.rst-content h3 .pull-right.headerlink,.rst-content h4 .pull-right.headerlink,.rst-content h5 .pull-right.headerlink,.rst-content h6 .pull-right.headerlink,.rst-content p.caption .pull-right.headerlink,.rst-content table>caption .pull-right.headerlink,.rst-content tt.downloadLine truncated

src/sass/_theme_badge.sass

@@ -4,23 +4,23 @@
   left: 0
   width: $nav-desktop-width
   color: $section-background-color
-  background: darken($nav-background-color, 8%)
-  font-family: $font-family-base
-  z-index: $zindex-popover
+  background: darken($menu-background-color, 8%)
+  font-family: $base-font-family
+  z-index: $z-index-tray
   a
     color: $link_color
     text-decoration: none
   .rst-badge-small
     display: none
   .rst-current-version
-    padding: $line-height-base / 2
-    background-color: darken($nav-background-color, 5%)
+    padding: $base-line-height / 2
+    background-color: darken($menu-background-color, 5%)
     display: block
     text-align: right
     font-size: 90%
     cursor: pointer
     color: $green
-    @include clearfix
+    +clearfix
     .fa
       color: $section-background-color
     .fa-book
@@ -41,7 +41,7 @@
     display: block
   .rst-other-versions
     font-size: 90%
-    padding: $line-height-base / 2
+    padding: $base-line-height / 2
     color: $text-medium
     display: none
     hr
@@ -50,13 +50,13 @@
       border: 0
       margin: 20px 0
       padding: 0
-      border-top: solid 1px lighten($nav-background-color, 5%)
+      border-top: solid 1px lighten($menu-background-color, 5%)
     dd
       display: inline-block
       margin: 0
       a
         display: inline-block
-        padding: $line-height-base / 4
+        padding: $base-line-height / 4
         color: $section-background-color
   &.rst-badge
     width: auto
@@ -82,11 +82,11 @@
       width: auto
       height: 30px
       line-height: 30px
-      padding: 0 $line-height-base / 4
+      padding: 0 $base-line-height / 4
       display: block
       text-align: center
 
-@media (max-width: $nav-media-query)
++media($tablet)
   .rst-versions
     width: 85%
     display: none

src/sass/_theme_badge_fa.sass

@@ -1,5 +1,7 @@
 // Slimmer version of FA for use on the badge_only.sass file.
 
++font-face(FontAwesome, '#{$fa-font-path}/fontawesome-webfont')
+
 .fa:before
   display: inline-block
   font-family: FontAwesome
@@ -7,6 +9,7 @@
   font-weight: normal
   line-height: 1
   text-decoration: inherit
+  +font-smooth
 
 a .fa
   display: inline-block

src/sass/_theme_breadcrumbs.sass

@@ -1,14 +1,34 @@
-.breadcrumb
-   padding-left: 0px
-   background-color: inherit
+.wy-breadcrumbs
+  +clearfix
 
-.breadcrumb-aside
-   margin-left: auto
+.wy-breadcrumbs li
+  display: inline-block
+  &.wy-breadcrumbs-aside
+    float: right
+  a
+    display: inline-block
+    padding: 5px
+    &:first-child
+      padding-left: 0
+  code
+    padding: 5px
+    border: none
+    background: none
+    &.literal
+      color: $text-color
+.wy-breadcrumbs-extra
+  margin-bottom: 0
+  color: $text-light
+  font-size: 80%
+  display: inline-block
 
-@include media-breakpoint-down(sm)
-  .breadcrumb li.breadcrumb-aside
+
++media($mobile)
+  .wy-breadcrumbs-extra
+    display: none
+  .wy-breadcrumbs li.wy-breadcrumbs-aside
     display: none
 
 @media print
-  .breadcrumb li.breadcrumb-aside
+  .wy-breadcrumbs li.wy-breadcrumbs-aside
     display: none

src/sass/_theme_layout.sass

@@ -1,41 +1,41 @@
 // Set uniform (but not relative) base font size
-body
-  font-family: $font-family-base
-  font-size: $font-size-base
+html
+  font-size: $base-font-size
 
-h1, h2, h3, h4, h5, h6
-   font-family: $font-family-headings
-   font-weight: 700
-   margin-bottom: $line-height-base
-
-h1
-  font-size: 175%
-h2
-  font-size: 150%
-h3
-  font-size: 125%
-h4
-  font-size: 115%
-h5
-  font-size: 110%
-h6
-  font-size: 100%
-
-ol, ul
-  padding-left: 0px
-
-.sidebar-navigation
-  width: $nav-desktop-width
+.wy-affix
+  position: fixed
+  top: $gutter
 
+.wy-menu
   a:hover
     text-decoration: none
 
+.wy-menu-horiz
+  +clearfix
+  ul, li
+    display: inline-block
+  li:hover
+    background: rgba(255,255,255,.1)
+  li
+    &.divide-left
+      border-left: solid 1px hsl(0, 0%, 25%)
+    &.divide-right
+      border-right: solid 1px hsl(0, 0%, 25%)
+  a
+    height: $base-font-size * 2
+    display: inline-block
+    line-height: $base-font-size * 2
+    padding: 0 $base-font-size
+
+.wy-menu-vertical
+  width: $nav-desktop-width
+
   header, p.caption
     color: $nav-caption
-    height: $font-size-base * 2
-    line-height: $font-size-base * 2
+    height: $base-font-size * 2
+    line-height: $base-font-size * 2
     padding: 0 $gutter
-    margin: $line-height-base / 2 0 0 0
+    margin: $base-line-height / 2 0 0 0
     display: block
     font-weight: bold
     text-transform: uppercase
@@ -50,13 +50,13 @@ ol, ul
     &.divide-bottom
       border-bottom: solid 1px hsl(0, 0%, 25%)
     &.current
-      background: darken($nav-menu-background-color, 10%)
+      background: darken($menu-vertical-background-color, 10%)
       a
         color: $menu-link-medium
-        border-right: solid 1px darken($nav-menu-background-color, 20%)
+        border-right: solid 1px darken($menu-vertical-background-color, 20%)
         padding: $gutter / 4 $gutter * 1.5
         &:hover
-          background: darken($nav-menu-background-color, 15%)
+          background: darken($menu-vertical-background-color, 15%)
     code
       border: none
       background: inherit
@@ -79,11 +79,12 @@ ol, ul
     padding: $gutter / 4 $gutter
     font-weight: bold
     position: relative
-    background: $nav-menu-background-color
+    background: $menu-vertical-background-color
     border: none
     padding-left: $gutter -4px
+    +font-smooth
     &:hover
-      background: $nav-menu-background-color
+      background: $menu-vertical-background-color
       span.toctree-expand
         color: $menu-link-medium
     span.toctree-expand
@@ -94,8 +95,8 @@ ol, ul
       color: darken($menu-link-medium, 30%)
 
   li.toctree-l1.current > a
-    border-bottom: solid 1px darken($nav-menu-background-color, 20%)
-    border-top: solid 1px darken($nav-menu-background-color, 20%)
+    border-bottom: solid 1px darken($menu-vertical-background-color, 20%)
+    border-top: solid 1px darken($menu-vertical-background-color, 20%)
 
   // This is the on state for pages beyond second level
 
@@ -142,19 +143,19 @@ ol, ul
   li.toctree-l2
     &.current
       > a
-        background: darken($nav-menu-background-color, 20%)
+        background: darken($menu-vertical-background-color, 20%)
       li.toctree-l3 > a
-        background: darken($nav-menu-background-color, 20%)
+        background: darken($menu-vertical-background-color, 20%)
     span.toctree-expand
-      color: darken($nav-menu-background-color, 35%)
+      color: darken($menu-vertical-background-color, 35%)
   li.toctree-l3
     &.current
       > a
-        background: darken($nav-menu-background-color, 25%)
+        background: darken($menu-vertical-background-color, 25%)
       li.toctree-l4 > a
-        background: darken($nav-menu-background-color, 25%)
+        background: darken($menu-vertical-background-color, 25%)
     span.toctree-expand
-      color: darken($nav-menu-background-color, 40%)
+      color: darken($menu-vertical-background-color, 40%)
 
   li.current ul
     display: block
@@ -173,23 +174,23 @@ ol, ul
     font-size: 90%
     color: $menu-link-light
     &:hover
-      background-color: lighten($nav-background-color, 10%)
+      background-color: lighten($menu-background-color, 10%)
       cursor: pointer
       span.toctree-expand
         color: $menu-link-light
     &:active
-      background-color: $nav-search-background-color
+      background-color: $menu-logo-color
       cursor: pointer
       color: $menu-link-active
       span.toctree-expand
         color: $menu-link-active
 
-.sidebar-heading
+.wy-side-nav-search
   display: block
   width: $nav-desktop-width
   padding: $gutter / 2
   margin-bottom: $gutter / 2
-  z-index: $zindex-fixed
+  z-index: $z-index-popover
   background-color: $nav-search-background-color
   text-align: center
   color: $nav-search-color
@@ -203,16 +204,17 @@ ol, ul
     margin: auto auto $gutter / 2 auto
     height: 45px
     width: 45px
-    background-color: $nav-search-background-color
+    background-color: $menu-logo-color
     padding: 5px
     border-radius: 100%
-  > a
+  > a, .wy-dropdown > a
     color: $nav-search-color
     font-size: 100%
     font-weight: bold
     display: inline-block
-    padding: $line-height-base / 6 $line-height-base / 4
+    padding: $base-line-height / 6 $base-line-height / 4
     margin-bottom: $gutter / 2
+    +font-smooth
     &:hover
       background: rgba(255,255,255,.1)
     img.logo
@@ -232,6 +234,15 @@ ol, ul
     font-weight: normal
     color: rgba(255,255,255,.3)
 
+.wy-nav .wy-menu-vertical
+  header
+    color: $link-color
+  a
+    color: $text-light
+    &:hover
+      background-color: $link-color
+      color: $white
+
 [data-menu-wrap]
   +transition(all .2s ease-in)
   position: absolute
@@ -251,10 +262,15 @@ ol, ul
     left: auto
     opacity: 0
 
-.d-flex
+.wy-body-for-nav
   background: $section-background-color
 
-.sidebar-right
+.wy-grid-for-nav
+  position: absolute
+  width: 100%
+  height: 100%
+
+.wy-nav-side
   position: fixed
   top: 0
   bottom: 0
@@ -264,11 +280,11 @@ ol, ul
   overflow-x: hidden
   overflow-y: hidden
   min-height: 100%
+  color: $menu-medium
   background: $nav-background-color
-  z-index: $zindex-fixed
+  z-index: $z-index-popover
 
-.sidebar-scroll
-  padding-bottom: $gutter / 2
+.wy-side-scroll
   width: $nav-desktop-width + 20px
   position: relative
   overflow-x: hidden
@@ -284,15 +300,16 @@ ol, ul
   line-height: 50px
   text-align: center
   font-size: 100%
-  @include clearfix
+  +clearfix
   a
     color: $white
     font-weight: bold
+    +font-smooth
   img
-    margin-right: $line-height-base / 2
+    margin-right: $base-line-height / 2
     height: 45px
     width: 45px
-    background-color: $nav-search-background-color
+    background-color: $menu-logo-color
     padding: 5px
     border-radius: 100%
   i
@@ -301,63 +318,72 @@ ol, ul
     cursor: pointer
     padding-top: inherit
 
-.page-content-wrapper
+.wy-nav-content-wrap
   margin-left: $nav-desktop-width
-  background: $content-background-color
+  background: $section-background-color
   min-height: 100%
 
-.container-fluid
+.wy-nav-content
   padding: $gutter $gutter * 2
   height: 100%
   max-width: $nav-content-width
   margin: auto
 
+.wy-body-mask
+  position: fixed
+  width: 100%
+  height: 100%
+  background: rgba(0,0,0,.2)
+  display: none
+  z-index: $z-index-modal - 1
+  &.on
+    display: block
 footer
   color: $footer-color
   p
-    margin-bottom: $line-height-base / 2
+    margin-bottom: $base-line-height / 2
   span.commit code
     padding: 0px
-    font-family: $font-family-code
+    font-family: $code-font-family
     font-size: 1em
     background: none
     border: none
     color: $footer-color
 
 .rst-footer-buttons
-  @include clearfix
   &:before, &:after
     width: 100%
+  +clearfix
 
 .rst-breadcrumbs-buttons
-  @include clearfix
   margin-top: 12px
+  +clearfix
 
 #search-results
   .search li
-    margin-bottom: $line-height-base
+    margin-bottom: $base-line-height
     border-bottom: solid 1px $table_border_color
-    padding-bottom: $line-height-base
+    padding-bottom: $base-line-height
   .search li:first-child
     border-top: solid 1px $table_border_color
-    padding-top: $line-height-base
+    padding-top: $base-line-height
   .search li a
     font-size: 120%
-    margin-bottom: $line-height-base / 2
+    margin-bottom: $base-line-height / 2
     display: inline-block
   .context
     color: $text-medium
     font-size: 90%
 
 .genindextable li > ul
-  margin-left: $line-height-base
+  margin-left: $base-line-height
 
-@media (max-width: $nav-media-query)
-  .d-flex
++media($tablet)
+  .wy-body-for-nav
     background: $section-background-color
   .wy-nav-top
     display: block
-  .sidebar-right
+  .wy-nav-side
     @if $nav-desktop-position == left
       left: -$nav-desktop-width
     @else
@@ -365,15 +391,15 @@ footer
     &.shift
       width: 85%
       left: 0
-  .sidebar-scroll
+  .wy-side-scroll
     width: auto
-  .sidebar-heading
+  .wy-side-nav-search
     width: auto
-  .sidebar-navigation
+  .wy-menu.wy-menu-vertical
     width: auto
-  .page-content-wrapper
+  .wy-nav-content-wrap
     margin-left: 0
-    .container-fluid
+    .wy-nav-content
       padding: $gutter
     &.shift
       position: fixed
@@ -384,14 +410,14 @@ footer
       overflow: hidden
 
 @media screen and (min-width: $nav-media-query)
-  .page-content-wrapper
+  .wy-nav-content-wrap
     background: rgba(0,0,0,.05)
-  .container-fluid
+  .wy-nav-content
     margin: 0
-    background: $content-background-color
+    background: $section-background-color
 
 @media print
-  .rst-versions, footer, .sidebar-right
+  .rst-versions, footer, .wy-nav-side
     display: none
-  .page-content-wrapper
+  .wy-nav-content-wrap
     margin-left: 0

src/sass/_theme_rst.sass

@@ -7,8 +7,9 @@
 //        * That said, know that I'm very unlikely to accept PRs from wyrm just to change style here.
 //    2. I plan to remove the !importants in here. Part of it is due to lazyness, part to sphinx's fondness for nesting.
 //    3. Try to use variables from wyrm_core/wy_variables.sass. Notable are...
-//        * $line-height-base // All margins, padding and line-height should use this in .25 increments.
+//        * $base-line-height // All margins, padding and line-height should use this in .25 increments.
 //        * $text-color, $text-light, $text-dark...etc
+//        * $base-font-family, $custom-font-family, $code-font-family
 //    4. If you have changes for mobile/tablet, put them at the bottom of the sass file.
 // --------------------------------------------------------------------------------------------------------------------
 
@@ -19,7 +20,7 @@
     height: auto
 
   div.figure
-    margin-bottom: $line-height-base
+    margin-bottom: $base-line-height
     p.caption
       font-style: italic
     p:last-child.caption
@@ -30,7 +31,7 @@
 
   // Usually it's a good idea to give images some space.
   .section > img,   .section > a > img
-    margin-bottom: $line-height-base
+    margin-bottom: $base-line-height
 
   // normalize browser styling
   abbr[title]
@@ -48,24 +49,22 @@
   // For the most part, its safe to assume that sphinx wants you to use a blockquote as an indent. It gets
   // used in many different ways, so don't assume you can apply some fancy style, just leave it be.
   blockquote
-    @extend .blockquote
-    margin-left: $line-height-base
-    line-height: $line-height-base
-    margin-bottom: $line-height-base
-    font-size: $font-size-base
+    margin-left: $base-line-height
+    line-height: $base-line-height
+    margin-bottom: $base-line-height
 
   pre.literal-block
     white-space: pre
     margin: 0
-    padding: $line-height-base / 2 $line-height-base / 2
-    font-family: $font-family-code
+    padding: $base-line-height / 2 $base-line-height / 2
+    font-family: $code-font-family
     display: block
     overflow: auto
   pre.literal-block, div[class^='highlight']
-    border: 1px solid $gray-300
+    border: 1px solid $table-border-color
     overflow-x: auto
     // 1px hack otherwise border won't show. lame
-    margin: 1px 0 $line-height-base 0
+    margin: 1px 0 $base-line-height 0
     div[class^='highlight']
       padding: 0px
       border: none
@@ -74,33 +73,30 @@
   div[class^='highlight'] td.code
     width: 100%
   .linenodiv pre
-    border-right: solid 1px $gray-300
+    border-right: solid 1px lighten($table-border-color, 2%)
     margin: 0
-    padding: $line-height-base / 2 $line-height-base / 2
-    font-family: $font-family-code
+    padding: $base-line-height / 2 $base-line-height / 2
+    font-family: $code-font-family
     user-select: none
     pointer-events: none
   div[class^='highlight'] pre
     white-space: pre
     margin: 0
-    padding: $line-height-base / 2 $line-height-base / 2
+    padding: $base-line-height / 2 $base-line-height / 2
     display: block
     overflow: auto
     & .hll
       // Line emphasis spans full width
       display: block
-      margin: 0 -1 * $line-height-base / 2
-      padding: 0 $line-height-base / 2
+      margin: 0 -1 * $base-line-height / 2
+      padding: 0 $base-line-height / 2
   pre.literal-block, div[class^='highlight'] pre, .linenodiv pre
-    font-family: $font-family-code
+    font-family: $code-font-family
     font-size: 12px
     line-height: 1.4
   
-  .literal-block-wrapper
-    padding: 0px 
-
   // Do not allow selection of code block prompts
-  div.highlight .gp
+  div.highlight .gp 
     user-select: none
     pointer-events: none
 
@@ -117,27 +113,26 @@
 
   // These are the various note pullouts that sphinx applies
   .note, .attention, .caution, .danger, .error, .hint, .important, .tip, .warning, .seealso, .admonition-todo, .admonition
-    @extend .alert
-    color: $text-color
+    @extend .wy-alert
     // These block elements are unsuitable for having floating objects next
     // to them
     clear: both
     .last, > *:last-child
       margin-bottom: 0
   .admonition-title
-    // @extend .alert-heading
+    @extend .wy-alert-title
     @extend .fa
     @extend .fa-exclamation-circle
     &:before
       margin-right: 4px
   .note, .seealso
-    @extend .alert-info
+    @extend .wy-alert.wy-alert-info
   .hint, .tip, .important
-    @extend .alert-success
+    @extend .wy-alert.wy-alert-success
   .error, .danger
-    @extend .alert-danger
+    @extend .wy-alert.wy-alert-danger
   .warning, .caution, .attention, .admonition-todo
-    @extend .alert-warning
+    @extend .wy-alert.wy-alert-warning
   // Some people put tables in notes. Let's give them very basic support.
   .admonition table
     border-color: rgba(0,0,0,.1)
@@ -145,53 +140,27 @@
       background: transparent !important
       border-color: rgba(0,0,0,.1) !important
   .section ul, .toctree-wrapper ul
-     list-style: disc
-     line-height: $line-height-base
-     margin-bottom: $line-height-base
-     li
-       list-style: disc
-       margin-left: $line-height-base
-       p:last-child
-         margin-bottom: 0
-       ul
-         margin-bottom: 0
-       li
-         list-style: circle
-         li
-           list-style: square
-       ol li
-         list-style: decimal
+    @extend .wy-plain-list-disc
   .section ol.loweralpha, .section ol.loweralpha > li
     list-style: lower-alpha
   .section ol.upperalpha, .section ol.upperalpha > li
     list-style: upper-alpha
   .section ol, ol.arabic
-     list-style: decimal
-     line-height: $line-height-base
-     margin-bottom: $line-height-base
-     li
-       list-style: decimal
-       margin-left: $line-height-base
-       p:last-child
-         margin-bottom: 0
-       ul
-         margin-bottom: 0
-         li
-           list-style: disc
+    @extend .wy-plain-list-decimal
   // Complex bullet lists, they have more item margins than simple lists
   .section ol li, .section ul li
     > *
-      margin-top: $line-height-base / 2
-      margin-bottom: $line-height-base / 2
+      margin-top: $base-line-height / 2
+      margin-bottom: $base-line-height / 2
       &:first-child
         margin-top: 0rem
     > p
       &, &:last-child
-        margin-bottom: $line-height-base / 2
+        margin-bottom: $base-line-height / 2
       &:only-child, &:only-child:last-child
         margin-bottom: 0rem
     > ul, > ol
-      margin-bottom: $line-height-base / 2
+      margin-bottom: $base-line-height / 2
   // Simple lists, no item margins
   .section ol.simple li, .section ul.simple li
     > *
@@ -202,26 +171,24 @@
       margin-bottom: 0rem
   .line-block
     margin-left: 0px
-    margin-bottom: $line-height-base
-    line-height: $line-height-base
+    margin-bottom: $base-line-height
+    line-height: $base-line-height
   .line-block .line-block
-    margin-left: $line-height-base
+    margin-left: $base-line-height
     margin-bottom: 0px
 
   // Generics handling of headings and toc stuff.
   .topic-title
     font-weight: bold
-    margin-bottom: $line-height-base / 2
+    margin-bottom: $base-line-height / 2
   .toc-backref
     color: $text-color
-    &:hover
-      text-decoration-line: none
   .align-right
     float: right
-    margin: 0px 0px $line-height-base $line-height-base
+    margin: 0px 0px $base-line-height $base-line-height
   .align-left
     float: left
-    margin: 0px $line-height-base $line-height-base 0px
+    margin: 0px $base-line-height $base-line-height 0px
   .align-center
     margin: auto
     // Do not override display:table for tables
@@ -248,10 +215,33 @@
   .centered
     text-align: center
 
+  // Sidebar content. You'll see at the bottom of this file I change it in mobile.
+  .sidebar
+    float: right
+    width: 40%
+    display: block
+    margin: 0 0 $base-line-height $base-line-height
+    padding: $base-line-height
+    background: $sidebar-background-color
+    border: solid 1px $sidebar-border-color
+    // Sidebar content is usually less relevant, so adjust the margins and sizes.
+    p, ul, dl
+      font-size: 90%
+    .last, > *:last-child
+      margin-bottom: 0
+    .sidebar-title
+      display: block
+      font-family: $custom-font-family
+      font-weight: bold
+      background: $table-border-color
+      padding: $base-line-height / 4 $base-line-height / 2
+      margin: -$base-line-height
+      margin-bottom: $base-line-height
+      font-size: 100%
   // Sphinx can highlight searched text with ?highlighted=searchterm
   .highlighted
     background: $highlight-color
-    box-shadow: 0 0 0 $line-height-base / 12 $highlight-color
+    box-shadow: 0 0 0 $base-line-height / 12 $highlight-color
     display: inline
     font-weight: bold
 
@@ -263,85 +253,107 @@
     line-height: 0
     font-size: 90%
 
-  // Horizontal lists have multiple columns; use full width
   .hlist
     width: 100%
+    tr
+      display: -ms-flexbox
+      display: flex
+      flex-flow: row wrap
+    td
+      margin-right: auto
 
-  // Formate citation and footnotes as a table.
-  // We will use the fairly well supported css `grid` attribute
-  dl dt span.classifier
-    &:before
-      content: " : "
-  dl.footnote,
-  dl.field-list
-    display: grid
-    grid-template-columns: max-content auto
-    > dt
-      padding-left: 1rem
-      &:after
-        content: ":"
-    > dt, > dd
-      margin-bottom: 0rem
-  dl.footnote
-    font-size: .9rem
-    > dt
-      margin: 0rem .5rem .5rem 0rem
-      line-height: 1.2rem
-      word-break: break-all
-      font-weight: normal
-      > span.brackets
-        margin-right: .5rem
-        &:before
-          content: "["
+  // The html4 writer outputs the citation and footnotes as a table, and the
+  // html5 writer outputs these as a definition list. We will use the fairly
+  // well supported css `grid` attribute to make these back into a table
+  // HTML4 writer
+  html.writer-html4 &
+    table.docutils.citation, table.docutils.footnote
+      background: none
+      border: none
+      td, tr
+        border: none
+        background-color: transparent !important
+        white-space: normal
+      td.label
+        padding-left: 0
+        padding-right: 0
+        vertical-align: top
+  // HTML5 writer
+  html.writer-html5 &
+    dl dt span.classifier
+      &:before
+        content: " : "
+    dl.footnote,
+    dl.field-list
+      display: grid
+      grid-template-columns: max-content auto
+      > dt
+        padding-left: 1rem
         &:after
-          content: "]"
-      > span.fn-backref
-        font-style: italic
-    > dd
-      margin: 0rem 0rem .5rem 0rem
-      line-height: 1.2rem
-      p
-        font-size: .9rem
-  dl.option-list
-    kbd
+          content: ":"
+      > dt, > dd
+        margin-bottom: 0rem
+    dl.footnote
       font-size: .9rem
-
-  table.docutils.footnote, dl.footnote
+      > dt
+        margin: 0rem .5rem .5rem 0rem
+        line-height: 1.2rem
+        word-break: break-all
+        font-weight: normal
+        > span.brackets
+          margin-right: .5rem
+          &:before
+            content: "["
+          &:after
+            content: "]"
+        > span.fn-backref
+          font-style: italic
+      > dd
+        margin: 0rem 0rem .5rem 0rem
+        line-height: 1.2rem
+        p
+          font-size: .9rem
+    dl.option-list
+      kbd
+        font-size: .9rem
+  // Both
+  html.writer-html4 & table.docutils.citation, table.docutils.footnote,
+  html.writer-html5 & dl.footnote
     color: $text-medium
     code
-      color: $gray-500
+      color: $gray
 
   // Remove the large vertical space between citations and footnotes
-  .table-responsive.citation, .table-responsive.footnote
+  .wy-table-responsive.citation, .wy-table-responsive.footnote
     margin-bottom: 0
   // Re-add vertical space to element directly following citation and footnotes,
   // if the following element is of a different type
-  .table-responsive.citation + :not(.citation),
-  .table-responsive.footnote + :not(.footnote)
-    margin-top: $line-height-base
+  .wy-table-responsive.citation + :not(.citation),
+  .wy-table-responsive.footnote + :not(.footnote)
+    margin-top: $base-line-height
   // Re-add vertical space after citation and footnotes if it is the last child of a parent
-  .table-responsive.citation:last-child, .table-responsivefootnote:last-child
-    margin-bottom: $line-height-base
+  .wy-table-responsive.citation:last-child, .wy-table-responsive.footnote:last-child
+    margin-bottom: $base-line-height
   table.docutils
-    @extend .table
-    @extend .table-bordered
+    @extend .wy-table
+    @extend .wy-table-bordered-all
     th
-      border-color: $gray-300
+      border-color: $table-border-color
       html.writer-html5 &
-        border: 1px solid $gray-300
+        border: 1px solid $table-border-color
     html.writer-html5 &
       th > p, td > p
         line-height: 1rem
         margin-bottom: 0rem
         font-size: .9rem
     &:not(.field-list)
-      @extend .table-striped
+      @extend .wy-table-striped
     // Remove bottom margin for the last element (and it's last child)
     td .last, td .last > *:last-child
       margin-bottom: 0
   // This table is what gets spit out for auto-generated API stuff. I style it smaller bits of padding.
   table.field-list
-    @extend .table
+    @extend .wy-table
     border: none
     td
       border: none
@@ -361,57 +373,57 @@
   tt, code
     @extend code
     color: $black
-    font-family: $font-family-code
+    font-family: $code-font-family
     padding: 2px 5px
     big, em
       font-size: 100% !important
       line-height: normal
 
     &.literal
-      border: 1px solid $gray-300
-      color: $red
+      color: $text-code-color
       white-space: normal
     &.xref, a &
       font-weight: bold
       color: $text-codexref-color
   pre, kbd, samp
-    font-family: $font-family-code
+    font-family: $code-font-family
   // If the literal is inside an a tag, let's color it like a link
   a tt, a code
     color: $link-color
   dl
-    margin-bottom: $line-height-base
+    margin-bottom: $base-line-height
     dt
       font-weight: bold
-      margin-bottom: $line-height-base / 2
+      margin-bottom: $base-line-height / 2
     // Most of the content within these dls are one liners, so I halve the normal margins.
     p, table, ul, ol
-      margin-bottom: $line-height-base / 2
+      margin-bottom: $base-line-height / 2
     // rST seems to want dds to be treated as the browser would, indented.
     dd
-      margin: 0  0 $line-height-base / 2 $line-height-base
-      line-height: $line-height-base
-
-  dl[class]:not(.option-list):not(.field-list):not(.footnote):not(.glossary):not(.simple)
-    margin-bottom: $line-height-base
+      margin: 0  0 $base-line-height / 2 $base-line-height
+      line-height: $base-line-height
+  html.writer-html4 & dl:not(.docutils),
+  html.writer-html5 & dl[class]:not(.option-list):not(.field-list):not(.footnote):not(.glossary):not(.simple)
+    margin-bottom: $base-line-height
     > dt
       display: table
-      margin: $line-height-base / 4 0
+      margin: $base-line-height / 4 0
       font-size: 90%
       line-height: normal
-      background: lighten($class-color, 45%)
+      background: lighten($class-color, 50%)
       color: $class-color
       border-top: solid 3px lighten($class-color, 20%)
-      padding: $line-height-base / 4
+      padding: $base-line-height / 4
       position: relative
       &:before
         color: lighten($class-color, 20%)
       .headerlink
         color: $text-color
         font-size: 100% !important
-    // parameters
+    // In the html4 writer, parameters is a table. In html5 writer, parameters
+    // is a nested dl.field-list
     dl:not(.field-list) > dt
-      margin-bottom: $line-height-base / 4
+      margin-bottom: $base-line-height / 4
       border: none
       border-left: solid 3px hsl(0,0%,80%)
       background: hsl(0,0%,94%)
@@ -419,8 +431,6 @@
       .headerlink
         color: $headerlink-color
         font-size: 100% !important
-      &:not(.sig-name)
-        color: darken($method-color, 35%)
     > dt:first-child
       margin-top: 0
     // Since dts get the callout style, we treat this less as callouts.
@@ -447,7 +457,7 @@
     display: inline-block
     color: $text-viewcode-color
     font-size: 80%
-    padding-left: $line-height-base
+    padding-left: $base-line-height
   .viewcode-back
     display: block
     float: right
@@ -472,21 +482,18 @@
         margin-right: 4px
   .guilabel
     border: 1px solid lighten($guilabel-color, 25%)
-    background: lighten($guilabel-color, 45%)
+    background: lighten($guilabel-color, 50%)
     font-size: 80%
     font-weight: 700
-    border-radius: $line-height-base / 6
-    padding: $line-height-base / 10 $line-height-base / 4
-    margin: auto $line-height-base / 12
-  kbd, .kbd
-    color: inherit
-    background: $gray-300
+    border-radius: $base-line-height / 6
+    padding: $base-line-height / 10 $base-line-height / 4
+    margin: auto $base-line-height / 12
   .versionmodified
     font-style: italic
 
 
 // Mobile specific
-@include media-breakpoint-down(sm)
++media($mobile)
   .rst-content
     .sidebar
       width: 100%

src/sass/_theme_variables.sass

@@ -1,67 +1,69 @@
 // In here are varibles used for sphinx_rtd_theme, they either add to or overwrite the default ones
-// -------------------------Paths-------------------------
+// that are set in wyrm_core/wy_variables.sass. You'll find wyrm in bower_components if you're looking
+// for a reference.
+
 $fa-font-path:                        "~font-awesome/fonts"
+$static-img:                          "../img/"
 
-// -------------------------Layout-------------------------
-$gutter:                              1.618em // the golden ratio
-
-$nav-desktop-position:                left
-$nav-desktop-width:                   300px
 $nav-content-width:                   800px
 $nav-media-query:                     (($nav-desktop-width) + ($nav-content-width))
 
-// -------------------------Typography-------------------------
-$font-family-base:                    "Lato", "proxima-nova", "Helvetica Neue", Arial, sans-serif
-$font-family-headings:                "Roboto Slab", ff-tisa-web-pro, Georgia, Arial, sans-serif
-$font-family-code:                    SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", Courier, monospace
-$font-display:                        block
-$font-size-base:                      16px
-$line-height-base:                    24px
-
-// -------------------------Colors-------------------------
-// Text
-$text-color:                          hsl(0,0%,25%) !default
-$text-dark:                           lighten($text-color,15%) !default
-$text-medium:                         lighten($text-color,25%) !default
-$text-light:                          lighten($text-color,45%) !default
-$text-lighter:                        lighten($text-color,60%) !default
-
-// Content
-$section-background-color:            $gray-200
-$content-background-color:            $white
-$footer-color:                        $text-medium
-
-// Links
-$link-color:                          $blue
-$link-color-visited:                  $purple
-$headerlink-color:                    $text-color
-
-// Math
 $mathjax-color:                       $text-color
 
+$headerlink-color:                    $text-color
+
 // Code colors
 $text-viewcode-color:                 $green
 $text-codexref-color:                 $text-color
 
 // Definition list colors
 $class-color:                         $blue
-$method-color:                        $gray-500
+$method-color:                        $gray
 
 // GUI label color
 $guilabel-color:                      $blue
 
+// Footer colors
+$footer-color:                        $text-medium
+
+// Menu colors
+$menu-vertical-background-color:      $section-background-color
+
+// Menu text colors
+$menu-color:                          $gray
+$menu-dark:                           lighten($menu-color,10%) !default
+$menu-medium:                         lighten($menu-color,27.5%) !default
+$menu-light:                          lighten($menu-color,45%) !default
+$menu-lighter:                        lighten($menu-color,60%) !default
+
 // Menu link colors
 $menu-link-color:                     $text-color
+$menu-link-dark:                      $text-dark
 $menu-link-medium:                    $text-medium
 $menu-link-light:                     $text-lighter
 $menu-link-active:                    $white
 
 // Navigation colors
-$nav-background-color:                #343131
-$nav-search-background-color:         #2980B9
+$nav-background-color:                $menu-background-color
+$nav-search-background-color:         $blue
 $nav-search-color:                    $section-background-color
-$nav-menu-background-color:           $section-background-color
-$nav-caption:                         $nav-search-background-color
+$nav-link-color:                      $blue
+$nav-link-color-visited:              $purple
+$nav-link-color-hover:                lighten($nav-link-color, 6%) !default
+$nav-link-color-alt:                  hsl(33, 100%, 51%)
+$nav-caption:                         lighten($blue, 15%)
+
+// Sidebar colors
+$sidebar-background-color:            $table-stripe-color
+$sidebar-border-color:                $table-border-color
+$sidebar-title-background-color:      $table-border-color
 
 // Sphinx highlight color
 $highlight-color:                     $yellow
+
+$base-font-family:                    "Lato", "proxima-nova", "Helvetica Neue", Arial, sans-serif
+$custom-font-family:                  "Roboto Slab", "ff-tisa-web-pro", "Georgia", Arial, sans-serif
+$custom-font-family2:                 Georgia, serif
+$code-font-family:                    SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", Courier, monospace
+
+$font-display:                        block

src/sass/badge_only.sass

@@ -4,10 +4,13 @@
 // This generates the RTD sticky badge for non RTD themes. As
 // always, only files labeled "theme_*.sass should be edited".
 // ------------------------------------------------------------
+$border-box-sizing: false !default
 
-@import "node_modules/bootstrap/scss/functions"
-@import "node_modules/bootstrap/scss/variables"
-@import "node_modules/bootstrap/scss/mixins"
+@import wyrm_core/wy_variables
 @import theme_variables
-@import theme_badge_fa
-@import theme_badge
+@import ~bourbon/app/assets/stylesheets/bourbon
+@import ~bourbon-neat/app/assets/stylesheets/neat
+@import wyrm_core/mixin
+@import wyrm_core/grid_settings
+@import _theme_badge_fa
+@import _theme_badge

src/sass/theme.sass

@@ -6,14 +6,39 @@
 // "theme_*.sass". All other files are loaded through bower.
 // ------------------------------------------------------------
 
-@import ~bootstrap/scss/bootstrap
+// Variable defaults set by Wyrm
+@import wyrm_core/wy_variables
 
 // Variable overrides that change coloring and fonts for this theme.
 @import theme_variables
 
-// Font Awesome
-@import ~font-awesome/scss/font-awesome
+// bourbon.io framework
+@import ~bourbon/app/assets/stylesheets/bourbon
 
+// Bourbon.io/neat framework, with some default media queries
+@import wyrm_core/grid_settings
+@import ~bourbon-neat/app/assets/stylesheets/neat
+// Some corrections for neat
+@import wyrm_core/neat_extra
+
+// Custom reset
+@import wyrm_core/reset
+
+// Wyrm mixins
+@import wyrm_core/mixin
+
+// Font Awesome with wyrm extras
+@import ~font-awesome/scss/font-awesome
+@import wyrm_core/font_icon_defaults
+
+// Wyrm core styles used in this theme
+@import wyrm_core/alert
+@import wyrm_core/button
+@import wyrm_core/dropdown
+@import wyrm_core/form
+@import wyrm_core/generic
+@import wyrm_core/table
+@import wyrm_core/type
 
 // Theme specific styles. These are likely the files you want to edit.
 @import theme_breadcrumbs

src/theme.js

@@ -80,15 +80,15 @@ function ThemeNav () {
         $(document)
             // Shift nav in mobile when clicking the menu.
             .on('click', "[data-toggle='wy-nav-top']", function() {
-                $("[data-toggle='sidebar-collapse']").toggleClass("shift");
+                $("[data-toggle='wy-nav-shift']").toggleClass("shift");
                 $("[data-toggle='rst-versions']").toggleClass("shift");
             })
 
             // Nav menu link click operations
-            .on('click', ".sidebar-navigation .current ul li a", function() {
+            .on('click', ".wy-menu-vertical .current ul li a", function() {
                 var target = $(this);
                 // Close menu when you click a link.
-                $("[data-toggle='sidebar-collapse']").removeClass("shift");
+                $("[data-toggle='wy-nav-shift']").removeClass("shift");
                 $("[data-toggle='rst-versions']").toggleClass("shift");
                 // Handle dynamic display of l3 and l4 nav lists
                 self.toggleCurrent(target);
@@ -100,17 +100,17 @@ function ThemeNav () {
 
         // Make tables responsive
         $("table.docutils:not(.field-list,.footnote,.citation)")
-            .wrap("<div class='table-responsive'></div>");
+            .wrap("<div class='wy-table-responsive'></div>");
 
         // Add extra class to responsive tables that contain
         // footnotes or citations so that we can target them for styling
         $("table.docutils.footnote")
-            .wrap("<div class='table-responsive footnote'></div>");
+            .wrap("<div class='wy-table-responsive footnote'></div>");
         $("table.docutils.citation")
-            .wrap("<div class='table-responsive citation'></div>");
+            .wrap("<div class='wy-table-responsive citation'></div>");
 
         // Add expand links to all parents of nested ul
-        $('.sidebar-navigation ul').not('.simple').siblings('a').each(function () {
+        $('.wy-menu-vertical ul').not('.simple').siblings('a').each(function () {
             var link = $(this);
                 expand = $('<span class="toctree-expand"></span>');
             expand.on('click', function (ev) {
@@ -127,7 +127,7 @@ function ThemeNav () {
         var anchor = encodeURI(window.location.hash) || '#';
 
         try {
-            var vmenu = $('.sidebar-navigation');
+            var vmenu = $('.wy-menu-vertical');
             var link = vmenu.find('[href="' + anchor + '"]');
             if (link.length === 0) {
                 // this link was not found in the sidebar.
@@ -144,7 +144,7 @@ function ThemeNav () {
             // If we found a matching link then reset current and re-apply
             // otherwise retain the existing match
             if (link.length > 0) {
-                $('.sidebar-navigation .current').removeClass('current');
+                $('.wy-menu-vertical .current').removeClass('current');
                 link.addClass('current');
                 link.closest('li.toctree-l1').parent().addClass('current');
                 for (let i = 1; i <= 10; i++) {

webpack.common.js

@@ -37,10 +37,10 @@ module.exports = {
             loader: "sass-loader?indentedSyntax",
             options: {
               includePaths: [
-                "node_modules/bootstrap/scss",
                 "node_modules/bourbon/app/assets/stylesheets",
                 "node_modules/bourbon-neat/app/assets/stylesheets",
-                "node_modules/font-awesome/scss"
+                "node_modules/font-awesome/scss",
+                "node_modules/wyrm/sass"
               ]
             }
           }
@@ -66,5 +66,11 @@ module.exports = {
       filename: "css/[name].css?[hash]",
       chunkFilename: "css/[name].css?[hash]"
     }),
+    new CopyPlugin([
+      {
+        from: 'node_modules/html5shiv/dist/*.min.js',
+        flatten: true,
+        to: path.resolve(__dirname,'sphinx_rtd_theme/static/js') },
+    ]),
   ]
 };