30 lines
1.1 KiB
TypeScript
30 lines
1.1 KiB
TypeScript
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>
|
|
);
|
|
}
|