diff --git a/src/assets/styles/layout.scss b/src/assets/styles/layout.scss index 171a78c46e45f81de11168fccb7747b738cb51fa..3bf456f4a27fec60d992080ce1e06ac1cec81904 100644 --- a/src/assets/styles/layout.scss +++ b/src/assets/styles/layout.scss @@ -80,8 +80,12 @@ } } -.windows.layout { - .layout__right .the-content { - top: 30px; +.linux, +.windows, +.unknown { + &.layout { + .layout__right .the-content { + top: 30px; + } } } diff --git a/src/pages/_layout.tsx b/src/pages/_layout.tsx index d22a41dabdc4afb4a292595f3e9127906eded8a4..d2debc8dd4b10fc68c8eb6b0c101a3986257cc38 100644 --- a/src/pages/_layout.tsx +++ b/src/pages/_layout.tsx @@ -16,11 +16,12 @@ import LayoutItem from "../components/layout/layout-item"; import LayoutControl from "../components/layout/layout-control"; import LayoutTraffic from "../components/layout/layout-traffic"; import UpdateButton from "../components/layout/update-button"; +import getSystem from "../utils/get-system"; import "dayjs/locale/zh-cn"; dayjs.extend(relativeTime); -const isWinOs = /win64|win32/i.test(navigator.userAgent); +const OS = getSystem(); const Layout = () => { const { t } = useTranslation(); @@ -85,11 +86,11 @@ const Layout = () => { <Paper square elevation={0} - className={`${isWinOs ? "windows " : ""}layout`} + className={`${OS} layout`} onPointerDown={onDragging} onContextMenu={(e) => { // only prevent it on Windows - if (isWinOs) e.preventDefault(); + if (OS === "windows") e.preventDefault(); }} sx={[ (theme) => ({ @@ -118,7 +119,7 @@ const Layout = () => { </div> <div className="layout__right" data-windrag> - {isWinOs && ( + {OS === "windows" && ( <div className="the-bar"> <LayoutControl /> </div> diff --git a/src/utils/get-system.ts b/src/utils/get-system.ts new file mode 100644 index 0000000000000000000000000000000000000000..8801617005940986c4a26490dc51cbf025597608 --- /dev/null +++ b/src/utils/get-system.ts @@ -0,0 +1,13 @@ +// get the system os +// according to UA +export default function getSystem() { + const ua = navigator.userAgent; + + if (ua.includes("Mac OS X")) return "macos"; + + if (/win64|win32/i.test(ua)) return "windows"; + + if (/linux/i.test(ua)) return "linux"; + + return "unknown"; +}