chore: adjust page style

4 files changed, 9 insertions, 9 deletions

diff --git a/src/components/Config.module.scss b/src/components/Config.module.scss
index e233f8b..c408ff1 100644
--- a/src/components/Config.module.scss
+++ b/src/components/Config.module.scss
@@ -1,11 +1,12 @@
 .root,
 .section {
   display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  grid-template-columns: repeat(auto-fill, minmax(49%, 1fr));
   max-width: 900px;
   gap: 5px;
   @media (--breakpoint-not-small) {
     gap: 15px;
+    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
   }
 }
 
diff --git a/src/components/Config.tsx b/src/components/Config.tsx
index 41ffdd7..ded79ad 100644
--- a/src/components/Config.tsx
+++ b/src/components/Config.tsx
@@ -1,11 +1,14 @@
 import * as React from 'react';
 import { DownloadCloud, LogOut, RotateCw, Trash2 } from 'react-feather';
 import { useTranslation } from 'react-i18next';
+import { useQuery } from 'react-query';
 import * as logsApi from 'src/api/logs';
 import Select from 'src/components/shared/Select';
 import { ClashGeneralConfig, DispatchFn, State } from 'src/store/types';
 import { ClashAPIConfig } from 'src/types';
 
+import { fetchVersion } from '$src/api/version';
+
 import {
   getClashAPIConfig,
   getLatencyTestUrl,
@@ -28,9 +31,6 @@ import { Selection2 } from './Selection';
 import { connect, useStoreActions } from './StateProvider';
 import Switch from './SwitchThemed';
 import TrafficChartSample from './TrafficChartSample';
-import { useQuery } from 'react-query';
-import { fetchVersion } from '$src/api/version';
-// import ToggleSwitch from './ToggleSwitch';
 
 const { useEffect, useState, useCallback, useRef } = React;
 
@@ -45,8 +45,8 @@ const logLeveOptions = [
 ];
 
 const portFields = [
-  { key: 'port', label: 'HTTP Proxy Port' },
-  { key: 'socks-port', label: 'SOCKS5 Proxy Port' },
+  { key: 'port', label: 'Http Port' },
+  { key: 'socks-port', label: 'Socks5 Port' },
   { key: 'mixed-port', label: 'Mixed Port' },
   { key: 'redir-port', label: 'Redir Port' },
   { key: 'mitm-port', label: 'MITM Port' },
diff --git a/src/components/Selection.module.scss b/src/components/Selection.module.scss
index ba47089..ab36446 100644
--- a/src/components/Selection.module.scss
+++ b/src/components/Selection.module.scss
@@ -8,9 +8,8 @@
 
 .input + .cnt {
   border: 1px solid transparent;
-  border-radius: 8px;
+  border-radius: 4px;
   cursor: pointer;
-  margin-right: 5px;
   margin-bottom: 5px;
 }
 
diff --git a/src/components/shared/Select.module.scss b/src/components/shared/Select.module.scss
index 0b6b41b..1240e2f 100644
--- a/src/components/shared/Select.module.scss
+++ b/src/components/shared/Select.module.scss
@@ -3,7 +3,7 @@
   line-height: 1.5;
   width: 100%;
   font-size: small;
-  padding-left: 8px;
+  padding-left: 15px;
   appearance: none;
   background-color: var(--color-input-bg);
   color: var(--color-text);