From c0b07b1f45e35fde9ee60dafb5500867f5b4df5a Mon Sep 17 00:00:00 2001
From: Chris Holdgraf <choldgraf@berkeley.edu>
Date: Tue, 7 Feb 2023 13:06:48 +0100
Subject: [PATCH] NEW: Dropdown links in header

---
 docs/conf.py                                  | 19 ++++----
 docs/index.md                                 |  6 ---
 .../assets/styles/sections/_header.scss       |  9 +++-
 .../components/dropdown-links.html            | 44 +++++++++++++++++++
 .../components/navbar-first-level-links.html  |  1 +
 .../components/navbar-nav.html                |  3 +-
 .../theme/pydata_sphinx_theme/theme.conf      |  1 +
 7 files changed, 66 insertions(+), 17 deletions(-)
 create mode 100644 src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/dropdown-links.html
 create mode 100644 src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/navbar-first-level-links.html

diff --git a/docs/conf.py b/docs/conf.py
index 473c03a57..626c372ce 100644
--- a/docs/conf.py
+++ b/docs/conf.py
@@ -91,18 +91,19 @@
         version_match = "v" + release
 
 html_theme_options = {
-    "external_links": [
+    "dropdown_links": [
         {
-            "url": "https://pydata.org",
-            "name": "PyData",
-        },
-        {
-            "url": "https://numfocus.org/",
-            "name": "NumFocus",
+            "url": "https://github.com/pydata/pydata-sphinx-theme/releases",
+            "name": "Changelog",
         },
+        {"url": "examples/gallery", "name": "Gallery"},
         {
-            "url": "https://numfocus.org/donate",
-            "name": "Donate to NumFocus",
+            "name": "Community links",
+            "items": [
+                {"url": "https://pydata.org", "name": "PyData"},
+                {"url": "https://numfocus.org/", "name": "NumFocus"},
+                {"url": "https://numfocus.org/donate", "name": "Donate to NumFocus"},
+            ],
         },
     ],
     "github_url": "https://github.com/pydata/pydata-sphinx-theme",
diff --git a/docs/index.md b/docs/index.md
index f39c674ad..d084d6ebe 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -63,9 +63,3 @@ Several example pages to demonstrate the functionality of this theme when used a
 
 examples/index
 ```
-
-```{toctree}
-:hidden:
-
-Changelog <https://github.com/pydata/pydata-sphinx-theme/releases>
-```
diff --git a/src/pydata_sphinx_theme/assets/styles/sections/_header.scss b/src/pydata_sphinx_theme/assets/styles/sections/_header.scss
index 6f5ddddd7..ac049555e 100644
--- a/src/pydata_sphinx_theme/assets/styles/sections/_header.scss
+++ b/src/pydata_sphinx_theme/assets/styles/sections/_header.scss
@@ -90,10 +90,17 @@
 
     // Dropdowns for the extra links
     .dropdown {
-      button {
+      // The button that people click on
+      > button {
         display: unset;
         color: var(--pst-color-text-muted);
         border: none;
+
+        &:hover,
+        &:active,
+        &:focus {
+          color: var(--pst-color-primary);
+        }
       }
 
       .dropdown-menu {
diff --git a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/dropdown-links.html b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/dropdown-links.html
new file mode 100644
index 000000000..546107610
--- /dev/null
+++ b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/dropdown-links.html
@@ -0,0 +1,44 @@
+{# One or more extra links and dropdown links with Bootstrap -#}
+
+{# A macro so we can save some boilerplate #}
+{%- macro dropdown_link(name, url, tooltip_placement="left") -%}
+
+{#- Parse the URL to determine if it is an internal document link or a URI #}
+{% if not url.startswith("http") %}
+{% set url=pathto(url) %}
+{% set extra_classes="" %}
+{% else %}
+{% set extra_classes=" nav-external" %}
+{% endif -%}
+
+<a class="nav-link{{ extra_classes }}" href="{{ url }}" data-bs-toggle="tooltip" data-bs-placement="{{ tooltip_placement }}" aria-label="{{ name }}">
+  {{ name }}
+</a>
+{%- endmacro %}
+
+{% if theme_dropdown_links %}
+{% for dropdown in theme_dropdown_links %}
+
+  {#- If "items" is in the list item then it is a dropdown with a collection of links #}
+  {% if "items" in dropdown %}
+  <div class="nav-item dropdown">
+    <button class="btn dropdown-toggle nav-item" type="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+        {{ dropdown["name"] }}
+    </button>
+    <div class="dropdown-menu">
+    {% for link in dropdown["items"] %}
+    <li class="nav-item">
+      {{ dropdown_link(link["name"], link["url"])}}
+    </li>
+    {% endfor %}
+    </div>
+  </div>
+
+  {% else %}
+  {# Otherwise assume it is just an extra link, not a dropdown -#}
+  <li class="nav-item">
+    {{ dropdown_link(dropdown["name"], dropdown["url"])}}
+  </li>
+  {% endif %}
+{% endfor %}
+{% endif %}
diff --git a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/navbar-first-level-links.html b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/navbar-first-level-links.html
new file mode 100644
index 000000000..67dc356ec
--- /dev/null
+++ b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/navbar-first-level-links.html
@@ -0,0 +1 @@
+{{ generate_header_nav_html(n_links_before_dropdown=theme_header_links_before_dropdown) }}
diff --git a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/navbar-nav.html b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/navbar-nav.html
index 119bc57e0..c387ed1ea 100644
--- a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/navbar-nav.html
+++ b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/navbar-nav.html
@@ -6,6 +6,7 @@
     {{ _("Site Navigation") }}
   </p>
   <ul id="navbar-main-elements" class="navbar-nav">
-    {{ generate_header_nav_html(n_links_before_dropdown=theme_header_links_before_dropdown) }}
+    {% include "components/navbar-first-level-links.html" %}
+    {% include "components/dropdown-links.html" %}
   </ul>
 </nav>
diff --git a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/theme.conf b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/theme.conf
index 0df9b3f5e..c65ddd87a 100644
--- a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/theme.conf
+++ b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/theme.conf
@@ -11,6 +11,7 @@ sidebarwidth = 270
 sidebar_includehidden = True
 use_edit_page_button = False
 external_links =
+dropdown_links =
 bitbucket_url =
 github_url =
 gitlab_url =