MainLayout for theme persistence

2025-01-17 11:33:30 -06:00
parent f49895dee9
commit e7f5e94ed6
13 changed files with 150 additions and 77 deletions
--- a/src/components/MainLayout.tsx
+++ b/src/components/MainLayout.tsx
@@ -0,0 +1,21 @@
+import { Box } from '@mantine/core';
+import { Outlet } from 'react-router-dom';
+
+export function MainLayout({ theme }: any) {
+	return (
+		<Box
+			style={{
+				width: '100%',
+				height: '100%',
+				position: 'fixed',
+				backgroundImage: `linear-gradient(${theme.backgroundColor}33, ${theme.backgroundColor}33), url(/backgrounds/${theme.backgroundImage})`,
+				backgroundSize: 'cover',
+				backgroundRepeat: 'no-repeat',
+				backgroundPosition: 'center',
+				zIndex: -1,
+			}}
+		>
+			<Outlet />
+		</Box>
+	);
+}