web/DonationOptionsCard: move href inside the option button
Some checks are pending
Run tests / check lockfile correctness (push) Waiting to run
Run tests / web sanity check (push) Waiting to run
Run tests / api sanity check (push) Waiting to run

This commit is contained in:
wukko 2024-09-18 20:57:52 +06:00
parent 9ea6b09e7e
commit 643e9775f5
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
3 changed files with 19 additions and 13 deletions

View file

@ -5,8 +5,6 @@
import Imput from "$components/icons/Imput.svelte"; import Imput from "$components/icons/Imput.svelte";
import Meowbalt from "$components/misc/Meowbalt.svelte"; import Meowbalt from "$components/misc/Meowbalt.svelte";
import IconHeart from "@tabler/icons-svelte/IconHeart.svelte";
</script> </script>
<header id="banner"> <header id="banner">

View file

@ -107,11 +107,13 @@
</div> </div>
<div id="donation-options"> <div id="donation-options">
{#each Object.entries(PRESET_DONATION_AMOUNTS) as [ amount, component ]} {#each Object.entries(PRESET_DONATION_AMOUNTS) as [ amount, component ]}
<OuterLink href={donationMethods[processor](+amount * 100)}> <DonationOption
<DonationOption price={+amount} desc={$t(`donate.card.option.${amount}`)}> price={+amount}
<svelte:component this={component} /> desc={$t(`donate.card.option.${amount}`)}
</DonationOption> href={donationMethods[processor](+amount * 100)}
</OuterLink> >
<svelte:component this={component} />
</DonationOption>
{/each} {/each}
</div> </div>
<div id="donation-custom"> <div id="donation-custom">

View file

@ -1,18 +1,24 @@
<script lang="ts"> <script lang="ts">
export let price: number; export let price: number;
export let desc: string; export let desc: string;
export let href: string;
const USD = new Intl.NumberFormat('en-US', { const USD = new Intl.NumberFormat("en-US", {
style: 'currency', style: "currency",
currency: 'USD', currency: "USD",
minimumFractionDigits: 0 minimumFractionDigits: 0,
}); });
</script> </script>
<button class="donation-option"> <button
class="donation-option"
on:click={() => {
window.open(href, "_blank");
}}
>
<div class="donate-card-title"> <div class="donate-card-title">
<slot></slot> <slot></slot>
{ USD.format(price) } {USD.format(price)}
</div> </div>
<div class="donate-card-subtitle">{desc}</div> <div class="donate-card-subtitle">{desc}</div>
</button> </button>