Window border on Linux

src-web/components/DefaultLayout.tsx

@@ -2,12 +2,22 @@ import { Outlet } from 'react-router-dom';
 import { DialogProvider } from './DialogContext';
 import { GlobalHooks } from './GlobalHooks';
 import { ToastProvider } from './ToastContext';
+import classNames from 'classnames';
+import { useOsInfo } from '../hooks/useOsInfo';
 
 export function DefaultLayout() {
+  const osInfo = useOsInfo();
   return (
     <DialogProvider>
       <ToastProvider>
-        <Outlet />
+        <div
+          className={classNames(
+            'w-full h-full',
+            osInfo?.osType === 'linux' && 'border border-background-highlight-secondary',
+          )}
+        >
+          <Outlet />
+        </div>
         <GlobalHooks />
       </ToastProvider>
     </DialogProvider>

src-web/components/Settings/Settings.tsx

@@ -28,7 +28,7 @@ export const Settings = () => {
   useKeyPressEvent('Escape', () => getCurrent().close());
 
   return (
-    <>
+    <div className={classNames('grid grid-rows-[auto_minmax(0,1fr)] h-full')}>
       <HeaderSize
         data-tauri-drag-region
         ignoreStoplights
@@ -60,6 +60,6 @@ export const Settings = () => {
           <SettingsAppearance />
         </TabContent>
       </Tabs>
-    </>
+    </div>
   );
 };