diff options
| -rw-r--r-- | src/locales/en.json | 6 | ||||
| -rw-r--r-- | src/routes/(app)/[username]/(profile)/+page.svelte | 20 | ||||
| -rw-r--r-- | src/routes/(app)/[username]/payments/[...page]/+page.svelte | 10 | ||||
| -rw-r--r-- | src/routes/(app)/payment/[id]/+page.svelte | 15 | ||||
| -rw-r--r-- | src/routes/(app)/pot/[name]/+page.svelte | 40 |
5 files changed, 44 insertions, 47 deletions
diff --git a/src/locales/en.json b/src/locales/en.json index c7d38583..8176ae4c 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -234,6 +234,12 @@ } }, "payments": { + "moneyPot": "Money Pot", + "addFunds": "Add Funds", + "takeFunds": "Take Funds", + "show": "Show", + "hide": "Hide", + "copyLink": "Copy Link", "total": "Total", "gainLoss": "Gain/Loss", "presentValue": "Present Value", diff --git a/src/routes/(app)/[username]/(profile)/+page.svelte b/src/routes/(app)/[username]/(profile)/+page.svelte index 7b81b797..2de58873 100644 --- a/src/routes/(app)/[username]/(profile)/+page.svelte +++ b/src/routes/(app)/[username]/(profile)/+page.svelte @@ -88,29 +88,25 @@ {#if !user.balance} <div class="mb-8"> <p class="text-secondary text-lg"> - {$t("user.welcome")} + {$t('user.welcome')} </p> </div> {/if} - <div class="flex gap-4 justify-center w-full"> - <a href={`/${user.username}/receive`}> - <button - class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-60" - > + <div class="flex flex-wrap gap-4 justify-center w-full"> + <a href={`/${user.username}/receive`} class="w-full md:w-60"> + <button class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-full md:w-60"> <div class="mx-auto flex"> <Icon icon="numpad" style="my-auto h-6 mr-2" /> - <div class="my-auto mt-1">{$t("user.requestPayment")}</div> + <div class="my-auto mt-1">{$t('user.requestPayment')}</div> </div> </button> </a> - <a href={`/scan`}> - <button - class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-60" - > + <a href={`/scan`} class="w-full md:w-60"> + <button class="rounded-full border py-3 px-6 font-bold hover:opacity-80 flex w-full md:w-60"> <div class="mx-auto flex"> <Icon icon="scan" style="my-auto h-6 mr-2" /> - <div class="my-auto mt-1">{$t("user.send.scan")}</div> + <div class="my-auto mt-1">{$t('user.send.scan')}</div> </div> </button> </a> diff --git a/src/routes/(app)/[username]/payments/[...page]/+page.svelte b/src/routes/(app)/[username]/payments/[...page]/+page.svelte index adfaf680..611da44a 100644 --- a/src/routes/(app)/[username]/payments/[...page]/+page.svelte +++ b/src/routes/(app)/[username]/payments/[...page]/+page.svelte @@ -4,21 +4,13 @@ import { format } from 'date-fns'; import { newPayment, payments } from '$lib/store'; import { t } from '$lib/translations'; - import { get, f, s, sat, sats } from '$lib/utils'; + import { get, f, s, sat, sats, types } from '$lib/utils'; import { page } from '$app/stores'; import { differenceInDays, getUnixTime, sub } from 'date-fns'; import { goto, invalidate } from '$app/navigation'; export let data; - const types = { - internal: 'internal', - bitcoin: 'bitcoin', - lightning: 'lightning', - pot: 'pot', - classic: 'classic' - }; - let { start, end, user, rates } = data; let change = ({ target: { value } }) => goto(value); diff --git a/src/routes/(app)/payment/[id]/+page.svelte b/src/routes/(app)/payment/[id]/+page.svelte index 1da3f872..146975f5 100644 --- a/src/routes/(app)/payment/[id]/+page.svelte +++ b/src/routes/(app)/payment/[id]/+page.svelte @@ -1,6 +1,6 @@ <script> import { t } from '$lib/translations'; - import { back, copy, f, s, fiat, post, sats, success } from '$lib/utils'; + import { back, copy, f, s, fiat, post, sats, success, types } from '$lib/utils'; import { Avatar, Icon } from '$comp'; import { format } from 'date-fns'; import { PUBLIC_EXPLORER as expl } from '$env/static/public'; @@ -42,6 +42,19 @@ </a> </div> {/if} + {#if p.type === types.pot} + <div> + <span class="text-lg text-secondary my-auto mr-2">{amount > 0 ? 'From' : 'To'}</span> + <a href={`/pot/${p.memo}`}> + <div class="flex"> + <div class="my-auto"> + <img src="/images/moneypot.png" class="w-12" alt="Pot" /> + </div> + <div class="my-auto ml-1">{p.memo}</div> + </div> + </a> + </div> + {/if} <div> <span class="text-lg text-secondary">Amount</span> <div> diff --git a/src/routes/(app)/pot/[name]/+page.svelte b/src/routes/(app)/pot/[name]/+page.svelte index aac70e8e..4cf05b13 100644 --- a/src/routes/(app)/pot/[name]/+page.svelte +++ b/src/routes/(app)/pot/[name]/+page.svelte @@ -25,13 +25,7 @@ let toggle = () => (show = !show); </script> -<div class="container px-4 max-w-xl mx-auto mt-10 space-y-5"> - <div class="w-full flex"> - <a href="/" class="mx-auto"> - <Icon icon="logo" /> - </a> - </div> - +<div class="container px-4 max-w-4xl mx-auto mt-10 space-y-5"> <div class="flex justify-center items-center"> <div class="md:shadow-xl rounded-3xl md:px-10 pt-5 pb-10 space-y-5 w-full md:mx-5"> <div class="relative flex justify-center gap-2"> @@ -40,19 +34,14 @@ <h1 class="text-2xl md:text-3xl font-semibold my-auto">Card {name}</h1> {:else} <img src="/images/moneypot.jpg" class="w-24" /> - <h1 class="text-2xl md:text-3xl font-semibold my-auto">Money Pot</h1> + <div class="my-auto"> + <h1 class="text-2xl font-semibold my-auto">{$t('payments.moneyPot')}</h1> + <h1 class="text-secondary my-auto">{name}</h1> + </div> {/if} </div> - <p class="text-secondary text-center"> - Anyone who knows the URL to this page can add or take out funds from the pot - </p> {#if show} <img {src} class="mx-auto" alt={name} /> - - <button class="flex mx-auto mt-5" on:click={() => copy($page.url.pathname)} - ><Icon icon="copy" style="w-10 max-w-none" /> - <div class="my-auto">Copy</div></button - > {/if} <div class="flex justify-center gap-4"> <div class="my-auto"> @@ -71,7 +60,7 @@ class="rounded-full border py-3 px-2 font-bold hover:opacity-80 flex gap-1 w-full justify-center" > <Icon icon="plus" /> - Add funds + {$t('payments.addFunds')} </button> </a> </div> @@ -81,7 +70,7 @@ class="rounded-full border py-3 px-2 font-bold hover:opacity-80 flex gap-1 w-full justify-center" > <Icon icon="minus" style="rotate-180" /> - Take funds + {$t('payments.takeFunds')} </button> </a> </div> @@ -92,14 +81,15 @@ on:click={toggle} > <Icon icon="qr" style="invert" /> - {show ? 'Hide' : 'Show'} QR + {show ? $t('payments.show') : $t('payments.hide')} QR + </button> + <button + class="rounded-full border py-3 px-2 font-bold hover:opacity-80 flex gap-1 w-full justify-center" + on:click={() => copy($page.url.pathname)} + > + <Icon icon="copy" style="w-6" /> + {$t('payments.copyLink')} </button> - <!-- <button --> - <!-- class="rounded-full border py-3 px-2 font-bold hover:opacity-80 flex gap-1 w-full justify-center" --> - <!-- > --> - <!-- <Icon icon="nfc" style="w-6" /> --> - <!-- Write Tag --> - <!-- </button> --> </div> <div class="text-base"> {#each payments as p} |