website refactor

apps/website/ui/PublicNavLogin.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import { Box } from './Box';
+import { Text } from './Text';
+import { Link } from './Link';
+import { routes } from '@/lib/routing/RouteConfig';
+import { ChevronDown } from 'lucide-react';
+import { Icon } from './Icon';
+
+/**
+ * PublicNavLogin is a login button component for public pages.
+ * It displays a login button that redirects to the auth login page.
+ */
+export function PublicNavLogin() {
+  return (
+    <Link
+      href={routes.auth.login}
+      variant="inherit"
+      data-testid="public-nav-login"
+      className="group flex items-center gap-2 bg-white/5 hover:bg-white/10 border border-white/10 rounded-full pl-4 pr-2 py-1.5 transition-all duration-300 hover:border-primary-accent/50"
+    >
+      <Text size="sm" weight="medium" className="text-text-med group-hover:text-text-high">
+        Login
+      </Text>
+      <Box className="w-6 h-6 rounded-full bg-primary-accent flex items-center justify-center text-white shadow-lg shadow-primary-accent/20 group-hover:scale-110 transition-transform">
+        <Icon icon={ChevronDown} size={3.5} className="-rotate-90" />
+      </Box>
+    </Link>
+  );
+}