81 lines
3.6 KiB
JavaScript
81 lines
3.6 KiB
JavaScript
import Link from "next/link";
|
|
import WCard from "./werefox-card.js";
|
|
import Iframe from "react-iframe";
|
|
|
|
export default function SupportBlock() {
|
|
return (
|
|
<WCard
|
|
innerText="I would sincerely appreciate if you would throw some financial
|
|
support my way!! 💙"
|
|
>
|
|
<div className="p-4 space-y-4">
|
|
<p className="text-lg md:text-2xl text-center text-werefox-blue-dark dark:text-werefox-blue">
|
|
You could support me through Patreon, Ko-fi, or Liberapay
|
|
</p>
|
|
<div className="w-full justify-center flex">
|
|
<Link href="https://www.patreon.com/bePatron?u=16333959">
|
|
<a target="_blank">
|
|
<p className="rounded-lg pt-2 pb-2 pl-4 pr-4 w-full w-max-60 ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-lg text-center text-werefox-grey-darker dark:text-werefox-grey-lightest bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
|
|
<span>
|
|
<img
|
|
alt="Subscribe to Alexis' Patreon"
|
|
src="/images/patreon_logo.png"
|
|
className="inline-flex h-6"
|
|
></img>
|
|
</span>{" "}
|
|
Become a Patron!
|
|
</p>
|
|
</a>
|
|
</Link>
|
|
</div>
|
|
<div className="w-full justify-center flex">
|
|
<Link href="https://ko-fi.com/O5O61UAY1">
|
|
<a target="_blank">
|
|
<p className="rounded-lg pt-2 pb-2 pl-4 pr-4 w-full w-max-60 ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-lg text-center text-werefox-grey-darker dark:text-werefox-grey-lightest bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
|
|
<span>
|
|
<img
|
|
alt="Buy Alexis a Coffee"
|
|
src="/images/kofi_logo.png"
|
|
className="inline-flex w-6 pb-1"
|
|
></img>
|
|
</span>{" "}
|
|
Buy me a Coffee!
|
|
</p>
|
|
</a>
|
|
</Link>
|
|
</div>
|
|
<div className="w-full justify-center flex">
|
|
<Link href="https://liberapay.com/alexis_werefox/donate">
|
|
<a
|
|
target="_blank"
|
|
className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker"
|
|
>
|
|
<img
|
|
alt="Donate using Liberapay"
|
|
src="/images/liberapay_donate.svg"
|
|
className="inline-flex h-10 filter transition hover:brightness-125"
|
|
/>
|
|
</a>
|
|
</Link>
|
|
</div>
|
|
<div className="pb-6 flex justify-center">
|
|
<details className="rounded-lg p-1 overflow-auto">
|
|
<summary className="p-2 pl-4 pr-4 rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker text-md text-center text-werefox-grey-darker dark:text-werefox-grey-lighter bg-werefox-blue dark:bg-werefox-blue-dark transition hover:bg-werefox-blue-light dark:hover:bg-werefox-blue-darker">
|
|
<strong>Open/Close Ko-fi Donation Widget</strong>
|
|
</summary>
|
|
<div className="pt-2">
|
|
<div className="rounded-lg ring-2 ring-werefox-grey dark:ring-werefox-grey-darker overflow-auto">
|
|
<Iframe
|
|
className="rounded-lg w-96 min-w-96"
|
|
url="https://ko-fi.com/alexis_werefox/?hidefeed=true&widget=true&embed=true&preview=true"
|
|
height="680"
|
|
></Iframe>
|
|
</div>
|
|
</div>
|
|
</details>
|
|
</div>
|
|
</div>
|
|
</WCard>
|
|
);
|
|
}
|