From 2a561b14637e4eff8d3b83c332cef579e7a9f1b5 Mon Sep 17 00:00:00 2001
From: Deborah Barnard <deborah@deborahwrites.com>
Date: Fri, 8 Aug 2025 14:16:44 +0100
Subject: [PATCH] From Kapa feedback: restore site search, remove Kapa search,
 move button (#3459)

---
 _overrides/main.html                       |  1 -
 _overrides/partials/header.html            | 29 +++++++++++++++++++---
 _overrides/partials/nav.html               | 13 +---------
 docs/_extra/css/extra.css                  | 13 +++-------
 docs/_extra/javascript/init_kapa_widget.js |  3 ---
 mkdocs.yml                                 |  1 +
 6 files changed, 32 insertions(+), 28 deletions(-)

diff --git a/_overrides/main.html b/_overrides/main.html
index 58f3eb736..9f6f65db1 100644
--- a/_overrides/main.html
+++ b/_overrides/main.html
@@ -47,7 +47,6 @@ https://plausible.io/docs/script-extensions?ref=ryansechrest.com#all-our-script-
 {% endblock %}
 
 
-
 {% block container %}
 
 <!-- Google Tag Manager (noscript) -->
diff --git a/_overrides/partials/header.html b/_overrides/partials/header.html
index 3a91d0a88..e248bb812 100644
--- a/_overrides/partials/header.html
+++ b/_overrides/partials/header.html
@@ -113,9 +113,32 @@
       </div>
     {% endif %}
 
-    <!-- n8n CUSTOM: fully remove search from header. It should be 
-    disabled due to config, but making sure. 
-    -->
+  	<!-- n8n CUSTOM: Kapa -->
+	<button
+		class="n8n-kapa-button"
+		onclick="window.Kapa.open({ 
+		mode: 'ai'
+		})" 
+		type="button"
+	>
+		<span class="md-search__icon md-icon">{% set icon = "material/creation" %}{% include ".icons/" ~ icon ~ ".svg" %}</span><span class="n8n-search-text">Chat with the docs</span>
+	</button>
+
+  <!-- Button to open search modal -->
+    {% if "material/search" in config.plugins %}
+      {% set search = config.plugins["material/search"] | attr("config") %}
+
+      <!-- Check if search is actually enabled - see https://t.ly/DT_0V -->
+      {% if search.enabled %}
+        <label class="md-header__button md-icon" for="__search">
+          {% set icon = config.theme.icon.search or "material/magnify" %}
+          {% include ".icons/" ~ icon ~ ".svg" %}
+        </label>
+
+        <!-- Search interface -->
+        {% include "partials/search.html" %}
+      {% endif %}
+    {% endif %}
 
     <!-- Repository information -->
 	  <!-- n8n CUSTOM: don't show GitHub link -->
diff --git a/_overrides/partials/nav.html b/_overrides/partials/nav.html
index 69d2d9e55..2de8f1151 100644
--- a/_overrides/partials/nav.html
+++ b/_overrides/partials/nav.html
@@ -53,21 +53,10 @@
   </label>
 
   <!-- n8n CUSTOM: don't show repo link -->
-  <!-- Repository information -->
-
+  
 
   <!-- Navigation list -->
   <ul class="md-nav__list" data-md-scrollfix>
-    <!-- n8n CUSTOM: replace search with Kapa -->
-    <button
-        class="n8n-kapa-button"
-        onclick="window.Kapa.open({ 
-        mode: 'ai'
-        })" 
-        type="button"
-    >
-        <span class="md-search__icon md-icon">{% set icon = "material/magnify" %}{% include ".icons/" ~ icon ~ ".svg" %}</span><span class="n8n-search-text">Search with AI</span>
-    </button>
     {% for nav_item in nav %}
       {% set path = "__nav_" ~ loop.index %}
       {{ item.render(nav_item, path, 1) }}
diff --git a/docs/_extra/css/extra.css b/docs/_extra/css/extra.css
index 7bbe1730a..2afa04925 100644
--- a/docs/_extra/css/extra.css
+++ b/docs/_extra/css/extra.css
@@ -147,14 +147,15 @@
   /* Button to open Kapa search */
 
   .n8n-kapa-button {
-    background: var(--color-background-dark);
+    background: var(--color-primary);
     border-radius: .1rem;
     color: white;
     cursor: pointer;
     display: flex;
     flex-direction: row;
-    margin-bottom: 1.75em;
-    padding: 0.5em 0.6em;
+    font-size: 1.4em;
+    margin-right: 2em;
+    padding: 0.5em 0.75em;
   }
 
   .n8n-search-text {
@@ -306,12 +307,6 @@
 	}
 }
 
-@media screen and (max-width: 1220px) {
- .n8n-kapa-button {
-  margin: 1em;
- }
-}
-
 
   /* dark mode */  
   /* [data-md-color-scheme="dark"] .md-header{
diff --git a/docs/_extra/javascript/init_kapa_widget.js b/docs/_extra/javascript/init_kapa_widget.js
index ca1f8d474..4f5b06010 100644
--- a/docs/_extra/javascript/init_kapa_widget.js
+++ b/docs/_extra/javascript/init_kapa_widget.js
@@ -7,9 +7,6 @@ document.addEventListener("DOMContentLoaded", function () {
   script.setAttribute("data-project-name", "n8n");
   script.setAttribute("data-project-color", "#EA4B71");
   script.setAttribute("data-project-logo", "/_images/assets/n8n-icon-kapa-modal.png");
-  // Enable non-AI search https://docs.kapa.ai/integrations/website-widget/search
-  script.setAttribute("data-search-mode-enabled", true);
-  script.setAttribute("data-search-include-source-names", '["Documentation"]')
   // Hide the Kapa widget
   script.setAttribute("data-button-hide", true);
   // MkDocs tries to squeeze the modal
diff --git a/mkdocs.yml b/mkdocs.yml
index 73d47d471..ae9308aca 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -156,6 +156,7 @@ plugins:
   # But DO NOT ENABLE IT NORMALLY
   # It causes Netlify builds to fail
   # - info
+  - search
   - exclude:
       glob:
        # - integrations/builtin/*