Updates

src/components/pages/auth/login/(partials)/login-form.tsx

@@ -0,0 +1,5 @@
+import Stack from "@/twui/components/layout/Stack";
+
+export default function LoginForm() {
+    return <Stack></Stack>;
+}

src/components/pages/auth/login/index.tsx

@@ -1,11 +1,13 @@
-import { Box, Card, Heading } from "@radix-ui/themes";
+import Paper from "@/twui/components/elements/Paper";
+import H2 from "@/twui/components/layout/H2";
+import Stack from "@/twui/components/layout/Stack";
 
 export default function Main() {
     return (
-        <Card>
-            <Box>
-                <Heading size={"5"}>Home</Heading>
-            </Box>
-        </Card>
+        <Paper>
+            <Stack>
+                <H2>Home</H2>
+            </Stack>
+        </Paper>
     );
 }

src/components/pages/home/index.tsx

@@ -1,11 +1,21 @@
-import { Box, Card, Heading } from "@radix-ui/themes";
+import Stack from "@/twui/components/layout/Stack";
+import LoginForm from "../auth/login/(partials)/login-form";
+import H2 from "@/twui/components/layout/H2";
+import Section from "@/twui/components/layout/Section";
+import Container from "@/twui/components/layout/Container";
+import Center from "@/twui/components/layout/Center";
 
 export default function Main() {
     return (
-        <Card className="max-w-4xl w-full xl:p-8">
-            <Box>
-                <Heading size={"5"}>Login</Heading>
-            </Box>
-        </Card>
+        <Section className="w-full h-full">
+            <Container className="w-full h-full">
+                <Center>
+                    <Stack className="flex-col" gap={"5"}>
+                        <H2>Welcome</H2>
+                        <LoginForm />
+                    </Stack>
+                </Center>
+            </Container>
+        </Section>
     );
 }