Merge pull request ChatGPTNextWeb#5498 from DDMeaqua/fix-plugin-css

Fix plugin css
LovelyGuYiMeng · Sep 24, 2024 · 46fc2a5 · 46fc2a5
2 parents 4c3fd55 + 4a60512
commit 46fc2a5
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 3 deletions.
diff --git a/app/components/plugin.module.scss b/app/components/plugin.module.scss
@@ -10,7 +10,29 @@
     max-height: 240px;
     overflow-y: auto;
     white-space: pre-wrap;
-    min-width: 300px;
+    min-width: 280px;
   }
 }
 
+.plugin-schema {
+  display: flex;
+  justify-content: flex-end;
+  flex-direction: row;
+
+  input {
+    margin-right: 20px;
+
+    @media screen and (max-width: 600px) {
+        margin-right: 0px;
+      }
+  }
+
+  @media screen and (max-width: 600px) {
+    flex-direction: column;
+    gap: 5px;
+
+    button {
+      padding: 10px;
+    }
+  }
+}
diff --git a/app/components/plugin.tsx b/app/components/plugin.tsx
@@ -345,10 +345,10 @@ export function PluginPage() {
             </List>
             <List>
               <ListItem title={Locale.Plugin.EditModal.Content}>
-                <div style={{ display: "flex", justifyContent: "flex-end" }}>
+                <div className={pluginStyles["plugin-schema"]}>
                   <input
                     type="text"
-                    style={{ minWidth: 200, marginRight: 20 }}
+                    style={{ minWidth: 200 }}
                     onInput={(e) => setLoadUrl(e.currentTarget.value)}
                   ></input>
                   <IconButton