TenantAtlas/apps/website/src/components/ui/buttons/GithubBtn.astro

28 lines
857 B
Plaintext

---
import Icon from '@components/ui/icons/Icon.astro';
const { title, url } = Astro.props;
interface Props {
title?: string;
url?: string;
}
const baseClasses =
'group inline-flex items-center justify-center gap-x-3 rounded-lg px-4 py-3 text-center text-sm font-medium text-neutral-700 ring-zinc-500 focus-visible:ring-3 transition duration-300 outline-hidden';
const borderClasses = 'border border-transparent';
const bgColorClasses = 'bg-yellow-400 dark:focus:outline-hidden';
const hoverClasses = 'hover:shadow-2xl hover:shadow-yellow-500';
const fontSizeClasses = '2xl:text-base';
const ringClasses = 'dark:ring-zinc-200';
---
<a
class={`${baseClasses} ${borderClasses} ${bgColorClasses} ${hoverClasses} ${fontSizeClasses} ${ringClasses}`}
href={url}
target="_blank"
rel="noopener noreferrer"
>
<Icon name="github" />
{title}
</a>