diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json index e1a6224..b4339cd 100644 --- a/src-tauri/tauri.conf.json +++ b/src-tauri/tauri.conf.json @@ -19,8 +19,11 @@ "height": 680, "resizable": true, "fullscreen": false, - "decorations": false, - "transparent": false, + "decorations": true, + "transparent": true, + "hiddenTitle": true, + "titleBarStyle": "Overlay", + "trafficLightPosition": { "x": 16, "y": 22 }, "center": true, "minWidth": 360, "minHeight": 640 diff --git a/src/App.tsx b/src/App.tsx index 6385251..1de65f9 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -57,6 +57,10 @@ function MainContent(): React.JSX.Element { const { currentTheme } = useTheme() const [messageApi, contextHolder] = message.useMessage() const { isIosDevice, isAndroidDevice, defaultPortraitMode } = useMemo(getMobileDeviceInfo, []) + const isMacDesktop = + typeof navigator !== "undefined" && + /mac/i.test(navigator.userAgent) && + !/iphone|ipad|ipod|android/i.test(navigator.userAgent) const [immersiveMode, setImmersiveMode] = useState(false) const normalizeStoredBottomKeys = (raw: unknown): MobileNavKey[] => { @@ -791,7 +795,7 @@ function MainContent(): React.JSX.Element { hasAnyPassword={hasAnyPassword} onAuthClick={() => setAuthVisible(true)} onLogout={logout} - showWindowControls={!isIosDevice && !isAndroidDevice} + showWindowControls={!isIosDevice && !isAndroidDevice && !isMacDesktop} isPortraitMode={isPortraitMode} isMobileDevice={isMobileDevice} sidebarCollapsed={sidebarCollapsed} diff --git a/src/assets/main.css b/src/assets/main.css index d85344d..cf9787b 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -209,10 +209,8 @@ html.platform-macos body { background: transparent; } -html.platform-macos #root { - border-radius: 12px; - overflow: hidden; -} +/* macOS:保留原生窗口圆角与 squircle(由 NSWindow 在系统层裁剪), + 不再用 CSS border-radius 覆盖,避免圆弧破坏原生连续曲率。 */ .ss-group-board-modal .ant-modal { max-height: calc(100vh - 24px); diff --git a/src/components/ContentArea.tsx b/src/components/ContentArea.tsx index 2ae599b..d5353ac 100644 --- a/src/components/ContentArea.tsx +++ b/src/components/ContentArea.tsx @@ -104,6 +104,12 @@ export function ContentArea({ bottomInset = 0, }: ContentAreaProps): React.JSX.Element { const { t } = useTranslation() + const isMacOS = + typeof navigator !== "undefined" && + /mac/i.test(navigator.userAgent) && + !/iphone|ipad|ipod|android/i.test(navigator.userAgent) + // macOS 使用原生红绿灯,侧栏隐藏(沉浸/竖屏)时顶部左侧需为红绿灯留白 + const macTrafficLightsInset = isMacOS && (isPortraitMode || immersiveMode) const location = useLocation() const navigate = useNavigate() const isSubPage = location.pathname !== "/" && !location.pathname.startsWith("/home") @@ -418,6 +424,7 @@ export function ContentArea({ background: "var(--ss-header-bg)", borderBottom: "1px solid var(--ss-border-color)", flexShrink: 0, + paddingLeft: macTrafficLightsInset ? "80px" : 0, WebkitAppRegion: "drag", position: "relative", } as React.CSSProperties diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx index ab9ef3c..6f8a28c 100644 --- a/src/components/Sidebar.tsx +++ b/src/components/Sidebar.tsx @@ -213,13 +213,20 @@ export function Sidebar({ const showFloatingPanel = floatingExpand && collapsed && floatingExpanded + const isMacOS = + typeof navigator !== "undefined" && + /mac/i.test(navigator.userAgent) && + !/iphone|ipad|ipod|android/i.test(navigator.userAgent) + const renderSidebarBody = (isCollapsedView: boolean, hideMenu = false) => ( <>