33 lines
1.4 KiB
TypeScript
33 lines
1.4 KiB
TypeScript
import { apiBase } from "@/lib/api";
|
|
|
|
export function GoogleButton({ label }: { label: string }) {
|
|
return (
|
|
<a href={`${apiBase}/auth/google`}
|
|
className="w-full flex items-center justify-center gap-3 border border-slate-300 rounded-full py-3 font-semibold text-sm hover:bg-slate-50">
|
|
<GoogleIcon />
|
|
{label}
|
|
</a>
|
|
);
|
|
}
|
|
|
|
export function OrDivider({ text }: { text: string }) {
|
|
return (
|
|
<div className="flex items-center gap-3 my-5 text-xs text-slate-400">
|
|
<span className="flex-1 h-px bg-slate-200" />
|
|
{text}
|
|
<span className="flex-1 h-px bg-slate-200" />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function GoogleIcon() {
|
|
return (
|
|
<svg className="h-5 w-5" viewBox="0 0 48 48">
|
|
<path fill="#FFC107" d="M43.6 20.5H42V20H24v8h11.3c-1.6 4.7-6.1 8-11.3 8-6.6 0-12-5.4-12-12s5.4-12 12-12c3.1 0 5.9 1.2 8 3.1l5.7-5.7C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.1-2.3-.4-3.5z" />
|
|
<path fill="#FF3D00" d="M6.3 14.7l6.6 4.8C14.7 15.1 19 12 24 12c3.1 0 5.9 1.2 8 3.1l5.7-5.7C34.6 4.1 29.6 2 24 2 15.4 2 8 6.9 6.3 14.7z" />
|
|
<path fill="#4CAF50" d="M24 46c5.5 0 10.4-2.1 14.1-5.5l-6.5-5.5C29.6 36.9 26.9 38 24 38c-5.2 0-9.6-3.3-11.3-7.9l-6.5 5C8 41 15.4 46 24 46z" />
|
|
<path fill="#1976D2" d="M43.6 20.5H42V20H24v8h11.3c-.8 2.2-2.2 4.1-4.1 5.5l6.5 5.5C41.5 36.5 45 31 45 24c0-1.3-.1-2.3-.4-3.5z" />
|
|
</svg>
|
|
);
|
|
}
|