From 53fcab0ce29fdd46c7afe270bb7fe7c1346e0acc Mon Sep 17 00:00:00 2001
From: Chris Holdgraf <choldgraf@berkeley.edu>
Date: Mon, 27 Apr 2020 14:55:34 -0700
Subject: [PATCH 1/4] removing button backgrounds and text

---
 .../static/sphinx-book-theme.css              | 22 ++++++++++++-----
 .../static/sphinx-book-theme.scss             | 18 ++++++++++----
 sphinx_book_theme/theme.conf                  |  1 +
 sphinx_book_theme/topbar.html                 | 24 +++++++++----------
 4 files changed, 43 insertions(+), 22 deletions(-)

diff --git a/sphinx_book_theme/static/sphinx-book-theme.css b/sphinx_book_theme/static/sphinx-book-theme.css
index 8e9f7ad2..48ad0588 100644
--- a/sphinx_book_theme/static/sphinx-book-theme.css
+++ b/sphinx_book_theme/static/sphinx-book-theme.css
@@ -193,9 +193,13 @@ dl.footnote dd p {
     float: left;
     height: 100%; }
   .topbar .topbar-main button.topbarbtn {
-    margin: 0 .2em;
-    background-color: #5a5a5a;
-    font-size: .9em; }
+    margin: 0 .1em;
+    background-color: white;
+    color: #5a5a5a;
+    font-size: 1.4em;
+    border: none;
+    padding-top: .1rem;
+    padding-bottom: .1rem; }
 
 .bd-topbar-whitespace {
   padding-right: none; }
@@ -211,9 +215,14 @@ div.dropdown-buttons-trigger div.dropdown-buttons {
   display: none;
   position: absolute;
   max-width: 120px; }
-  div.dropdown-buttons-trigger div.dropdown-buttons button {
+  div.dropdown-buttons-trigger div.dropdown-buttons button.topbarbtn {
+    padding-top: .35rem;
+    padding-bottom: .35rem;
     min-width: 120px !important;
-    border: 1px white solid !important; }
+    border: 1px white solid !important;
+    background-color: #5a5a5a;
+    color: white;
+    font-size: 1em; }
 
 div.dropdown-buttons-trigger:hover div.dropdown-buttons {
   display: block; }
@@ -229,7 +238,8 @@ button.topbarbtn img {
 #navbar-toggler {
   position: relative;
   margin-right: 1em;
-  margin-left: .5em; }
+  margin-left: .5em;
+  color: #5a5a5a; }
   #navbar-toggler i {
     transition: opacity .3s, transform .3s;
     position: absolute;
diff --git a/sphinx_book_theme/static/sphinx-book-theme.scss b/sphinx_book_theme/static/sphinx-book-theme.scss
index a37586c4..0137dd3e 100644
--- a/sphinx_book_theme/static/sphinx-book-theme.scss
+++ b/sphinx_book_theme/static/sphinx-book-theme.scss
@@ -342,9 +342,13 @@ dl.footnote {
         }
 
         button.topbarbtn {
-            margin: 0 .2em;
-            background-color: #5a5a5a;
-            font-size: .9em;
+            margin: 0 .1em;
+            background-color: white;
+            color: #5a5a5a;
+            font-size: 1.4em;
+            border: none;
+            padding-top: .1rem;
+            padding-bottom: .1rem;
         }
     }
 }
@@ -372,9 +376,14 @@ div.dropdown-buttons-trigger {
         position: absolute;
         max-width: 120px;
 
-        button {
+        button.topbarbtn {
+            padding-top: .35rem;
+            padding-bottom: .35rem;
             min-width: 120px !important;
             border: 1px white solid !important;
+            background-color: #5a5a5a;
+            color: white;
+            font-size: 1em;
         }
     }
 
@@ -397,6 +406,7 @@ button.topbarbtn img {
     position: relative;
     margin-right: 1em;
     margin-left: .5em;
+    color: #5a5a5a;
 
     i {
         transition: opacity .3s, transform .3s;
diff --git a/sphinx_book_theme/theme.conf b/sphinx_book_theme/theme.conf
index 72e47dc2..d245a2f6 100644
--- a/sphinx_book_theme/theme.conf
+++ b/sphinx_book_theme/theme.conf
@@ -14,3 +14,4 @@ launch_buttons = {}
 home_page_in_toc = False
 number_toc_sections = False
 expand_sections = []
+search_bar_text = Search this book...
diff --git a/sphinx_book_theme/topbar.html b/sphinx_book_theme/topbar.html
index 47bac2bf..42ef177f 100644
--- a/sphinx_book_theme/topbar.html
+++ b/sphinx_book_theme/topbar.html
@@ -3,47 +3,47 @@
     </div>
     <div class="col pl-2 topbar-main">
         {% if theme_single_page != True %}
-        <button id="navbar-toggler" class="navbar-toggler ml-0" type="button" data-toggle="collapse" data-target=".site-navigation" aria-controls="navbar-menu" aria-expanded="true" aria-label="Toggle navigation" aria-controls="site-navigation">
+        <button id="navbar-toggler" class="navbar-toggler ml-0" type="button" data-toggle="collapse" data-target=".site-navigation" aria-controls="navbar-menu" aria-expanded="true" aria-label="Toggle navigation" aria-controls="site-navigation" title="Toggle navigation">
             <i class="fas fa-bars"></i>
             <i class="fas fa-arrow-left"></i>
             <i class="fas fa-arrow-up"></i>
         </button>
         <div class="dropdown-buttons-trigger">
-            <button id="dropdown-buttons-trigger" class="btn btn-secondary topbarbtn"><i class="fas fa-download"></i><span class="topbar-button-text">Download</span></button>
+            <button id="dropdown-buttons-trigger" class="btn btn-secondary topbarbtn" title="download this page"><i class="fas fa-download"></i></button>
 
             {% if page_source_suffix %}
             <div class="dropdown-buttons">
                 <!-- ipynb file if we had a myst markdown file -->
-                {% if ipynb_source %}<a class="dropdown-buttons" href="{{ pathto('_sources', 1) }}/{{ ipynb_source }}"><button type="button" class="btn btn-secondary topbarbtn">.ipynb</button></a>{% endif %}
+                {% if ipynb_source %}<a class="dropdown-buttons" href="{{ pathto('_sources', 1) }}/{{ ipynb_source }}"><button type="button" class="btn btn-secondary topbarbtn" title="Download notebook file">.ipynb</button></a>{% endif %}
                 <!-- Download raw file -->
-                <a class="dropdown-buttons" href="{{ pathto('_sources', 1) }}/{{ sourcename }}"><button type="button" class="btn btn-secondary topbarbtn">{{ page_source_suffix }}</button></a>
+                <a class="dropdown-buttons" href="{{ pathto('_sources', 1) }}/{{ sourcename }}"><button type="button" class="btn btn-secondary topbarbtn" title="Download source file">{{ page_source_suffix }}</button></a>
                 <!-- Download PDF via print -->
-                <button type="button" id="download-print" class="btn btn-secondary topbarbtn" onClick="window.print()">.pdf</button>
+                <button type="button" id="download-print" class="btn btn-secondary topbarbtn" title="Print to PDF" onClick="window.print()">.pdf</button>
             </div>
             {% endif %}
         </div>
 
+        <!-- Edit this page -->
+        {% if theme_use_edit_page_button and github_repo %}<a class="edit-button" href="{{ get_edit_url() }}"><button type="button" class="btn btn-secondary topbarbtn" title="edit this page"><i class="fas fa-pencil-alt"></i></button></a>{% endif %}
+
         <!-- Launch buttons -->
         {% if binder_url or jupyterhub_url or use_thebelab %}
         <div class="dropdown-buttons-trigger">
-            <button id="dropdown-buttons-trigger" class="btn btn-secondary topbarbtn"><i class="fas fa-rocket"></i><span class="topbar-button-text">Launch</span></button>
+            <button id="dropdown-buttons-trigger" class="btn btn-secondary topbarbtn" title="Launch interactive content"><i class="fas fa-rocket"></i></button>
             <div class="dropdown-buttons">
                 {% if binder_url %}
-                <a class="binder-button" href="{{ binder_url }}"><button type="button" class="btn btn-secondary topbarbtn"><img class="binder-button-logo" src="{{ pathto('_static/images/logo_binder.svg', 1) }}" alt="Interact on binder">Binder</button></a>
+                <a class="binder-button" href="{{ binder_url }}"><button type="button" class="btn btn-secondary topbarbtn" title="Launch Binder"><img class="binder-button-logo" src="{{ pathto('_static/images/logo_binder.svg', 1) }}" alt="Interact on binder">Binder</button></a>
                 {% endif %}
                 {% if jupyterhub_url %}
-                <a class="jupyterhub-button" href="{{ jupyterhub_url }}"><button type="button" class="btn btn-secondary topbarbtn"><img class="jupyterhub-button-logo" src="{{ pathto('_static/images/logo_jupyterhub.svg', 1) }}" alt="Interact on JupyterHub">JupyterHub</button></a>
+                <a class="jupyterhub-button" href="{{ jupyterhub_url }}"><button type="button" class="btn btn-secondary topbarbtn" title="Launch JupyterHub"><img class="jupyterhub-button-logo" src="{{ pathto('_static/images/logo_jupyterhub.svg', 1) }}" alt="Interact on JupyterHub">JupyterHub</button></a>
                 {% endif %}
                 {% if use_thebelab -%}
-                <button type="button" class="btn btn-secondary topbarbtn thebelab-launch-button" onclick="initThebelab()"><i class="fas fa-rocket"></i><span style="margin-left: .4em;">ThebeLab</span></button>
+                <button type="button" class="btn btn-secondary topbarbtn thebelab-launch-button" onclick="initThebelab()" title="Launch Thebelab"><i class="fas fa-rocket"></i><span style="margin-left: .4em;">ThebeLab</span></button>
                 {% endif %}
             </div>
         </div>
         {% endif %}
 
-        <!-- Extra buttons -->
-        {% if theme_use_edit_page_button and github_repo %}<a class="edit-button" href="{{ get_edit_url() }}"><button type="button" class="btn btn-secondary topbarbtn"><i class="fas fa-pencil-alt"></i><span class="topbar-button-text">Edit</span></button></a>{% endif %}
-
         {% endif %}
     </div>
     <div class="d-none d-md-block col-md-2 bd-toc {{ show_if_no_margin() }}">

From c2a10e7bbcc38b123778892786bbb51424fcd732 Mon Sep 17 00:00:00 2001
From: Chris Holdgraf <choldgraf@berkeley.edu>
Date: Mon, 27 Apr 2020 15:14:04 -0700
Subject: [PATCH 2/4] standardizing color

---
 sphinx_book_theme/static/sphinx-book-theme.css |  7 ++++++-
 .../static/sphinx-book-theme.scss              | 18 +++++++++++++++---
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/sphinx_book_theme/static/sphinx-book-theme.css b/sphinx_book_theme/static/sphinx-book-theme.css
index 48ad0588..81a43de8 100644
--- a/sphinx_book_theme/static/sphinx-book-theme.css
+++ b/sphinx_book_theme/static/sphinx-book-theme.css
@@ -281,6 +281,8 @@ button.topbarbtn img {
   right: 0;
   z-index: 999;
   transition: height .35s ease; }
+  .bd-toc div.onthispage, .bd-toc .toc-entry a {
+    color: #5a5a5a; }
   .bd-toc nav {
     opacity: 0;
     transition: opacity 0.2s ease; }
@@ -312,6 +314,8 @@ button.topbarbtn img {
   overflow-y: auto;
   height: 100vh !important;
   scrollbar-width: thin; }
+  .bd-sidebar nav ul.nav li a, .bd-sidebar nav ul.nav ul li a {
+    color: #5a5a5a; }
   .bd-sidebar nav ul.nav a:hover, .bd-sidebar nav ul.nav li.active > a, .bd-sidebar nav ul.nav li.active > a:hover {
     color: #0071bc; }
   .bd-sidebar::-webkit-scrollbar {
@@ -340,7 +344,8 @@ button.topbarbtn img {
   .bd-sidebar p.navbar_footer {
     text-align: center;
     font-size: .9em;
-    padding-top: .5em; }
+    padding-top: .5em;
+    color: #5a5a5a; }
   .bd-sidebar.collapsing {
     border: none;
     overflow: hidden;
diff --git a/sphinx_book_theme/static/sphinx-book-theme.scss b/sphinx_book_theme/static/sphinx-book-theme.scss
index 0137dd3e..cec84329 100644
--- a/sphinx_book_theme/static/sphinx-book-theme.scss
+++ b/sphinx_book_theme/static/sphinx-book-theme.scss
@@ -8,6 +8,9 @@ $breakpoint-lg: 992px;
 $breakpoint-md: 768px;
 $breakpoint-sm: 576px;
 
+// Colors
+$non-content-grey: #5a5a5a;
+
 /*********************************************
 * Whole page *
 *********************************************/
@@ -344,7 +347,7 @@ dl.footnote {
         button.topbarbtn {
             margin: 0 .1em;
             background-color: white;
-            color: #5a5a5a;
+            color: $non-content-grey;
             font-size: 1.4em;
             border: none;
             padding-top: .1rem;
@@ -381,7 +384,7 @@ div.dropdown-buttons-trigger {
             padding-bottom: .35rem;
             min-width: 120px !important;
             border: 1px white solid !important;
-            background-color: #5a5a5a;
+            background-color: $non-content-grey;
             color: white;
             font-size: 1em;
         }
@@ -406,7 +409,7 @@ button.topbarbtn img {
     position: relative;
     margin-right: 1em;
     margin-left: .5em;
-    color: #5a5a5a;
+    color: $non-content-grey;
 
     i {
         transition: opacity .3s, transform .3s;
@@ -476,6 +479,11 @@ button.topbarbtn img {
     z-index: 999;
     transition: height .35s ease;
 
+    // Colors
+    div.onthispage, .toc-entry a {
+        color: $non-content-grey;
+    }
+
     // By default the nav is hidden unless a few conditions are met
     nav {
         opacity: 0;
@@ -531,6 +539,9 @@ button.topbarbtn img {
 
     // Sidebar link color
     nav ul.nav {
+        li a, ul li a {
+            color: $non-content-grey;
+        }
         a:hover, li.active > a, li.active > a:hover {
             color: #0071bc;
         }
@@ -583,6 +594,7 @@ button.topbarbtn img {
         text-align: center;
         font-size: .9em;
         padding-top: .5em;
+        color: $non-content-grey;
     }
 
     &.collapsing {

From e3b5dfe6609d225c312b22ca29ddd27624f1e148 Mon Sep 17 00:00:00 2001
From: Chris Holdgraf <choldgraf@berkeley.edu>
Date: Mon, 27 Apr 2020 15:22:59 -0700
Subject: [PATCH 3/4] tweaks to labels

---
 sphinx_book_theme/static/sphinx-book-theme.css  | 10 +++++-----
 sphinx_book_theme/static/sphinx-book-theme.scss |  6 +++---
 sphinx_book_theme/topbar.html                   |  4 ++--
 3 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/sphinx_book_theme/static/sphinx-book-theme.css b/sphinx_book_theme/static/sphinx-book-theme.css
index 81a43de8..259c9a57 100644
--- a/sphinx_book_theme/static/sphinx-book-theme.css
+++ b/sphinx_book_theme/static/sphinx-book-theme.css
@@ -30,7 +30,7 @@ code {
     max-width: 100%; } }
 
 main.bd-content {
-  padding-top: 3.5em !important;
+  padding-top: 3em !important;
   padding-bottom: 0px !important; }
   main.bd-content.single-page {
     max-width: 1100px;
@@ -181,10 +181,10 @@ dl.footnote dd p {
 *********************************************/
 .topbar {
   margin: 0em auto 1em auto !important;
-  padding-top: .75em;
-  padding-bottom: .75em;
+  padding-top: .25em;
+  padding-bottom: .25em;
   background-color: white;
-  height: 3.5em;
+  height: 3em;
   transition: left .2s; }
   .topbar > div {
     height: 2.5em;
@@ -366,7 +366,7 @@ button.topbarbtn img {
 @media (max-width: 768px) {
   #site-navigation {
     position: fixed;
-    margin-top: 3.5em;
+    margin-top: 3em;
     z-index: 2000;
     background: white; } }
 
diff --git a/sphinx_book_theme/static/sphinx-book-theme.scss b/sphinx_book_theme/static/sphinx-book-theme.scss
index cec84329..ad43a65f 100644
--- a/sphinx_book_theme/static/sphinx-book-theme.scss
+++ b/sphinx_book_theme/static/sphinx-book-theme.scss
@@ -15,7 +15,7 @@ $non-content-grey: #5a5a5a;
 * Whole page *
 *********************************************/
 
-$topbar-height: 3.5em;
+$topbar-height: 3em;
 
 body {
     padding-top: 0px !important;
@@ -327,8 +327,8 @@ dl.footnote {
 *********************************************/
 .topbar {
     margin: 0em auto 1em auto !important;
-    padding-top: .75em;
-    padding-bottom: .75em;
+    padding-top: .25em;
+    padding-bottom: .25em;
     background-color: white;
     height: $topbar-height;
     transition: left .2s;
diff --git a/sphinx_book_theme/topbar.html b/sphinx_book_theme/topbar.html
index 42ef177f..1f3fe7e9 100644
--- a/sphinx_book_theme/topbar.html
+++ b/sphinx_book_theme/topbar.html
@@ -9,7 +9,7 @@
             <i class="fas fa-arrow-up"></i>
         </button>
         <div class="dropdown-buttons-trigger">
-            <button id="dropdown-buttons-trigger" class="btn btn-secondary topbarbtn" title="download this page"><i class="fas fa-download"></i></button>
+            <button id="dropdown-buttons-trigger" class="btn btn-secondary topbarbtn" title="Download this page"><i class="fas fa-download"></i></button>
 
             {% if page_source_suffix %}
             <div class="dropdown-buttons">
@@ -24,7 +24,7 @@
         </div>
 
         <!-- Edit this page -->
-        {% if theme_use_edit_page_button and github_repo %}<a class="edit-button" href="{{ get_edit_url() }}"><button type="button" class="btn btn-secondary topbarbtn" title="edit this page"><i class="fas fa-pencil-alt"></i></button></a>{% endif %}
+        {% if theme_use_edit_page_button and github_repo %}<a class="edit-button" href="{{ get_edit_url() }}"><button type="button" class="btn btn-secondary topbarbtn" title="Edit this page"><i class="fas fa-pencil-alt"></i></button></a>{% endif %}
 
         <!-- Launch buttons -->
         {% if binder_url or jupyterhub_url or use_thebelab %}

From 73336c2cb274d64a519ccb20c3c225a5e8796485 Mon Sep 17 00:00:00 2001
From: Chris Holdgraf <choldgraf@berkeley.edu>
Date: Mon, 27 Apr 2020 15:29:33 -0700
Subject: [PATCH 4/4] launch button CSS

---
 sphinx_book_theme/static/sphinx-book-theme.css  | 2 +-
 sphinx_book_theme/static/sphinx-book-theme.scss | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/sphinx_book_theme/static/sphinx-book-theme.css b/sphinx_book_theme/static/sphinx-book-theme.css
index 259c9a57..104181b0 100644
--- a/sphinx_book_theme/static/sphinx-book-theme.css
+++ b/sphinx_book_theme/static/sphinx-book-theme.css
@@ -189,7 +189,7 @@ dl.footnote dd p {
   .topbar > div {
     height: 2.5em;
     top: 0px; }
-  .topbar .topbar-main button.navbar-toggler, .topbar .topbar-main .dropdown-buttons-trigger {
+  .topbar .topbar-main > button, .topbar .topbar-main > div, .topbar .topbar-main > a {
     float: left;
     height: 100%; }
   .topbar .topbar-main button.topbarbtn {
diff --git a/sphinx_book_theme/static/sphinx-book-theme.scss b/sphinx_book_theme/static/sphinx-book-theme.scss
index ad43a65f..f6353d0a 100644
--- a/sphinx_book_theme/static/sphinx-book-theme.scss
+++ b/sphinx_book_theme/static/sphinx-book-theme.scss
@@ -339,7 +339,7 @@ dl.footnote {
     }
 
     .topbar-main {
-        button.navbar-toggler, .dropdown-buttons-trigger {
+        > button, > div, > a {
             float: left;
             height: 100%;
         }