fix: adjust style

src/assets/styles/index.scss

@@ -4,7 +4,11 @@ body {
     "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
     sans-serif;
   -webkit-font-smoothing: antialiased;
+
   user-select: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
 }
 
 :root {
@@ -37,3 +41,10 @@ body {
     background-color: rgba(18, 18, 18, 1);
   }
 }
+
+.user-none {
+  user-select: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+}

src/assets/styles/layout.scss

@@ -14,6 +14,9 @@
     flex-direction: column;
     box-sizing: border-box;
     user-select: none;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
     overflow: hidden;
 
     $maxLogo: 100px;

src/components/setting/mods/core-switch.tsx

@@ -1,9 +1,10 @@
 import { mutate } from "swr";
 import { useState } from "react";
 import { useLockFn } from "ahooks";
-import { Menu, MenuItem } from "@mui/material";
+import { IconButton, Menu, MenuItem } from "@mui/material";
 import { Settings } from "@mui/icons-material";
 import { changeClashCore } from "@/services/cmds";
+import { closeAllConnections } from "@/services/api";
 import { useVerge } from "@/hooks/use-verge";
 import { Notice } from "@/components/base";
 
@@ -24,6 +25,7 @@ export const CoreSwitch = () => {
     if (core === clash_core) return;
 
     try {
+      closeAllConnections();
       await changeClashCore(core);
       mutateVerge();
       setTimeout(() => {
@@ -39,15 +41,20 @@ export const CoreSwitch = () => {
 
   return (
     <>
-      <Settings
-        fontSize="small"
-        style={{ cursor: "pointer", opacity: 0.75 }}
+      <IconButton
+        color="inherit"
+        size="small"
         onClick={(event) => {
           const { clientX, clientY } = event;
           setPosition({ top: clientY, left: clientX });
           setAnchorEl(event.currentTarget);
         }}
-      />
+      >
+        <Settings
+          fontSize="inherit"
+          style={{ cursor: "pointer", opacity: 0.75 }}
+        />
+      </IconButton>
 
       <Menu
         open={!!anchorEl}

src/components/setting/mods/setting-comp.tsx

@@ -19,7 +19,7 @@ export const SettingItem: React.FC<ItemProps> = (props) => {
     label
   ) : (
     <Box sx={{ display: "flex", alignItems: "center" }}>
-      <span style={{ marginRight: 4 }}>{label}</span>
+      <span>{label}</span>
       {extra}
     </Box>
   );

src/components/setting/setting-verge.tsx

@@ -167,7 +167,7 @@ const SettingVerge = ({ onError }: Props) => {
       </SettingItem>
 
       <SettingItem label={t("Verge Version")}>
-        <Typography sx={{ py: "7px" }}>v{version}</Typography>
+        <Typography sx={{ py: "7px", pr: 1 }}>v{version}</Typography>
       </SettingItem>
     </SettingList>
   );

src/pages/logs.tsx

@@ -65,7 +65,14 @@ const LogPage = () => {
         </Box>
       }
     >
-      <Paper sx={{ boxSizing: "border-box", boxShadow: 2, height: "100%" }}>
+      <Paper
+        sx={{
+          boxSizing: "border-box",
+          boxShadow: 2,
+          height: "100%",
+          userSelect: "text",
+        }}
+      >
         <Box
           sx={{
             pt: 1,