diff --git a/src-web/components/HeaderSize.tsx b/src-web/components/HeaderSize.tsx
index 3d010693..55a7cd2b 100644
--- a/src-web/components/HeaderSize.tsx
+++ b/src-web/components/HeaderSize.tsx
@@ -36,9 +36,9 @@ export function HeaderSize({
paddingLeft: stoplightsVisible ? 72 / settings.interfaceScale : undefined,
...(size === 'md' ? { height: HEADER_SIZE_MD } : {}),
...(size === 'lg' ? { height: HEADER_SIZE_LG } : {}),
- ...(stoplightsVisible || ignoreControlsSpacing
+ ...(osInfo.osType === 'macos' || ignoreControlsSpacing
? { paddingRight: '2px' }
- : { paddingLeft: '2px', paddingRight: osInfo.osType !== 'macos' ? WINDOW_CONTROLS_WIDTH : '2px' }),
+ : { paddingLeft: '2px', paddingRight: WINDOW_CONTROLS_WIDTH }),
}}
className={classNames(
className,
@@ -50,7 +50,7 @@ export function HeaderSize({
{children}
-
+
);
}
diff --git a/src-web/components/WindowControls.tsx b/src-web/components/WindowControls.tsx
index 0ed21717..1673b0cf 100644
--- a/src-web/components/WindowControls.tsx
+++ b/src-web/components/WindowControls.tsx
@@ -1,7 +1,7 @@
import { getCurrentWebviewWindow } from '@tauri-apps/api/webviewWindow';
import classNames from 'classnames';
import React, { useState } from 'react';
-import { useStoplightsVisible } from '../hooks/useStoplightsVisible';
+import { useOsInfo } from '../hooks/useOsInfo';
import { Button } from './core/Button';
import { HStack } from './core/Stacks';
@@ -13,14 +13,16 @@ interface Props {
export const WINDOW_CONTROLS_WIDTH = '10.5rem';
-export function WindowControls({ className, onlyX, macos }: Props) {
+export function WindowControls({ className, onlyX }: Props) {
const [maximized, setMaximized] = useState(false);
- const stoplightsVisible = useStoplightsVisible();
- if (stoplightsVisible) {
+ const osInfo = useOsInfo();
+
+ // Never show controls on macOS
+ if (osInfo.osType === 'macos') {
return null;
}
- return !macos && (
+ return (