78 lines
2.4 KiB
TypeScript
78 lines
2.4 KiB
TypeScript
|
export const title = "Pay Foster Hangdaan";
|
||
|
|
export const description = "This site lists payment methods for making payments or donations to Foster Hangdaan.";
|
||
|
|
export const layout = "layout.tsx";
|
||
|
|
|
||
|
|
const crypto = [
|
||
|
|
{
|
||
|
|
name: "Monero",
|
||
|
|
icon: "https://static.fosterhangdaan.com/icons/simple-icons/v10.2.0/monero.svg",
|
||
|
|
qrcode: "images/xmr-address.svg",
|
||
|
|
address: "47fQTNLjXUPPmjcB4eU3kuSwyHkpioms77XUjdCKMKPs6jwNNEfFpEYZM4sZi9NwZHHeJD3prgLTC66E2skbvzTm1jiXb1R",
|
||
|
|
preferred: true,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: "Bitcoin",
|
||
|
|
icon: "https://static.fosterhangdaan.com/icons/simple-icons/v10.2.0/bitcoin.svg",
|
||
|
|
qrcode: "images/btc-address.svg",
|
||
|
|
address: "bc1q3w9e0zm9ez24c8hhhfyamgchfvf9x85ean5wqr",
|
||
|
|
}
|
||
|
|
];
|
||
|
|
|
||
|
|
export default function Home(data: Lume.Data, _helpers: Lume.Helpers) {
|
||
|
|
return (
|
||
|
|
<div class="home-container">
|
||
|
|
<h1>{data.title}</h1>
|
||
|
|
<div class="preamble">
|
||
|
|
<p>This site lists the methods for sending payments or donations to <a href="https://www.fosterhangdaan.com">Foster Hangdaan</a>.</p>
|
||
|
|
<p>
|
||
|
|
I currently only accept cryptocurrency donations. My wallet addresses
|
||
|
|
are listed below:
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<details>
|
||
|
|
<summary>
|
||
|
|
<img
|
||
|
|
class="icon"
|
||
|
|
src="https://static.fosterhangdaan.com/icons/tabler-icons/v3.0.0/svg/outline/wallet.svg"
|
||
|
|
/>
|
||
|
|
<span>OpenAlias</span>
|
||
|
|
</summary>
|
||
|
|
<div class="content">
|
||
|
|
<p>
|
||
|
|
If your crypto wallet supports{" "}
|
||
|
|
<a href="https://openalias.org/">OpenAlias</a>, you can simply
|
||
|
|
send a payment to the address below:
|
||
|
|
</p>
|
||
|
|
<pre>pay.fosterhangdaan.com</pre>
|
||
|
|
</div>
|
||
|
|
</details>
|
||
|
|
</li>
|
||
|
|
{crypto.sort((a,b) => {
|
||
|
|
return a.name > b.name ? 1 : -1;
|
||
|
|
}).map((c) => (
|
||
|
|
<li>
|
||
|
|
<details>
|
||
|
|
<summary>
|
||
|
|
<img
|
||
|
|
class="icon"
|
||
|
|
src={c.icon}
|
||
|
|
/>
|
||
|
|
<span>{c.name}</span>
|
||
|
|
{c.preferred && <div class="tag">preferred</div>}
|
||
|
|
</summary>
|
||
|
|
<div class="content">
|
||
|
|
<img class="qrcode" src={c.qrcode} />
|
||
|
|
<pre>
|
||
|
|
{c.address}
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</details>
|
||
|
|
</li>
|
||
|
|
))}
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|