From 47b754fe9b1b6e734ddf7a11fc1f4fa95eb31fa1 Mon Sep 17 00:00:00 2001
From: Charlotte Wickham <cwickham@gmail.com>
Date: Tue, 29 Sep 2026 08:35:08 -0700
Subject: [PATCH] Move "Choose your tool" out of the tools-tabset tablist

---
 filters/tools-tabset.lua | 14 +++++++++-----
 styles.css               |  8 +++++++-
 2 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/filters/tools-tabset.lua b/filters/tools-tabset.lua
index 020dfa2beb..a31bed6a33 100644
--- a/filters/tools-tabset.lua
+++ b/filters/tools-tabset.lua
@@ -13,13 +13,17 @@ local function injectChooseYourTool()
     injected = true
     quarto.doc.include_text('after-body', [[
       <script type="text/javascript">
-        for (const navTab of document.querySelectorAll(".panel-tabset[data-group='tools-tabset'] ul")) {
-          const choose = document.createElement("h3");
-          choose.classList.add("no-anchor");
+        for (const navTab of document.querySelectorAll(".panel-tabset[data-group='tools-tabset'] ul[role='tablist']")) {
+          navTab.setAttribute("aria-label", "Choose your tool");
+          const row = document.createElement("div");
+          row.classList.add("choose-your-tool-row");
+          const choose = document.createElement("p");
           choose.classList.add("choose-your-tool");
+          choose.setAttribute("aria-hidden", "true");
           choose.innerText = "Choose your tool";
-          navTab.prepend(choose);
-        }       
+          navTab.before(row);
+          row.append(choose, navTab);
+        }
       </script>
     ]])
   end
diff --git a/styles.css b/styles.css
index cdfb0ce630..9adbcf1157 100644
--- a/styles.css
+++ b/styles.css
@@ -266,14 +266,20 @@ iframe.reveal-demo {
   border: none;
 }
 
+.panel-tabset[data-group="tools-tabset"] .choose-your-tool-row {
+  display: flex;
+  flex-wrap: wrap;
+}
+
 .panel-tabset[data-group="tools-tabset"] .choose-your-tool {
   max-width: 90px;
   margin-right: 25px;
   margin-top: 30px;
+  margin-bottom: 0.5rem;
   font-weight: 300;
   font-size: 1.3rem;
+  line-height: 1.2;
   text-align: left;
-  vertical-align: center;
 }
 
 .panel-tabset[data-group="tools-tabset"] .tab-content {