diff options
| author | Adam Soltys <[email protected]> | 2024-11-12 23:36:15 -0800 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2024-11-12 23:36:15 -0800 |
| commit | bee96ca44e871b0482012be50e8e7686f534c5a3 (patch) | |
| tree | 8eee96b61e7996b0b5f94b596391949825a39b45 /src/components/InvoiceData.svelte | |
| parent | e6742ec5b333e5b3b7d174eae9f79c7d63b4b4e9 (diff) | |
| download | coinos-ui-bee96ca44e871b0482012be50e8e7686f534c5a3.tar.gz coinos-ui-bee96ca44e871b0482012be50e8e7686f534c5a3.zip | |
lightning bolt
Diffstat (limited to 'src/components/InvoiceData.svelte')
| -rw-r--r-- | src/components/InvoiceData.svelte | 34 |
1 files changed, 21 insertions, 13 deletions
diff --git a/src/components/InvoiceData.svelte b/src/components/InvoiceData.svelte index 2298d150..c6721829 100644 --- a/src/components/InvoiceData.svelte +++ b/src/components/InvoiceData.svelte @@ -10,7 +10,7 @@ amountFiat, currency, tip, - rate + rate, } = $props(); </script> @@ -49,23 +49,31 @@ {#if amount > 0} <div class="text-center font-bold text-2xl"> - <div> - {f(amountFiat, currency)} + <div class="flex justify-center items-end gap-2"> + <div>{f(amountFiat, currency)}</div> {#if tip} - <span class="text-sm"> - +{f(tip * (rate / sats), currency)} - </span> + <div class="text-base flex items-center gap-1"> + <div>+</div> + <div>{f(tip * (rate / sats), currency)}</div> + </div> {/if} </div> - <div> - <span class="text-secondary font-normal text-xl">⚡️{`${s(amount)}`}</span - > - + <div class="flex justify-center items-end text-secondary font-normal text-xl gap-2"> + <div class="flex items-center"> + <iconify-icon icon="ph:lightning-fill" class="text-yellow-300" + ></iconify-icon> + <div> + {`${s(amount)}`} + </div> + </div> {#if tip} - <span class="text-sm text-secondary font-normal"> - +⚡️{s(tip)} - </span> + <div class="text-base flex items-center"> + <div>+</div> + <iconify-icon icon="ph:lightning-fill" class="text-yellow-300" + ></iconify-icon> + <div>{s(tip)}</div> + </div> {/if} </div> </div> |