typo: inconsistent style in layout-viewer

This commit is contained in:
dongchengjie 2024-05-27 16:37:48 +08:00
parent e400111f8a
commit 194fe59458

View File

@ -1,9 +1,16 @@
import { forwardRef, useEffect, useImperativeHandle, useState } from "react";
import { useTranslation } from "react-i18next";
import { List, Button, Select, MenuItem } from "@mui/material";
import {
List,
Button,
Select,
MenuItem,
styled,
ListItem,
ListItemText,
} from "@mui/material";
import { useVerge } from "@/hooks/use-verge";
import { BaseDialog, DialogRef, Notice, Switch } from "@/components/base";
import { SettingItem } from "./setting-comp";
import { GuardState } from "./guard-state";
import { open as openDialog } from "@tauri-apps/api/dialog";
import { convertFileSrc } from "@tauri-apps/api/tauri";
@ -77,7 +84,8 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
onCancel={() => setOpen(false)}
>
<List>
<SettingItem label={t("Traffic Graph")}>
<Item>
<ListItemText primary={t("Traffic Graph")} />
<GuardState
value={verge?.traffic_graph ?? true}
valueProps="checked"
@ -88,9 +96,10 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
>
<Switch edge="end" />
</GuardState>
</SettingItem>
</Item>
<SettingItem label={t("Memory Usage")}>
<Item>
<ListItemText primary={t("Memory Usage")} />
<GuardState
value={verge?.enable_memory_usage ?? true}
valueProps="checked"
@ -101,9 +110,10 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
>
<Switch edge="end" />
</GuardState>
</SettingItem>
</Item>
<SettingItem label={t("Proxy Group Icon")}>
<Item>
<ListItemText primary={t("Proxy Group Icon")} />
<GuardState
value={verge?.enable_group_icon ?? true}
valueProps="checked"
@ -114,9 +124,10 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
>
<Switch edge="end" />
</GuardState>
</SettingItem>
</Item>
<SettingItem label={t("Menu Icon")}>
<Item>
<ListItemText primary={t("Menu Icon")} />
<GuardState
value={verge?.menu_icon ?? "monochrome"}
onCatch={onError}
@ -130,9 +141,11 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
<MenuItem value="disable">{t("Disable")}</MenuItem>
</Select>
</GuardState>
</SettingItem>
</Item>
{OS === "macos" && (
<SettingItem label={t("Tray Icon")}>
<Item>
<ListItemText primary={t("Tray Icon")} />
<GuardState
value={verge?.tray_icon ?? "monochrome"}
onCatch={onError}
@ -148,10 +161,11 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
<MenuItem value="colorful">{t("Colorful")}</MenuItem>
</Select>
</GuardState>
</SettingItem>
</Item>
)}
<SettingItem label={t("Common Tray Icon")}>
<Item>
<ListItemText primary={t("Common Tray Icon")} />
<GuardState
value={verge?.common_tray_icon}
onCatch={onError}
@ -194,9 +208,10 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
{verge?.common_tray_icon ? t("Clear") : t("Browse")}
</Button>
</GuardState>
</SettingItem>
</Item>
<SettingItem label={t("System Proxy Tray Icon")}>
<Item>
<ListItemText primary={t("System Proxy Tray Icon")} />
<GuardState
value={verge?.sysproxy_tray_icon}
onCatch={onError}
@ -239,9 +254,10 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
{verge?.sysproxy_tray_icon ? t("Clear") : t("Browse")}
</Button>
</GuardState>
</SettingItem>
</Item>
<SettingItem label={t("Tun Tray Icon")}>
<Item>
<ListItemText primary={t("Tun Tray Icon")} />
<GuardState
value={verge?.tun_tray_icon}
onCatch={onError}
@ -282,8 +298,12 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
{verge?.tun_tray_icon ? t("Clear") : t("Browse")}
</Button>
</GuardState>
</SettingItem>
</Item>
</List>
</BaseDialog>
);
});
const Item = styled(ListItem)(() => ({
padding: "5px 2px",
}));