fix: 修复移动端创建面板的相关样式问题

web/src/plugin/PluginStore/Item.tsx

@@ -42,7 +42,7 @@ export const PluginStoreItem: React.FC<{
   }, [manifest]);
 
   return (
-    <div className="rounded-md flex w-80 h-36 bg-white bg-opacity-40 dark:bg-black dark:bg-opacity-40 shadow py-2 px-3">
+    <div className="rounded-md flex w-80 mobile:w-full h-36 bg-white bg-opacity-40 dark:bg-black dark:bg-opacity-40 shadow py-2 px-3">
       <div className="flex w-full">
         <div className="mr-2">
           <Avatar shape="square" src={manifest.icon} name={manifest.label} />

web/src/plugin/PluginStore/index.tsx

@@ -46,28 +46,26 @@ export const PluginStore: React.FC = React.memo(() => {
         <PillTabPane key="1" tab={t('全部')}>
           <Divider orientation="left">{t('内置插件')}</Divider>
 
-          <div className="flex flex-wrap">
+          <div className="flex flex-wrap gap-2">
             {builtinPlugins.map((plugin) => (
-              <div key={plugin.name} className="m-1">
-                <PluginStoreItem
-                  manifest={plugin}
-                  installed={installedPluginNameList.includes(plugin.name)}
-                  builtin={true}
-                />
-              </div>
+              <PluginStoreItem
+                key={plugin.name}
+                manifest={plugin}
+                installed={installedPluginNameList.includes(plugin.name)}
+                builtin={true}
+              />
             ))}
           </div>
 
           <Divider orientation="left">{t('插件中心')}</Divider>
 
-          <div className="flex flex-wrap">
+          <div className="flex flex-wrap gap-2">
             {allPlugins.map((plugin) => (
-              <div key={plugin.name} className="m-1">
-                <PluginStoreItem
-                  manifest={plugin}
-                  installed={installedPluginNameList.includes(plugin.name)}
-                />
-              </div>
+              <PluginStoreItem
+                key={plugin.name}
+                manifest={plugin}
+                installed={installedPluginNameList.includes(plugin.name)}
+              />
             ))}
           </div>
         </PillTabPane>
@@ -75,15 +73,14 @@ export const PluginStore: React.FC = React.memo(() => {
         <PillTabPane key="2" tab={t('已安装')}>
           <Divider orientation="left">{t('已安装')}</Divider>
 
-          <div className="flex flex-wrap">
+          <div className="flex flex-wrap gap-2">
             {[...builtinPlugins, ...installedPluginList].map((plugin) => (
-              <div key={plugin.name} className="m-1">
-                <PluginStoreItem
-                  manifest={plugin}
-                  installed={true}
-                  builtin={true}
-                />
-              </div>
+              <PluginStoreItem
+                key={plugin.name}
+                manifest={plugin}
+                installed={true}
+                builtin={true}
+              />
             ))}
           </div>
         </PillTabPane>

web/src/routes/Main/index.tsx

@@ -15,7 +15,7 @@ const MainRoute: React.FC = React.memo(() => {
       <div className="flex flex-col h-full">
         <GlobalTemporaryTip />
 
-        <div className="flex flex-1">
+        <div className="flex flex-1 overflow-hidden">
           <Navbar />
 
           <MainContent />

web/src/styles/antd/dark.less

@@ -42,6 +42,10 @@
         background: #555;
       }
     }
+
+    &.ant-btn-link {
+      border-color: transparent;
+    }
   }
 
   // 表单