Mirrors/cobalt
1
0
Fork 0
mirror of https://github.com/wukko/cobalt.git synced 2024-11-15 12:50:01 +00:00
Code Issues Projects Releases Packages Wiki Activity

web/about: add the link type of alternative donation method

Browse source
This commit is contained in:
wukko 2024-08-25 17:10:17 +06:00
parent 1c258ab0ae
commit 59308ed09f
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
2 changed files with 33 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
web/src/components/donate/WalletItem.svelte → web/src/components/donate/DonateAltItem.svelte
View file

@ -1,7 +1,10 @@
<script lang="ts"> <script lang="ts">
import { copyURL } from "$lib/download"; import { copyURL, openURL } from "$lib/download";
import CopyIcon from "$components/misc/CopyIcon.svelte";
import CopyIcon from "$components/misc/CopyIcon.svelte";
import IconExternalLink from "@tabler/icons-svelte/IconExternalLink.svelte";
export let type: "copy" | "open";
export let name: string; export let name: string;
export let address: string; export let address: string;
@ -18,17 +21,31 @@
<button <button
class="wallet" class="wallet"
on:click={() => { on:click={() => {
if (type === "copy") {
copied = true; copied = true;
copyURL(address); copyURL(address);
} else {
openURL(address);
}
}} }}
> >
<div class="wallet-copy"> <div class="wallet-icon">
{#if type === "copy"}
<CopyIcon regularIcon={true} check={copied} /> <CopyIcon regularIcon={true} check={copied} />
{:else}
<IconExternalLink />
{/if}
</div> </div>
<div class="wallet-text"> <div class="wallet-text">
<div class="wallet-name">{name}</div> <div class="wallet-name">{name}</div>
<span class="wallet-address">{address}</span> <span class="wallet-address">
{#if type === "copy"}
{address}
{:else}
{address.split("//", 2)[1]}
{/if}
</span>
</div> </div>
</button> </button>
</div> </div>
@ -57,7 +74,7 @@
gap: 10px; gap: 10px;
} }
.wallet-copy { .wallet-icon {
min-width: 42px; min-width: 42px;
max-width: 42px; max-width: 42px;
height: 100%; height: 100%;
@ -74,9 +91,10 @@
padding: 6px 0; padding: 6px 0;
} }
.wallet-copy :global(svg) { .wallet-icon :global(svg) {
width: 18px; width: 18px;
height: 18px; height: 18px;
color: var(--secondary);
} }
.wallet-text, .wallet-text,

9
web/src/routes/donate/+page.svelte
View file

@ -4,10 +4,10 @@
import { donate } from "$lib/env"; import { donate } from "$lib/env";
import { t } from "$lib/i18n/translations"; import { t } from "$lib/i18n/translations";
import WalletItem from "$components/donate/WalletItem.svelte";
import DonateBanner from "$components/donate/DonateBanner.svelte"; import DonateBanner from "$components/donate/DonateBanner.svelte";
import DonateOptionsCard from "$components/donate/DonateOptionsCard.svelte"; import DonateAltItem from "$components/donate/DonateAltItem.svelte";
import DonateShareCard from "$components/donate/DonateShareCard.svelte"; import DonateShareCard from "$components/donate/DonateShareCard.svelte";
import DonateOptionsCard from "$components/donate/DonateOptionsCard.svelte";
import IconDiamond from "@tabler/icons-svelte/IconDiamond.svelte"; import IconDiamond from "@tabler/icons-svelte/IconDiamond.svelte";
</script> </script>
@ -38,7 +38,10 @@
</div> </div>
<div id="wallet-grid"> <div id="wallet-grid">
{#each Object.entries(donate.crypto) as [name, address]} {#each Object.entries(donate.crypto) as [name, address]}
<WalletItem {name} {address} /> <DonateAltItem type="copy" {name} {address} />
{/each}
{#each Object.entries(donate.other) as [name, address]}
<DonateAltItem type="open" {name} {address} />
{/each} {/each}
</div> </div>
</section> </section>