diff options
5 files changed, 28 insertions, 44 deletions
diff --git a/src/routes/(app)/ecash/[id]/[...version]/+page.svelte b/src/routes/(app)/ecash/[id]/[...version]/+page.svelte index d9829c12..2b73bc3d 100644 --- a/src/routes/(app)/ecash/[id]/[...version]/+page.svelte +++ b/src/routes/(app)/ecash/[id]/[...version]/+page.svelte @@ -2,7 +2,6 @@ import { enhance } from "$app/forms"; import { copy, sats, f, s } from "$lib/utils"; import { t } from "$lib/translations"; - import Icon from "$comp/Icon.svelte"; import { page } from "$app/stores"; export let data; @@ -21,34 +20,32 @@ {/if} <div class="flex flex-wrap gap-2 text-xl"> - <button - type="button" - class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2" - on:click={() => copy(link)} - > - <Icon icon="link" style="w-8 my-auto" /> + <button type="button" class="btn" on:click={() => copy(link)}> + <iconify-icon icon="ph:link-bold" width="32" /> <div class="my-auto">{$t("payments.shareLink")}</div> </button> {#if spent < total} {#if external} <a href={`/ecash/${id}/swap`} class="contents"> - <button - type="submit" - class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2" - > - <Icon icon="receive" style="w-8 my-auto" /> + <button type="submit" class="btn"> + <iconify-icon + icon="ph:hand-coins-bold" + width="32" + flip="horizontal" + /> <div class="my-auto">{$t("payments.swap")}</div> </button> </a> {:else} <form method="POST" use:enhance class="w-full"> <input type="hidden" name="token" bind:value={token} /> - <button - type="submit" - class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2" - > - <Icon icon="receive" style="w-8 my-auto" /> + <button type="submit" class="btn"> + <iconify-icon + icon="ph:hand-coins-bold" + width="32" + flip="horizontal" + /> <div class="my-auto">{$t("payments.redeem")}</div> </button> </form> @@ -56,7 +53,7 @@ {/if} <button - class="border rounded-2xl px-6 py-5 w-full break-all text-xl hover:bg-slate-100" + class="btn break-all text-xl !h-auto !py-5 font-normal" on:click={() => copy(token)} > {token} @@ -64,21 +61,15 @@ {#if version === 4} <a data-sveltekit-reload href={`/ecash/${id}/3`} class="contents"> - <button - type="button" - class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2" - > - <Icon icon="settings" style="w-8 my-auto" /> + <button type="button" class="btn"> + <iconify-icon icon="ph:gear-bold" width="32" /> <div class="my-auto">{$t("payments.legacyVersion")}</div> </button> </a> {:else} <a data-sveltekit-reload href={`/ecash/${id}`} class="contents"> - <button - type="button" - class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2" - > - <Icon icon="settings" style="w-8 my-auto" /> + <button type="button" class="btn"> + <iconify-icon icon="ph:gear-bold" width="32" /> <div class="my-auto">{$t("payments.newVersion")}</div> </button> </a> diff --git a/src/routes/(app)/payment/[id]/+page.svelte b/src/routes/(app)/payment/[id]/+page.svelte index 619c6d04..150c2bc4 100644 --- a/src/routes/(app)/payment/[id]/+page.svelte +++ b/src/routes/(app)/payment/[id]/+page.svelte @@ -190,9 +190,7 @@ {#if type === types.ecash && amount < 0} <a href={`/ecash/${memo}`} class="block"> - <button - class="rounded-2xl py-5 px-6 font-bold hover:bg-neutral-700 flex bg-black text-white gap-2 items-center" - > + <button class="btn"> <img src="/images/cash.png" class="w-8" /> <div>{$t("payments.ecashToken")}</div> </button> diff --git a/src/routes/(app)/send/bitcoin/[address]/+page.svelte b/src/routes/(app)/send/bitcoin/[address]/+page.svelte index 6b938c38..20fed58a 100644 --- a/src/routes/(app)/send/bitcoin/[address]/+page.svelte +++ b/src/routes/(app)/send/bitcoin/[address]/+page.svelte @@ -34,18 +34,13 @@ <div class="flex justify-center gap-2"> <button type="button" - class="hover:opacity-80 bg-black text-white rounded-2xl py-3 px-4 mt-2 border font-bold" + class="btn !w-auto grow" on:click|preventDefault={setMax} on:keydown={setMax}>Max ⚡️{s(balance)}</button > - <form action={`/send/bitcoin/${address}/${amount}`}> - <button - use:focus - bind:this={submit} - type="submit" - class="opacity-100 hover:opacity-80 rounded-2xl border py-3 font-bold mt-2 bg-black text-white px-4 w-24" - > + <form action={`/send/bitcoin/${address}/${amount}`} class="contents"> + <button use:focus bind:this={submit} type="submit" class="btn !w-auto grow btn-accent"> {$t("payments.next")} </button> </form> diff --git a/src/routes/(app)/send/bitcoin/[address]/[amount]/[...feeRate]/+page.svelte b/src/routes/(app)/send/bitcoin/[address]/[amount]/[...feeRate]/+page.svelte index 903bd372..15080493 100644 --- a/src/routes/(app)/send/bitcoin/[address]/[amount]/[...feeRate]/+page.svelte +++ b/src/routes/(app)/send/bitcoin/[address]/[amount]/[...feeRate]/+page.svelte @@ -193,7 +193,7 @@ use:focus bind:this={submit} type="submit" - class="opacity-100 hover:opacity-80 rounded-2xl border py-3 font-bold mt-2 bg-black text-white px-4 w-24" + class="btn btn-accent" disabled={submitting} > {#if submitting} diff --git a/src/routes/(app)/send/ecash/+page.svelte b/src/routes/(app)/send/ecash/+page.svelte index fa3f97da..3a708f80 100644 --- a/src/routes/(app)/send/ecash/+page.svelte +++ b/src/routes/(app)/send/ecash/+page.svelte @@ -43,10 +43,10 @@ <Numpad bind:amount bind:fiat {currency} {submit} bind:rate={$rate} /> <input type="hidden" name="amount" bind:value={amount} /> - <div> + <div class="flex gap-2"> <button type="button" - class="hover:opacity-80 rounded-2xl py-5 px-6 mt-2 font-bold w-full mx-auto bg-primary" + class="btn !w-auto grow" on:click|preventDefault={setMax} disabled={submitting} on:keydown={setMax}>Max ⚡️{s(balance)}</button @@ -56,12 +56,12 @@ use:focus bind:this={submit} type="submit" - class="opacity-100 hover:opacity-80 rounded-2xl border py-5 font-bold mt-2 bg-black text-white px-6 w-full flex justify-center gap-2 mx-auto" + class="btn btn-accent !w-auto grow" > {#if submitting} <Spinner /> {:else} - <div class="my-auto">{$t("payments.mint")}</div> + <div class="my-auto">{$t("payments.next")}</div> {/if} </button> </div> |