UX changes

Clicking on cryptocurrency QR codes open the images in a new tab

Changed the `details` selector `summary` in `src/app.css` to fix unintended behavior
This commit is contained in:
supercolbat 2023-08-05 08:02:48 -05:00
parent 5814f14c71
commit b8efde379d
No known key found for this signature in database
GPG Key ID: 4C9B319E75DD8072
3 changed files with 16 additions and 6 deletions

View File

@ -69,7 +69,7 @@ h4 {
@apply text-xl font-bold my-8;
}
details {
summary {
@apply cursor-pointer;
}

View File

@ -49,6 +49,7 @@
<h4>Monero</h4>
<CryptoInfo
name="Monero"
address="47L7Qsto7XcifY3CdG18ySe5Tt83kpFLDLve9jQwbc9taPBLNGv6ZrJNUKpMG9Nj9zHgCZ4FQMSyt75e8Jvx12JFLtJyFdA"
qr="Monero.png"
/>
@ -56,6 +57,7 @@
<h4>Bitcoin</h4>
<CryptoInfo
name="Bitcoin"
address="bc1qrc8ywgp95a6p3zausp4nff70qzstp6h8z86sxd"
qr="Bitcoin.png"
/>
@ -63,6 +65,7 @@
<h4>Litecoin</h4>
<CryptoInfo
name="Litecoin"
address="ltc1qn3ald586h2ntt0n3zkvwsmju2e5vndgtvvgatj"
qr="Litecoin.png"
/>

View File

@ -1,4 +1,5 @@
<script lang="ts">
export let name: string = "";
export let address: string = "";
export let qr: string = "";
</script>
@ -13,10 +14,16 @@
{#if qr}
<details class="p-0">
<summary>QR code</summary>
<img
src="/qr/{qr}"
alt="QR code"
class="mt-2"
/>
<a
href="/qr/{qr}"
target="_blank"
rel="noreferrer"
>
<img
src="/qr/{qr}"
alt="QR code to {name} address"
class="mt-2"
/>
</a>
</details>
{/if}