From 52b8f9bdefec4bb3735a67d939221bc93ba962af Mon Sep 17 00:00:00 2001
From: hungdinh82 <hungngohihihi@gmail.com>
Date: Thu, 20 Feb 2025 15:13:54 +0700
Subject: [PATCH 1/2] Fix responsive layout for DocSearch-Button in different
 screen sizes

---
 src/css/custom.css | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/css/custom.css b/src/css/custom.css
index 01e3793c7..45c0992b2 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -127,7 +127,10 @@ html {
       @media (min-width: 997px) {
         @apply w-auto justify-between;
       }
-      @media (max-width: 996px) {
+      @media (min-width: 769px) and (max-width: 996px) {
+        @apply w-[80%] mr-7;
+      }
+      @media (max-width: 768px) {
         @apply mr-7;
       }
       .DocSearch-Search-Icon {
@@ -137,7 +140,7 @@ html {
         @apply hidden;
       }
       .DocSearch-Button-Placeholder {
-        @apply pr-10;
+        @apply pr-6 mr-5 ml-2; 
       }
     }
 

From 2231b72ac11168960a02641a2f1f123e2df25c6d Mon Sep 17 00:00:00 2001
From: hungdinh82 <hungngohihihi@gmail.com>
Date: Thu, 20 Feb 2025 15:36:51 +0700
Subject: [PATCH 2/2] Update transition to make it smoother

---
 src/css/custom.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/css/custom.css b/src/css/custom.css
index 45c0992b2..4744d1d4f 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -124,6 +124,7 @@ html {
     }
     &-Button {
       @apply text-inactive rounded-sm h-8 w-8 bg-card justify-center mr-3;
+      @apply transition-all duration-300 ease-in-out;
       @media (min-width: 997px) {
         @apply w-auto justify-between;
       }