feat: login form as a client component, theme toggle

components/Logo/Logo.tsx

@@ -0,0 +1,49 @@
+import { Center, Divider, Image, Stack, Title } from "@mantine/core";
+
+type Props = {
+    title?: string;
+};
+
+const Logo = ({ title }: Props) => {
+    return (
+        <Stack
+            align="center"
+            gap={0}>
+            <Image
+                src="/favicon.svg"
+                alt="LogiDex Logo"
+                w={80}
+            />
+            <Title
+                ta={"center"}
+                order={2}
+                mt={"md"}>
+                LogiDex
+            </Title>
+            <Title
+                ta={"center"}
+                order={5}
+                mt={"sm"}
+                style={{ color: "#4AAAC7" }}>
+                Fulfillment & Delivery
+            </Title>
+            {title && (
+                <Divider
+                    w={"100%"}
+                    mt={"md"}
+                />
+            )}
+            {title && (
+                <Center>
+                    <Title
+                        order={4}
+                        my={"md"}>
+                        {title}
+                    </Title>
+                </Center>
+            )}
+        </Stack>
+    );
+};
+
+export default Logo;