refactor: refine the drag

This commit is contained in:
Kevin Yue 2023-06-26 15:07:55 +08:00
parent 5603157679
commit f91f0bcd17
8 changed files with 22 additions and 13 deletions

View File

@ -4,12 +4,13 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0" />
<title>Vite + React + TS</title>
<title>GlobalProtect</title>
</head>
<body data-tauri-drag-region>
<script>
/* workaround to webview font size auto scaling */
var htmlFontSize = getComputedStyle(document.documentElement).fontSize;
var ratio = parseInt(htmlFontSize) / 16;
var ratio = parseInt(htmlFontSize, 10) / 16;
document.documentElement.style.fontSize = (16 / ratio) + 'px';
</script>
<div id="root"></div>

View File

@ -35,7 +35,7 @@ export default function PortalForm() {
}
return (
<form onSubmit={handleSubmit}>
<form onSubmit={handleSubmit} data-tauri-drag-region>
<TextField
autoFocus
label="Portal address"

View File

@ -93,17 +93,11 @@ function InnerStatusIcon() {
return <DisconnectedIcon />;
}
const DragRegion = styled(Box)(({ theme }) => ({
position: "absolute",
inset: 0,
}));
export default function StatusIcon() {
return (
<IconContainer>
<BackgroundIcon />
<InnerStatusIcon />
<DragRegion data-tauri-drag-region />
</IconContainer>
);
}

View File

@ -7,7 +7,6 @@ export default function StatusText() {
return (
<Typography
data-tauri-drag-region
textAlign="center"
mt={1.5}
variant="subtitle1"

View File

@ -4,9 +4,10 @@ import StatusText from "./StatusText";
export default function ConnectionStatus() {
return (
<Box data-tauri-drag-region>
<Box position="relative">
<StatusIcon />
<StatusText />
<Box data-tauri-drag-region position="absolute" sx={{ inset: 0 }} />
</Box>
);
}

View File

@ -15,7 +15,12 @@ const LinkChip = (props: ChipProps<"a">) => (
export default function Feedback() {
return (
<Stack direction="row" justifyContent="space-evenly" mt={1}>
<Stack
direction="row"
justifyContent="space-evenly"
mt={1}
data-tauri-drag-region
>
<LinkChip
avatar={<BugReport />}
label="Feedback"

View File

@ -16,6 +16,7 @@ import { isProcessingAtom, statusAtom } from "../../atoms/status";
const MenuContainer = styled(Box)(({ theme }) => ({
position: "absolute",
zIndex: 1,
left: theme.spacing(1),
top: theme.spacing(1),
}));
@ -100,6 +101,7 @@ export default function MainMenu() {
target="_blank"
sx={{
position: "absolute",
zIndex: 1,
right: (theme) => theme.spacing(1),
top: (theme) => theme.spacing(1),
}}

View File

@ -1,4 +1,11 @@
import { Alert, AlertTitle, Box, Slide, SlideProps, Snackbar } from "@mui/material";
import {
Alert,
AlertTitle,
Box,
Slide,
SlideProps,
Snackbar,
} from "@mui/material";
import { useAtom, useAtomValue } from "jotai";
import {
closeNotificationAtom,