Split layouts

src/renderer/layouts/auth/AuthLayout.module.scss

@@ -0,0 +1,15 @@
+.container {
+  display: flex;
+  height: 100%;
+}
+
+.window {
+  display: flex;
+  position: absolute;
+  width: 100%;
+  height: 50px;
+  z-index: 1000;
+  user-select: none;
+  -webkit-user-select: none;
+  -webkit-app-region: drag;
+}

src/renderer/layouts/auth/AuthLayout.tsx

@@ -0,0 +1,16 @@
+import { Outlet } from 'react-router-dom';
+
+import styles from './AuthLayout.module.scss';
+
+const AuthLayout = () => {
+  return (
+    <>
+      <div className={styles.window} />
+      <div className={styles.container}>
+        <Outlet />
+      </div>
+    </>
+  );
+};
+
+export default AuthLayout;

src/renderer/layouts/index.ts

@@ -1 +1,3 @@
+export { default as AuthLayout } from './auth/AuthLayout';
 export { default as DefaultLayout } from './default/DefaultLayout';
+export { default as WindowLayout } from './window/WindowLayout';

src/renderer/layouts/window/WindowLayout.module.scss

@@ -1,13 +1,3 @@
-.window {
-  display: flex;
-  position: absolute;
-  height: 50px;
-  z-index: 100;
-  user-select: none;
-  -webkit-user-select: none;
-  -webkit-app-region: drag;
-}
-
 .group {
   position: absolute;
   top: 0;

src/renderer/layouts/window/WindowLayout.tsx

@@ -20,7 +20,6 @@ const WindowLayout = ({ style }: WindowControlsProps) => {
     <>
       {isElectron() && (
         <>
-          <div className={styles.window} />
           {style === 'windows' && (
             <>
               <div className={styles.group}>