Squashed commit of the following:

commit 201132b
Merge: fb6219c 2026bb6
Author: Aaron Carlisle <carlisle.b3d@gmail.com>
Date:   Sun Apr 18 18:10:08 2021 -0400

    Merge branch 'master' into Blendify/fixed-header

commit fb6219c
Author: Aaron Carlisle <carlisle.b3d@gmail.com>
Date:   Sun Apr 11 22:49:11 2021 -0400

    Add delta & adjust padding

commit 25ea466
Author: Aaron Carlisle <carlisle.b3d@gmail.com>
Date:   Sun Apr 11 22:33:52 2021 -0400

    Move Header Height to variable

commit 0d8ed6d
Author: Aaron Carlisle <carlisle.b3d@gmail.com>
Date:   Sun Apr 11 00:59:38 2021 -0400

    Update comment

commit e5091f4
Author: Aaron Carlisle <carlisle.b3d@gmail.com>
Date:   Sun Apr 11 00:57:18 2021 -0400

    Header: Hide on scroll

    This patch solve the issue where users have to scroll to the top of the page to open the sidebar.

    This patch will work best with #1122 but can be independent.

    Fixes: #473

sphinx_rtd_theme/layout.html

@@ -115,7 +115,7 @@
   {%- block extrabody %} {% endblock %}
   {#- MOBILE NAV, TRIGGLES SIDE NAV ON TOGGLE #}
   <header>
-    <nav data-toggle="wy-nav-shift" class="wy-nav-top" aria-label="{{ _('Top') }}"  {% if theme_style_nav_header_background %} style="background: {{theme_style_nav_header_background}}" {% endif %}>
+    <nav id="navbar" data-toggle="wy-nav-shift" class="wy-nav-top" aria-label="{{ _('Top') }}"  {% if theme_style_nav_header_background %} style="background: {{theme_style_nav_header_background}}" {% endif %}>
       {%- block mobile_nav %}
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
         <a href="{{ pathto(master_doc) }}">{{ project }}</a>

src/sass/_theme_layout.sass

@@ -289,32 +289,29 @@ body
 .wy-nav-top
   display: none
   margin-left: $nav-desktop-width
-  background: $link-color
+  background: $nav-search-background-color
   color: $white
-  padding: ($gutter / 4) ($gutter / 2)
+  position: fixed
+  top: 0
   width: 100%
-  max-width: $nav-content-width
-  position: relative
-  line-height: 50px
+  max-width: 800px;
+  height: $nav-header-height
+  line-height: $nav-header-height
   text-align: center
   font-size: 100%
+  transition: top 0.4s
   +clearfix
   a
     color: $white
     font-weight: bold
     +font-smooth
-  img
-    margin-right: $base-line-height / 2
-    height: 45px
-    width: 45px
-    background-color: $menu-logo-color
-    padding: 5px
-    border-radius: 100%
   i
     font-size: 30px
     float: left
     cursor: pointer
     padding-top: inherit
+    padding-left: $gutter / 4
+    line-height: $nav-header-height
 
 .wy-nav-content
   margin-left: $nav-desktop-width
@@ -385,6 +382,7 @@ footer
     &.shift
       margin-left: $nav-desktop-width
   .wy-nav-content
+    margin-top: $nav-header-height
     margin-left: 0px
     &.shift
       margin-left: $nav-desktop-width

src/sass/_theme_variables.sass

@@ -5,6 +5,7 @@
 $fa-font-path:                        "~font-awesome/fonts"
 $static-img:                          "../img/"
 
+$nav-header-height:                   50px
 $nav-content-width:                   800px
 $nav-media-query:                     $nav-desktop-width + $nav-content-width
 

src/theme.js

@@ -2,6 +2,24 @@ var jQuery = (typeof(window) != 'undefined') ? window.jQuery : require('jquery')
 
 // Sphinx theme nav state
 function ThemeNav () {
+    var delta = 5;
+
+    /* When the user scrolls down, hide the navbar. When the user scrolls up, show the navbar */
+    var prevScrollpos = window.pageYOffset;
+    window.onscroll = function() {
+      var currentScrollPos = window.pageYOffset;
+
+
+      if(Math.abs(prevScrollpos - currentScrollPos) <= delta)
+        return
+
+      if ((prevScrollpos > currentScrollPos) || (currentScrollPos < 25)) {
+        document.getElementById("navbar").style.top = "0";
+      } else {
+        document.getElementById("navbar").style.top = "-50px";
+      }
+      prevScrollpos = currentScrollPos;
+    }
 
     var nav = {
         navBar: null,