chore: text overflow word-wrap & cleanup

This commit is contained in:
dongchengjie 2024-05-20 12:38:41 +08:00
parent b4fddaec7f
commit 08e0d6a34a
6 changed files with 19 additions and 17 deletions

View File

@ -30,6 +30,7 @@ const Item = styled(Box)(({ theme: { palette, typography } }) => ({
},
"& .data": {
color: palette.text.primary,
overflowWrap: "anywhere",
},
}));

View File

@ -79,7 +79,7 @@ export const HotkeyViewer = forwardRef<DialogRef>((props, ref) => {
return (
<BaseDialog
open={open}
title={t("Hotkey Viewer")}
title={t("Hotkey Setting")}
contentSx={{ width: 450, maxHeight: 330 }}
okBtn={t("Save")}
cancelBtn={t("Cancel")}

View File

@ -120,13 +120,15 @@ export const SysproxyViewer = forwardRef<DialogRef>((props, ref) => {
<ListItem sx={{ padding: "5px 2px", alignItems: "start" }}>
<ListItemText primary={t("Proxy Bypass")} sx={{ padding: "3px 0" }} />
</ListItem>
<ListItem sx={{ padding: "5px 2px" }}>
<TextField
disabled={!enabled}
size="small"
autoComplete="off"
multiline
rows={3}
sx={{ width: 280 }}
rows={4}
sx={{ width: "100%" }}
value={value.bypass}
placeholder={sysproxy?.bypass || `-`}
onChange={(e) =>
@ -155,9 +157,17 @@ export const SysproxyViewer = forwardRef<DialogRef>((props, ref) => {
<FlexBox>
<Typography className="label">{t("Bypass")}</Typography>
<Typography className="value" style={{ overflowWrap: "anywhere" }}>
{sysproxy?.bypass || "-"}
</Typography>
</FlexBox>
<FlexBox>
<TextField
disabled={true}
size="small"
autoComplete="off"
multiline
rows={4}
sx={{ width: "100%" }}
value={sysproxy?.bypass || "-"}
/>
</FlexBox>
</Box>
</BaseDialog>

View File

@ -1,4 +1,4 @@
import { forwardRef, useImperativeHandle, useRef, useState } from "react";
import { forwardRef, useImperativeHandle, useState } from "react";
import { useLockFn } from "ahooks";
import { useTranslation } from "react-i18next";
import {

View File

@ -11,7 +11,6 @@ import { GuardState } from "./mods/guard-state";
import { ServiceViewer } from "./mods/service-viewer";
import { SysproxyViewer } from "./mods/sysproxy-viewer";
import { TunViewer } from "./mods/tun-viewer";
import getSystem from "@/utils/get-system";
interface Props {
onError?: (err: Error) => void;

View File

@ -1,14 +1,6 @@
import { useMemo, useState } from "react";
import { useRecoilState } from "recoil";
import {
Box,
Button,
IconButton,
MenuItem,
Select,
SelectProps,
styled,
} from "@mui/material";
import { Box, Button, IconButton, MenuItem } from "@mui/material";
import { Virtuoso } from "react-virtuoso";
import { useTranslation } from "react-i18next";
import {