Merge branch 'master' into match-searchbox

https://github.com/sphinx-doc/sphinx/blob/3.x/sphinx/themes/basic/searchbox.html

sphinx_rtd_theme/layout.html

@@ -174,7 +174,7 @@
     <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') }}">
+      <nav 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>

sphinx_rtd_theme/searchbox.html

@@ -1,9 +1,22 @@
-{%- if 'singlehtml' not in builder %}
-<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>
+{#
+    basic/searchbox.html
+    ~~~~~~~~~~~~~~~~~~~~
+
+    Sphinx sidebar template: quick search box.
+
+    :copyright: Copyright 2007-2020 by the Sphinx team, see AUTHORS.
+    :license: BSD, see https://github.com/sphinx-doc/sphinx/blob/master/LICENSE for details.
+
+    .. note::
+
+       This file is the same, except the "Go" button was removed and the label is an aria-label.
+#}
+{%- if pagename != "search" and builder != "singlehtml" %}
+<div id="searchbox" role="search">
+  <div class="searchformwrapper">
+    <form class="search" action="{{ pathto('search') }}" method="get">
+      <input aria-label="{{ _('Search docs') }}" type="text" name="q" id="main-search" placeholder="{{ _('Search docs') }}"/>
+    </form>
+  </div>
 </div>
 {%- endif %}

src/sass/_theme_layout.sass

@@ -45,13 +45,18 @@ html
   ul
     margin-bottom: 0
   li
+    &.divide-top
+      border-top: solid 1px hsl(0, 0%, 25%)
+    &.divide-bottom
+      border-bottom: solid 1px hsl(0, 0%, 25%)
     &.current
       background: darken($menu-vertical-background-color, 10%)
       a
         color: $menu-link-medium
+        border-right: solid 1px darken($menu-vertical-background-color, 20%)
         padding: ($gutter / 4) ($gutter * 1.5)
         &:hover
-          background: $menu-vertical-background-color
+          background: darken($menu-vertical-background-color, 15%)
     code
       border: none
       background: inherit
@@ -62,18 +67,20 @@ html
     span.toctree-expand
       display: block
       float: left
-      margin-left: -1em
+      margin-left: -1.2em
       @extend .fa
-      @extend .fa-angle-right
+      @extend .fa-plus-square-o
       line-height: 18px
+      color: darken($menu-link-medium, 20%)
 
   // On state for the first level
-  li.current > a
+  li.on a, li.current > a
     color: $menu-link-color
     padding: ($gutter / 4) $gutter
     font-weight: bold
     position: relative
     background: $menu-vertical-background-color
+    border: none
     padding-left: $gutter -4px
     +font-smooth
     &:hover
@@ -82,9 +89,14 @@ html
         color: $menu-link-medium
     span.toctree-expand
       @extend .fa
-      @extend .fa-angle-down
+      @extend .fa-minus-square-o
       display: block
       line-height: 18px
+      color: darken($menu-link-medium, 30%)
+
+  li.toctree-l1.current > a
+    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
 
@@ -114,12 +126,11 @@ html
       li.toctree-l#{$toc_level}
         a
           @extend %toctree_link_color
-          background: darken($menu-vertical-background-color, 6% * $toc_level)
         &.current
           > a
             padding: ($gutter / 4) ($gutter * ($toc_level - 1 + 0.5))
 
-          li.toctree-l#{$toc_level + 1} > a
+          li.toctree-l#{$toc_level + 1}  > a
             @extend %display_current_toctree_element
             padding: ($gutter / 4) ($gutter * ($toc_level + 0.5))
             padding-right: $gutter
@@ -129,6 +140,23 @@ html
       li.toctree-l#{$toc_level}
         @extend %shrink_toctree_element
 
+  li.toctree-l2
+    &.current
+      > a
+        background: darken($menu-vertical-background-color, 20%)
+      li.toctree-l3 > a
+        background: darken($menu-vertical-background-color, 20%)
+    span.toctree-expand
+      color: darken($menu-vertical-background-color, 35%)
+  li.toctree-l3
+    &.current
+      > a
+        background: darken($menu-vertical-background-color, 25%)
+      li.toctree-l4 > a
+        background: darken($menu-vertical-background-color, 25%)
+    span.toctree-expand
+      color: darken($menu-vertical-background-color, 40%)
+
   li.current ul
     display: block
   li ul
@@ -148,6 +176,8 @@ html
     &:hover
       background-color: lighten($menu-background-color, 10%)
       cursor: pointer
+      span.toctree-expand
+        color: $menu-link-light
     &:active
       background-color: $menu-logo-color
       cursor: pointer
@@ -166,9 +196,9 @@ html
   color: $nav-search-color
   input[type=text]
     width: 100%
-    border: none
     border-radius: 50px
     padding: 6px 12px
+    border-color: darken($link-color, 5%)
   img
     display: block
     margin: auto auto ($gutter / 2) auto