Merge pull request #87 from choldgraf/improvements

docs/conf.py

@@ -1,8 +1,8 @@
 # -- Project information -----------------------------------------------------
 
 project = "Sphinx Book Theme"
-copyright = "2020, Executable Book Project"
-author = "Executable Book Project"
+copyright = "2020"
+author = "the Executable Book Project"
 
 master_doc = "index"
 

docs/layout.md

@@ -32,21 +32,26 @@ Content sidebars exist in-line with your text, but allow the rest of the
 page to flow around them, rather than moving to the right margin.
 To add content sidebars, use this syntax:
 
+````
 ```{sidebar} **My sidebar title**
 Here is my sidebar content, it is pretty cool!
 ```
+````
 
 Note how the content wraps around the sidebar to the right.
 However, the sidebar text will still be in line with your content. There are
 certain kinds of elements, such as "note" blocks and code cells, that may
 clash with your sidebar. If this happens, try using a `{margin}` instead.
 
-````
-```{sidebar} **My sidebar title**
+
+````{sidebar} **My sidebar title**
+```{note}
 Here is my sidebar content, it is pretty cool!
 ```
+![](images/cool.jpg)
 ````
 
+
 ### Adding content to margins and sidebars
 
 Sidebar/margin content can include all kinds of things, such as code blocks:

setup.py

@@ -34,7 +34,7 @@
         "click",
         "setuptools",
         "libsass",
-        "pydata-sphinx-theme",
+        "pydata-sphinx-theme==0.2.2",
     ],
     extras_require={
         "code_style": ["flake8<3.8.0,>=3.7.0", "black", "pre-commit==1.17.0"],

sphinx_book_theme/__init__.py

@@ -1,6 +1,5 @@
 """A lightweight book theme based on the pydata sphinx theme."""
 from pathlib import Path
-import docutils
 from docutils.parsers.rst import directives
 from docutils import nodes
 from sphinx.util import logging
@@ -47,30 +46,6 @@ def find_url_relative_to_root(pagename, relative_page, path_docs_source):
 
 
 def add_to_context(app, pagename, templatename, context, doctree):
-    def show_if_no_margin():
-        # By default we'll show, unless there are margin items
-        out = "show"
-        # Check for margin items in this doctree
-        if doctree is not None:
-
-            def is_margin(node):
-                return isinstance(
-                    node, docutils.nodes.sidebar
-                ) and "margin" in node.attributes.get("classes", [])
-
-            margin_elements = doctree.traverse(is_margin)
-            containers = list(doctree.traverse(nodes.container))
-            popout_tags = [
-                cl
-                for cell in containers
-                for cl in cell.attributes["classes"]
-                if any(ii == cl for ii in ["tag_popout", "tag_margin"])
-            ]
-            # If we found margin elements, then we won't show
-            if any(len(ii) > 0 for ii in [margin_elements, popout_tags]):
-                out = ""
-        return out
-
     def nav_to_html_list(
         nav,
         level=1,
@@ -179,7 +154,6 @@ def nav_to_html_list(
         ul = "\n".join(ul)
         return ul
 
-    context["show_if_no_margin"] = show_if_no_margin
     context["nav_to_html_list"] = nav_to_html_list
 
     # Add a shortened page text to the context using the sections text
@@ -190,6 +164,10 @@ def nav_to_html_list(
         description = description[:160]
         context["page_description"] = description
 
+    # Add the author if it exists
+    if app.config.author != "unknown":
+        context["author"] = app.config.author
+
     # Absolute URLs for logo if `html_baseurl` is given
     # pageurl will already be set by Sphinx if so
     if app.config.html_baseurl and app.config.html_logo:

sphinx_book_theme/footer.html

@@ -0,0 +1,19 @@
+<footer class="footer mt-5 mt-md-0">
+    <div class="container">
+      <p>
+        {% if author %}
+          By {{ author }}<br/>
+        {% endif %}
+        {%- if show_copyright %}
+          {%- if hasdoc('copyright') %}
+            {% trans path=pathto('copyright'), copyright=copyright|e %}&copy; <a href="{{ path }}">Copyright</a> {{ copyright }}.{% endtrans %}<br/>
+          {%- else %}
+            {% trans copyright=copyright|e %}&copy; Copyright {{ copyright }}.{% endtrans %}<br/>
+          {%- endif %}
+        {%- endif %}
+        {%- if last_updated %}
+          {% trans last_updated=last_updated|e %}Last updated on {{ last_updated }}.{% endtrans %}<br/>
+        {%- endif %}
+      </p>
+    </div>
+  </footer>

sphinx_book_theme/layout.html

@@ -35,7 +35,7 @@
     {% block docs_body %}
     {% include "topbar.html" %}
     <div id="main-content" class="row">
-        <div class="col-12 col-md-9 col-xxl-7 pl-md-3 pr-md-0">
+        <div class="col-12 col-md-9 pl-md-3 pr-md-0">
         {{ super() }}
         </div>
     </div>

sphinx_book_theme/static/sphinx-book-theme.js

@@ -55,6 +55,30 @@ var initTooltips = () => {
   });
 }
 
+var initTocHide = () => {
+  // Hide the TOC when we scroll down
+  var scrollTimeout;
+  var throttle = 100;  // in milliseconds
+  var hideTocAfter = 200;  // in pixels
+  var checkTocScroll = function () {
+      if (window.pageYOffset > hideTocAfter) {
+        $("div.bd-toc").removeClass("show")
+      } else {
+        $("div.bd-toc").addClass("show")
+      };
+  };
+
+  $(window).on('scroll', function () {
+      if (!scrollTimeout) {
+          scrollTimeout = setTimeout(function () {
+              checkTocScroll();
+              scrollTimeout = null;
+          }, throttle);
+      }
+  });
+}
+
 sbRunWhenDOMLoaded(initTooltips)
 sbRunWhenDOMLoaded(initTriggerNavBar)
 sbRunWhenDOMLoaded(scrollToActive)
+sbRunWhenDOMLoaded(initTocHide)

sphinx_book_theme/static/sphinx-book-theme.scss

@@ -2,7 +2,6 @@
 * Variables *
 *********************************************/
 // Breakpoints from Bootstrap: https://getbootstrap.com/docs/4.1/layout/overview/#responsive-breakpoints
-$breakpoint-xxl: 1500px;  // Custom one
 $breakpoint-xl: 1200px;
 $breakpoint-lg: 992px;
 $breakpoint-md: 768px;
@@ -32,26 +31,6 @@ code {
 * Main body *
 *********************************************/
 
-// Custom XXL breakpoint
-@media (min-width: $breakpoint-xxl) {
-    .col-xxl-7 {
-        flex: 0 0 61% !important;
-        max-width: 61% !important;
-        position: relative !important;
-        width: 100% !important;
-        padding-right: 15px !important;
-        padding-left: 15px !important;
-    }
-}
-
-// If the sidebar is collapsed, our main content should expand fully
-div.bd-sidebar.collapse:not(.show) + main.bd-content {
-    @media (max-width: $breakpoint-xxl) {
-        flex: 0 0 100%;
-        max-width: 100%;
-    }
-}
-
 main.bd-content {
     padding-top: $topbar-height !important;
     padding-bottom: 0px !important;
@@ -277,6 +256,13 @@ div.sidebar, div.margin, div.margin-caption p.caption, .cell.tag_popout, .cell.t
     div.cell.tag_margin .cell_output {
         padding-left: 0;
     }
+
+    div.sidebar:not(.margin) {
+        width: 60%;
+        margin-left: 1.5em;
+        margin-right: -28%;
+    }
+
 }
 
 
@@ -522,14 +508,6 @@ button.topbarbtn img {
         }
     }
 
-    // On really wide screens, we always show the nav
-    @media (min-width: $breakpoint-xxl) {
-        height: auto !important;
-        nav {
-            opacity: 1;
-        }
-    }
-
     // On hover or w/ a show class, we show the TOC
     &:hover, &.show {
         overflow-y: visible;

sphinx_book_theme/topbar.html

@@ -49,7 +49,7 @@
 
         {% endif %}
     </div>
-    <div class="d-none d-md-block col-md-2 bd-toc {{ show_if_no_margin() }}">
+    <div class="d-none d-md-block col-md-2 bd-toc show">
         {%- include "docs-toc.html" %}
     </div>
 </div>