From af1e57d5c4975f5f8a2630675c729dde8902be63 Mon Sep 17 00:00:00 2001
From: JimmyLv <jimmy.jinglv@gmail.com>
Date: Sun, 5 Mar 2023 17:58:58 +0800
Subject: [PATCH] fix: polish mobile header

---
 components/Header.tsx | 17 +++++++++++++----
 components/SignIn.tsx |  2 +-
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/components/Header.tsx b/components/Header.tsx
index 51e47663..04b7567b 100644
--- a/components/Header.tsx
+++ b/components/Header.tsx
@@ -31,7 +31,7 @@ export default function Header() {
           </h2>
         </a>
       </div>
-      <div className="flex items-center space-x-5">
+      <div className="flex items-center space-x-2 sm:space-x-5">
         <div
           id="tooltip-light"
           role="tooltip"
@@ -48,7 +48,8 @@ export default function Header() {
           target="_blank"
           className="flex items-center space-x-2"
         >
-          🔥 <span className="hidden sm:block">给我提</span>反馈？
+          🔥 <span className="hidden sm:block">给我提</span>反馈
+          <span className="hidden sm:block">？</span>
         </a>
         <a
           href={BASE_DOMAIN + "/ios"}
@@ -56,8 +57,16 @@ export default function Header() {
           target="_blank"
           className="flex items-center space-x-2"
         >
-          <Image src="/shortcuts.png" alt="logo" width={33} height={33} />
-          <span className="relin-paragraph-target text-slate-500 hidden sm:block">(iOS版)</span>
+          <Image
+            src="/shortcuts.png"
+            alt="logo"
+            width={33}
+            height={33}
+            className="max-w-none"
+          />
+          <span className="relin-paragraph-target hidden text-slate-500 sm:block">
+            (iOS版)
+          </span>
         </a>
         <a
           href="https://github.com/JimmyLv/BiliGPT"
diff --git a/components/SignIn.tsx b/components/SignIn.tsx
index 754de1b7..37336b6c 100644
--- a/components/SignIn.tsx
+++ b/components/SignIn.tsx
@@ -24,7 +24,7 @@ export default function SignIn() {
           <UserDropdown />
         ) : (
           <motion.button
-            className="rounded-full border border-black bg-black p-1.5 px-4 text-sm text-white transition-all hover:bg-white hover:text-black"
+            className="rounded-full border border-black bg-black p-1.5 px-1 text-sm text-white transition-all hover:bg-white hover:text-black md:px-4"
             onClick={() => setShowSignInModal(true)}
             {...FADE_IN_ANIMATION_SETTINGS}
           >