From 59bf69cf843797582898344a3e7da88615d9cd32 Mon Sep 17 00:00:00 2001
From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com>
Date: Thu, 13 Oct 2022 00:52:48 +0530
Subject: [PATCH 1/3] Update Search.js

---
 src/components/Search.js | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/components/Search.js b/src/components/Search.js
index 84b36534..2d9aa84f 100644
--- a/src/components/Search.js
+++ b/src/components/Search.js
@@ -1,10 +1,10 @@
 import { DocSearchModal, useDocSearchKeyboardEvents } from '@docsearch/react'
-import { SearchIcon } from '@heroicons/react/outline'
 import Head from 'next/head'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { useCallback, useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
+import SearchIcon from '@/components/icons/SearchIcon'
 
 const ACTION_KEY_DEFAULT = ['Ctrl ', 'Control']
 const ACTION_KEY_APPLE = ['⌘', 'Command']
@@ -69,16 +69,19 @@ export function Search() {
         type="button"
         ref={searchButtonRef}
         onClick={onOpen}
-        className="group flex w-full items-center space-x-3 rounded-md border-2 border-gray-200 bg-gray-100 py-1.5 px-1.5 font-medium leading-6 text-gray-500 hover:text-gray-600 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 sm:space-x-4 sm:px-4 lg:px-4"
+        className="group flex w-full items-center justify-between rounded-full border-2 border-gray-200 py-1.5 px-1.5 font-medium leading-6 text-gray-500 shadow-inner hover:text-gray-600 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 sm:space-x-4 sm:rounded-md sm:px-4 lg:px-4"
       >
-        <SearchIcon className="h-6 w-6 text-blue-400 transition-colors duration-200 group-hover:text-blue-500" />
-        <span>
-          <span className="md:hidden lg:hidden">Search</span>
-          <span className="hidden sm:inline">Quick search for anything</span>
-        </span>
+        <div className="flex items-center justify-start">
+          <SearchIcon className="h-6 w-6 text-blue-400 transition-colors duration-200 group-hover:text-blue-500" />
+          <span className={router.pathname === '/' ? 'sm:ml-2' : 'ml-2'}>
+            <span className="sm:hidden lg:hidden">{router.pathname === '/' ? '' : 'Search'}</span>
+            <span className="hidden sm:inline">Quick search for anything</span>
+          </span>
+        </div>
+
         <span
           style={{ opacity: browserDetected ? '1' : '0' }}
-          className="hidden rounded-md border border-gray-400 py-0.5 px-1.5 text-sm leading-5 text-gray-500 sm:block"
+          className="hidden  justify-end rounded-md border border-gray-400 py-0.5 px-1.5 text-sm leading-5 text-gray-500 sm:block"
         >
           <span className="sr-only">Press </span>
           <kbd className="font-sans">
@@ -107,6 +110,7 @@ export function Search() {
               },
             }}
             hitComponent={Hit}
+            hitsPerPage={10}
             transformItems={(items) => {
               return items.map((item) => {
                 // We transform the absolute URL into a relative URL to

From 8a93149b74eb26d0777b199b82f568d9deb910e3 Mon Sep 17 00:00:00 2001
From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com>
Date: Thu, 13 Oct 2022 00:52:50 +0530
Subject: [PATCH 2/3] Create SearchIcon.js

---
 src/components/icons/SearchIcon.js | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)
 create mode 100644 src/components/icons/SearchIcon.js

diff --git a/src/components/icons/SearchIcon.js b/src/components/icons/SearchIcon.js
new file mode 100644
index 00000000..eca7ee5b
--- /dev/null
+++ b/src/components/icons/SearchIcon.js
@@ -0,0 +1,17 @@
+export default function SearchIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...props}
+    >
+      <circle cx="11" cy="11" r="8"></circle>
+      <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
+    </svg>
+  )
+}

From 8c8f9ccab41888042834b417f7c1207ae91864c5 Mon Sep 17 00:00:00 2001
From: Arghya Ghosh <71373838+uiuxarghya@users.noreply.github.com>
Date: Thu, 13 Oct 2022 00:52:53 +0530
Subject: [PATCH 3/3] Update docsearch.css

---
 src/css/docsearch.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/css/docsearch.css b/src/css/docsearch.css
index c55cca07..d670e9e1 100644
--- a/src/css/docsearch.css
+++ b/src/css/docsearch.css
@@ -91,7 +91,7 @@
   flex: none;
   width: 1.5rem;
   height: 1.5rem;
-  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 21L15 15M17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
+  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTExIDE5QzE1LjQxODMgMTkgMTkgMTUuNDE4MyAxOSAxMUMxOSA2LjU4MTcyIDE1LjQxODMgMyAxMSAzQzYuNTgxNzIgMyAzIDYuNTgxNzIgMyAxMUMzIDE1LjQxODMgNi41ODE3MiAxOSAxMSAxOVoiIHN0cm9rZT0iIzM4ODRGRiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTIxIDIxTDE2LjY1IDE2LjY1IiBzdHJva2U9IiMzODg0RkYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
   background-size: 100%;
 }