upd: login

Deskripsi:
- update design login page

No Issues

src/pages/Login.tsx

@@ -1,12 +1,12 @@
 import clientRoutes from "@/clientRoutes";
 import {
   Button,
-  Container,
+  Center,
-  Group,
+  Paper,
   PasswordInput,
   Stack,
   Text,
-  TextInput,
+  TextInput
 } from "@mantine/core";
 import { useState } from "react";
 import apiFetch from "../lib/apiFetch";
@@ -73,25 +73,73 @@ export default function Login() {
   };
 
   return (
-    <Container>
+    <Center
-      <Stack>
+      h="100vh"
-        <Text>Login</Text>
+      style={{
-        <TextInput
+        background:
-          placeholder="Email"
+          "radial-gradient(circle at top, #1f2d2b 0%, #0b0f0e 60%)",
-          value={email}
+      }}
-          onChange={(e) => setEmail(e.target.value)}
+    >
-        />
+      <Paper
-        <PasswordInput
+        radius="lg"
-          placeholder="Password"
+        p="xl"
-          value={password}
+        w={420}
-          onChange={(e) => setPassword(e.target.value)}
+        style={{
-        />
+          background: "rgba(20, 20, 20, 0.75)",
-        <Group justify="right">
+          backdropFilter: "blur(12px)",
-          <Button onClick={handleSubmit} disabled={loading}>
+          border: "1px solid rgba(255, 255, 255, 0.08)",
+          boxShadow: "0 20px 60px rgba(0,0,0,0.6)",
+        }}
+      >
+        <Stack>
+          <Text
+            size="xl"
+            fw={700}
+            ta="center"
+            c="white"
+          >
+            Welcome Back
+          </Text>
+
+          <Text
+            size="sm"
+            ta="center"
+            c="dimmed"
+          >
+            Sign in to continue to your dashboard
+          </Text>
+
+          <TextInput
+            label="Email"
+            placeholder="Email"
+            value={email}
+            onChange={(e) => setEmail(e.target.value)}
+          />
+
+          <PasswordInput
+            label="Password"
+            placeholder="Password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+          />
+
+          <Button
+            fullWidth
+            mt="md"
+            radius="md"
+            size="md"
+            variant="gradient"
+            gradient={{ from: "teal", to: "cyan", deg: 45 }}
+            style={{
+              transition: "all 0.2s ease",
+            }}
+            onClick={handleSubmit}
+            disabled={loading}
+          >
             Login
           </Button>
-        </Group>
+        </Stack>
-      </Stack>
+      </Paper>
-    </Container>
+    </Center>
   );
 }