From 41b7b1d35a887472d8b06409a1f4431d6ccc7851 Mon Sep 17 00:00:00 2001
From: Azvya Erstevan <azvyaerstevan@gmail.com>
Date: Thu, 10 Oct 2024 23:59:36 +0700
Subject: [PATCH 1/2] Fix inconsistent focus

---
 src/app/stories/components.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/app/stories/components.tsx b/src/app/stories/components.tsx
index e21443c..b6c76ff 100644
--- a/src/app/stories/components.tsx
+++ b/src/app/stories/components.tsx
@@ -255,7 +255,11 @@ function FilteringHandler({
         data-item="search-button"
         onClick={() => {
           setShowSearch((cur) => {
-            input.current?.focus();
+            if (!cur) {
+              input.current?.focus();
+            } else {
+              input.current?.blur();
+            }
             if (cur && !input.current?.value && search) {
               router.push('/stories');
               router.refresh();

From 7a517efc5209c34a932a249ea76d8976d4b1e213 Mon Sep 17 00:00:00 2001
From: Azvya Erstevan <azvyaerstevan@gmail.com>
Date: Thu, 10 Oct 2024 23:59:39 +0700
Subject: [PATCH 2/2] Fix footer layout

---
 src/components/footer/autobacklink.tsx | 8 ++++----
 src/components/footer/footer.tsx       | 6 ++++--
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/components/footer/autobacklink.tsx b/src/components/footer/autobacklink.tsx
index 7bf9745..5fab728 100644
--- a/src/components/footer/autobacklink.tsx
+++ b/src/components/footer/autobacklink.tsx
@@ -27,9 +27,9 @@ function AutoBacklinks() {
       .map((_, i) => (
         <div
           key={i}
-          className={`w-fit flex gap-2 whitespace-nowrap items-center font-medium transition-colors rounded text-[#5a685d] dark:text-light py-1 relative`}
+          className={`w-fit flex gap-1 whitespace-nowrap items-center font-medium transition-colors rounded text-[#5a685d] dark:text-light py-1 relative`}
         >
-          <div className="flex relative items-center h-full gap-2">
+          <div className="flex relative items-center h-full gap-1">
             <span
               style={{
                 width: 64 + (i % 2 === 0 ? i : i * 16),
@@ -49,10 +49,10 @@ function AutoBacklinks() {
       href={item.url}
       target="_blank"
       rel="noopener noreferrer"
-      className={`w-fit flex gap-2 whitespace-nowrap font-medium transition-colors rounded group text-[#5a685d] dark:text-light py-1 relative`}
+      className={`w-fit flex gap-1 whitespace-nowrap font-medium transition-colors rounded group text-[#5a685d] dark:text-light py-1 relative`}
       title={`Visit ${item.label}`}
     >
-      <div className="flex relative items-center gap-2">
+      <div className="flex relative items-center gap-1">
         {item.label}
         <span className="border-b-2 group-hover:w-full w-0 transition-[width] absolute bottom-0"></span>
       </div>
diff --git a/src/components/footer/footer.tsx b/src/components/footer/footer.tsx
index 33b3389..374f9f0 100644
--- a/src/components/footer/footer.tsx
+++ b/src/components/footer/footer.tsx
@@ -21,7 +21,9 @@ function Footer() {
           className="justify-center flex-col items-start text-base flex"
         >
           <h6 className="font-extrabold text-lg mb-2">Links</h6>
-          <MainLinks />
+          <div className="grid gap-1">
+            <MainLinks />
+          </div>
         </div>
         <div
           data-item="social-links"
@@ -37,7 +39,7 @@ function Footer() {
           <h6 className="font-extrabold text-lg mb-2 flex gap-2 items-center">
             Check Also <HiExternalLink />
           </h6>
-          <div className="flex-wrap gap-2 items-start text-base flex">
+          <div className="flex-wrap gap-1 items-start text-base flex">
             <AutoBacklinks />
           </div>
         </div>