feat(website): outline for donation buttons

This commit is contained in:
Elian Doran 2025-09-27 12:46:16 +03:00
parent 7a73af0299
commit 892e84deaa
No known key found for this signature in database
3 changed files with 13 additions and 4 deletions

View File

@ -1,10 +1,16 @@
a.button {
display: block;
background: var(--brand-1);
background-color: var(--brand-1);
padding: 0.5em 1em;
border-radius: 6px;
color: var(--brand-foreground-color);
text-decoration: none;
text-align: center;
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.15);
}
a.button.outline {
border: 1px solid var(--brand-1);
color: var(--brand-1);
background-color: transparent;
}

View File

@ -8,12 +8,13 @@ interface ButtonProps {
text: ComponentChildren;
openExternally?: boolean;
className?: string;
outline?: boolean;
}
export default function Button({ href, iconSvg, openExternally, text, className }: ButtonProps) {
export default function Button({ href, iconSvg, openExternally, text, className, outline }: ButtonProps) {
return (
<a
className={`button ${className}`}
className={`button ${className} ${outline ? "outline" : ""}`}
href={href}
target={openExternally ? "_blank" : undefined}
>

View File

@ -29,6 +29,7 @@ export default function Donate() {
href="https://paypal.me/eliandoran"
text="PayPal"
openExternally
outline
/>
</li>
@ -38,6 +39,7 @@ export default function Donate() {
href="https://buymeacoffee.com/eliandoran"
text="Buy Me A Coffee"
openExternally
outline
/>
</li>
</ul>