diff options
| author | Adam Soltys <[email protected]> | 2024-12-30 16:14:50 -0800 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2024-12-30 16:14:50 -0800 |
| commit | 9f6f2210cb4046f8359ea629bc75461d2b22b217 (patch) | |
| tree | 11795f8734b49d167eeb988435d9e6d0e423a0b9 /src/components/InvoiceData.svelte | |
| parent | 86674db5b2c760ad93c72b39febe9c6d6aa74e0d (diff) | |
| download | coinos-ui-9f6f2210cb4046f8359ea629bc75461d2b22b217.tar.gz coinos-ui-9f6f2210cb4046f8359ea629bc75461d2b22b217.zip | |
qr fade in
Diffstat (limited to 'src/components/InvoiceData.svelte')
| -rw-r--r-- | src/components/InvoiceData.svelte | 8 |
1 files changed, 6 insertions, 2 deletions
diff --git a/src/components/InvoiceData.svelte b/src/components/InvoiceData.svelte index c996a913..ca7d5e7b 100644 --- a/src/components/InvoiceData.svelte +++ b/src/components/InvoiceData.svelte @@ -16,15 +16,19 @@ t, } = $props(); + let loaded = $state(false); let { memo } = $derived(invoice); + let load = () => (loaded = true); </script> {#if showQr} - <div class="max-w-[360px] mx-auto min-h-[340px]"> + <div class="max-w-[360px] mx-auto min-h-[360px]"> <a href={link}> <img src={`/qr/${encodeURIComponent(invoice.text)}/raw`} - class="z-10 border-4 border-white" + class="z-10 border-4 border-white opacity-0 transition-opacity duration-300" + class:opacity-100={loaded} + onload={load} alt={txt} /> </a> |