From be3ec77e1187925abc16ec1b876d2dd4d89da04f Mon Sep 17 00:00:00 2001
From: ReaJason <reajason1225@gmail.com>
Date: Mon, 26 May 2025 01:37:13 +0800
Subject: [PATCH] fix(ui): show one column in phone

---
 web/src/components/tools/antsword-tab.tsx |  8 ++++----
 web/src/components/tools/behinder-tab.tsx |  8 ++++----
 web/src/components/tools/custom-tab.tsx   |  2 +-
 web/src/components/tools/godzilla-tab.tsx | 12 ++++++------
 web/src/components/tools/neoreg-tab.tsx   |  8 ++++----
 web/src/components/tools/suo5-tab.tsx     |  8 ++++----
 6 files changed, 23 insertions(+), 23 deletions(-)

diff --git a/web/src/components/tools/antsword-tab.tsx b/web/src/components/tools/antsword-tab.tsx
index 04ea3f37..4be6b165 100644
--- a/web/src/components/tools/antsword-tab.tsx
+++ b/web/src/components/tools/antsword-tab.tsx
@@ -19,7 +19,7 @@ export function AntSwordTabContent({
       <TabsContent value="AntSword">
         <Card>
           <CardContent className="space-y-2 mt-4">
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <ShellTypeFormField form={form} shellTypes={shellTypes} />
               <UrlPatternFormField form={form} />
             </div>
@@ -35,14 +35,14 @@ export function AntSwordTabContent({
                 </FormItem>
               )}
             />
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <FormField
                 control={form.control}
                 name="headerName"
                 render={({ field }) => (
                   <FormItem className="gap-1">
                     <FormLabel className="h-6 flex items-center gap-1">{t("shellToolConfig.headerName")}</FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerName")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
@@ -54,7 +54,7 @@ export function AntSwordTabContent({
                     <FormLabel className="h-6 flex items-center gap-1">
                       {t("shellToolConfig.headerValue")} {t("optional")}
                     </FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerValue")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
diff --git a/web/src/components/tools/behinder-tab.tsx b/web/src/components/tools/behinder-tab.tsx
index 88fc8fde..cd7f71c6 100644
--- a/web/src/components/tools/behinder-tab.tsx
+++ b/web/src/components/tools/behinder-tab.tsx
@@ -19,7 +19,7 @@ export function BehinderTabContent({
       <TabsContent value="Behinder">
         <Card>
           <CardContent className="space-y-2 mt-4">
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <ShellTypeFormField form={form} shellTypes={shellTypes} />
               <UrlPatternFormField form={form} />
             </div>
@@ -35,14 +35,14 @@ export function BehinderTabContent({
                 </FormItem>
               )}
             />
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <FormField
                 control={form.control}
                 name="headerName"
                 render={({ field }) => (
                   <FormItem className="gap-1">
                     <FormLabel className="h-6 flex items-center gap-1">{t("shellToolConfig.headerName")}</FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerName")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
@@ -54,7 +54,7 @@ export function BehinderTabContent({
                     <FormLabel className="h-6 flex items-center gap-1">
                       {t("shellToolConfig.headerValue")} {t("optional")}
                     </FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerValue")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
diff --git a/web/src/components/tools/custom-tab.tsx b/web/src/components/tools/custom-tab.tsx
index df7b4efa..86c5180c 100644
--- a/web/src/components/tools/custom-tab.tsx
+++ b/web/src/components/tools/custom-tab.tsx
@@ -24,7 +24,7 @@ export default function CustomTabContent({
       <TabsContent value="Custom">
         <Card>
           <CardContent className="space-y-2 mt-4">
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <ShellTypeFormField form={form} shellTypes={shellTypes} />
               <UrlPatternFormField form={form} />
             </div>
diff --git a/web/src/components/tools/godzilla-tab.tsx b/web/src/components/tools/godzilla-tab.tsx
index b27cb844..9152d97b 100644
--- a/web/src/components/tools/godzilla-tab.tsx
+++ b/web/src/components/tools/godzilla-tab.tsx
@@ -19,11 +19,11 @@ export function GodzillaTabContent({
       <TabsContent value="Godzilla">
         <Card>
           <CardContent className="space-y-2 mt-4">
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <ShellTypeFormField form={form} shellTypes={shellTypes} />
               <UrlPatternFormField form={form} />
             </div>
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <FormField
                 control={form.control}
                 name="godzillaPass"
@@ -32,7 +32,7 @@ export function GodzillaTabContent({
                     <FormLabel className="h-6 flex items-center gap-1">
                       {t("shellToolConfig.pass")} {t("optional")}
                     </FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.pass")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
@@ -44,7 +44,7 @@ export function GodzillaTabContent({
                     <FormLabel className="h-6 flex items-center gap-1">
                       {t("shellToolConfig.key")} {t("optional")}
                     </FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.key")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
@@ -54,7 +54,7 @@ export function GodzillaTabContent({
                 render={({ field }) => (
                   <FormItem className="gap-1">
                     <FormLabel className="h-6 flex items-center gap-1">{t("shellToolConfig.headerName")}</FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerName")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
@@ -66,7 +66,7 @@ export function GodzillaTabContent({
                     <FormLabel className="h-6 flex items-center gap-1">
                       {t("shellToolConfig.headerValue")} {t("optional")}
                     </FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerValue")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
diff --git a/web/src/components/tools/neoreg-tab.tsx b/web/src/components/tools/neoreg-tab.tsx
index 351f68f3..e95467d4 100644
--- a/web/src/components/tools/neoreg-tab.tsx
+++ b/web/src/components/tools/neoreg-tab.tsx
@@ -19,18 +19,18 @@ export function NeoRegTabContent({
       <TabsContent value="NeoreGeorg">
         <Card>
           <CardContent className="space-y-2 mt-4">
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <ShellTypeFormField form={form} shellTypes={shellTypes} />
               <UrlPatternFormField form={form} />
             </div>
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <FormField
                 control={form.control}
                 name="headerName"
                 render={({ field }) => (
                   <FormItem className="gap-1">
                     <FormLabel className="h-6 flex items-center gap-1">{t("shellToolConfig.headerName")}</FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerName")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
@@ -42,7 +42,7 @@ export function NeoRegTabContent({
                     <FormLabel className="h-6 flex items-center gap-1">
                       {t("shellToolConfig.headerValue")} {t("optional")}
                     </FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerValue")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
diff --git a/web/src/components/tools/suo5-tab.tsx b/web/src/components/tools/suo5-tab.tsx
index 4a881068..54a7e129 100644
--- a/web/src/components/tools/suo5-tab.tsx
+++ b/web/src/components/tools/suo5-tab.tsx
@@ -19,18 +19,18 @@ export function Suo5TabContent({
       <TabsContent value="Suo5">
         <Card>
           <CardContent className="space-y-2 mt-4">
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <ShellTypeFormField form={form} shellTypes={shellTypes} />
               <UrlPatternFormField form={form} />
             </div>
-            <div className="grid grid-cols-2 gap-2">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
               <FormField
                 control={form.control}
                 name="headerName"
                 render={({ field }) => (
                   <FormItem className="gap-1">
                     <FormLabel className="h-6 flex items-center gap-1">{t("shellToolConfig.headerName")}</FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerName")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />
@@ -42,7 +42,7 @@ export function Suo5TabContent({
                     <FormLabel className="h-6 flex items-center gap-1">
                       {t("shellToolConfig.headerValue")} {t("optional")}
                     </FormLabel>
-                    <Input {...field} placeholder={t("shellToolConfig.headerValue")} className="h-8" />
+                    <Input {...field} placeholder={t("placeholders.input")} className="h-8" />
                   </FormItem>
                 )}
               />