diff --git a/docs/my-website/docusaurus.config.js b/docs/my-website/docusaurus.config.js
index d0d30495e..8ede990b1 100644
--- a/docs/my-website/docusaurus.config.js
+++ b/docs/my-website/docusaurus.config.js
@@ -48,6 +48,7 @@ const config = {
           { name: "Providers", pattern: "/docs/providers/**" },
           { name: "Proxy", pattern: "/docs/proxy/**" }
         ],
+        indexOnly: true,
       },
     ],
   ],
diff --git a/docs/my-website/src/theme/SearchBar.js b/docs/my-website/src/theme/SearchBar.js
new file mode 100644
index 000000000..0d6f1abf2
--- /dev/null
+++ b/docs/my-website/src/theme/SearchBar.js
@@ -0,0 +1,78 @@
+import React from "react";
+import SearchBar from "@theme-original/SearchBar";
+
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+import { usePluginData } from "@docusaurus/useGlobalData";
+
+export default function SearchBarWrapper(props) {
+  const { siteConfig } = useDocusaurusContext();
+  const { options } = usePluginData("docusaurus-theme-search-pagefind");
+
+  const [path, setPath] = React.useState("");
+  const [loaded, setLoaded] = React.useState(false);
+
+  React.useEffect(() => {
+    setPath(`${siteConfig.baseUrl}pagefind/pagefind.js`);
+  }, [siteConfig]);
+
+  React.useEffect(() => {
+    Promise.all([
+      import("@getcanary/web/components/canary-root"),
+      import("@getcanary/web/components/canary-provider-pagefind"),
+      import("@getcanary/web/components/canary-modal"),
+      import("@getcanary/web/components/canary-trigger-logo"),
+      import("@getcanary/web/components/canary-content"),
+      import("@getcanary/web/components/canary-search"),
+      import("@getcanary/web/components/canary-search-input"),
+      import("@getcanary/web/components/canary-search-results-tabs"),
+    ])
+      .then(() => setLoaded(true))
+      .catch(console.error);
+  }, []);
+
+  return (
+    <div
+      style={{
+        display: "flex",
+        flexDirection: "row",
+        alignItems: "center",
+        gap: "6px",
+      }}
+    >
+      {!loaded || !path ? (
+        <button
+          style={{
+            fontSize: "2rem",
+            backgroundColor: "transparent",
+            border: "none",
+            outline: "none",
+            padding: "0",
+            marginRight: "6px",
+          }}
+        >
+          🐤
+        </button>
+      ) : (
+        <canary-root framework="docusaurus">
+          <canary-provider-pagefind options={JSON.stringify(options)}>
+            <canary-modal>
+              <canary-trigger-logo slot="trigger"></canary-trigger-logo>
+              <canary-content slot="content">
+                <canary-search slot="mode">
+                  <canary-search-input slot="input"></canary-search-input>
+                  <canary-search-results-tabs
+                    slot="body"
+                    tabs={JSON.stringify(options.tabs)}
+                    group
+                  ></canary-search-results-tabs>
+                </canary-search>
+              </canary-content>
+            </canary-modal>
+          </canary-provider-pagefind>
+        </canary-root>
+      )}
+
+      <SearchBar {...props} />
+    </div>
+  );
+}
\ No newline at end of file
diff --git a/docs/my-website/src/theme/SearchBar/Canary.jsx b/docs/my-website/src/theme/SearchBar/Canary.jsx
deleted file mode 100644
index 19f361f21..000000000
--- a/docs/my-website/src/theme/SearchBar/Canary.jsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from "react";
-
-export default function Canary({ options }) {
-  const [loaded, setLoaded] = React.useState(false);
-
-  React.useEffect(() => {
-    Promise.all([
-      import("@getcanary/web/components/canary-root"),
-      import("@getcanary/web/components/canary-provider-pagefind"),
-      import("@getcanary/web/components/canary-modal"),
-      import("@getcanary/web/components/canary-trigger-logo"),
-      import("@getcanary/web/components/canary-content"),
-      import("@getcanary/web/components/canary-search"),
-      import("@getcanary/web/components/canary-search-input"),
-      import("@getcanary/web/components/canary-search-results-tabs"),
-    ])
-      .then(() => setLoaded(true))
-      .catch((e) =>
-        console.error("Maybe you forgot to install '@getcanary/web'?", e),
-      );
-  }, []);
-
-  if (!loaded) {
-    return null;
-  }
-
-  return (
-    <canary-root framework="docusaurus">
-      <canary-provider-pagefind options={JSON.stringify(options)}>
-        <canary-modal>
-          <canary-trigger-logo slot="trigger"></canary-trigger-logo>
-          <canary-content slot="content">
-            <canary-search slot="mode">
-              <canary-search-input slot="input"></canary-search-input>
-              <canary-search-results-tabs
-                slot="body"
-                tabs={JSON.stringify(options.tabs)}
-                group
-              ></canary-search-results-tabs>
-            </canary-search>
-          </canary-content>
-        </canary-modal>
-      </canary-provider-pagefind>
-    </canary-root>
-  );
-}
diff --git a/docs/my-website/src/theme/SearchBar/index.jsx b/docs/my-website/src/theme/SearchBar/index.jsx
deleted file mode 100644
index 96509557d..000000000
--- a/docs/my-website/src/theme/SearchBar/index.jsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import React from "react";
-
-import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
-import { usePluginData } from "@docusaurus/useGlobalData";
-
-import Canary from "./Canary";
-
-export default function Index() {
-  const { siteConfig } = useDocusaurusContext();
-  const [path, setPath] = React.useState("");
-
-  React.useEffect(() => {
-    setPath(`${siteConfig.baseUrl}pagefind/pagefind.js`);
-  }, [siteConfig]);
-
-  const { options } = usePluginData("docusaurus-theme-search-pagefind");
-  const { styles, ...rest } = options;
-
-  React.useEffect(() => {
-    if (options.styles) {
-      Object.entries(options.styles).forEach(([key, value]) => {
-        document.body.style.setProperty(key, value);
-      });
-    }
-  }, [options]);
-
-  if (!path) {
-    return null;
-  }
-
-  return <Canary options={{ ...rest, path: path }} />;
-}