diff options
| author | secondl1ght <[email protected]> | 2022-09-15 18:11:12 -0600 |
|---|---|---|
| committer | secondl1ght <[email protected]> | 2022-09-15 18:11:12 -0600 |
| commit | c17cf8d8c7a8ed252aa6895f03dae15a3fcd0c12 (patch) | |
| tree | 99775a842a2c8d81db01f972ac4b967970ff95d4 | |
| parent | f8de16cd01251d608853a83a2ba7877462833d69 (diff) | |
| download | coinos-ui-c17cf8d8c7a8ed252aa6895f03dae15a3fcd0c12.tar.gz coinos-ui-c17cf8d8c7a8ed252aa6895f03dae15a3fcd0c12.zip | |
format
| -rw-r--r-- | src/app.html | 10 | ||||
| -rw-r--r-- | src/components/About.svelte | 84 | ||||
| -rw-r--r-- | src/components/LocaleSelector.svelte | 14 | ||||
| -rw-r--r-- | src/components/LocationsMap.svelte | 10 | ||||
| -rw-r--r-- | src/components/RegisterOrLogin.svelte | 7 | ||||
| -rw-r--r-- | src/locales/en.json | 46 | ||||
| -rw-r--r-- | src/routes/[username]/dashboard/+page.svelte | 26 | ||||
| -rw-r--r-- | src/routes/[username]/transactions/[...page]/+page.svelte | 35 | ||||
| -rw-r--r-- | src/routes/invoice/[id]/+page.svelte | 4 |
9 files changed, 123 insertions, 113 deletions
diff --git a/src/app.html b/src/app.html index 4e3b66bd..d8545747 100644 --- a/src/app.html +++ b/src/app.html @@ -8,10 +8,12 @@ <meta property="og:image" content="/icons/logo.svg" /> <title>coinos</title> %sveltekit.head% - <script src="https://stamen-maps.a.ssl.fastly.net/js/tile.stamen.js"></script> - <style> - img.huechange { filter: hue-rotate(170deg); } - </style> + <script src="https://stamen-maps.a.ssl.fastly.net/js/tile.stamen.js"></script> + <style> + img.huechange { + filter: hue-rotate(170deg); + } + </style> </head> <body> <div>%sveltekit.body%</div> diff --git a/src/components/About.svelte b/src/components/About.svelte index 704e425a..7af1e896 100644 --- a/src/components/About.svelte +++ b/src/components/About.svelte @@ -10,10 +10,10 @@ { type: 'github', url: 'https://github.com/asoltys', color: 'bg-gray-800' } ] }, - { name: 'cole', socials: [] }, + { name: 'cole', socials: [] }, { name: 'john', - socials: [ ] + socials: [] }, { name: 'secondl1ght', @@ -26,11 +26,13 @@ name: 'shauna', socials: [ { type: 'twitter', url: 'https://twitter.com/ShaunaCollister', color: 'bg-[#1D9BF0]' }, - { type: 'linkedin', url: 'https://www.linkedin.com/in/shauna-collister-32905214', color: 'bg-[#0a66c2]' } + { + type: 'linkedin', + url: 'https://www.linkedin.com/in/shauna-collister-32905214', + color: 'bg-[#0a66c2]' + } ] - }, - - + } ]; </script> @@ -52,45 +54,45 @@ <Image image="swoosh" style="w-32 absolute -bottom-20 lg:bottom-0 right-0 md:right-10" /> </div> -<div class='flex justify-center'> -<div class="container mt-40 lg:mt-20"> - <h3 class="text-5xl font-medium mb-10 text-center"> - {$t('about.team.header')} - </h3> -<div class='space-y-10 2xl:space-y-0 2xl:grid gap-y-10 grid-cols-2'> - {#each team as member} -<div class='md:flex justify-center items-center 2xl:items-start md:space-x-10'> - <div> - <Image image={member.name} style="rounded-full mx-auto w-40 h-40 mb-5 object-cover" /> +<div class="flex justify-center"> + <div class="container mt-40 lg:mt-20"> + <h3 class="text-5xl font-medium mb-10 text-center"> + {$t('about.team.header')} + </h3> + <div class="space-y-10 2xl:space-y-0 2xl:grid gap-y-10 grid-cols-2"> + {#each team as member} + <div class="md:flex justify-center items-center 2xl:items-start md:space-x-10"> + <div> + <Image image={member.name} style="rounded-full mx-auto w-40 h-40 mb-5 object-cover" /> - <div class="space-y-2"> - <span class="text-2xl text-center font-semibold block" - >{$t(`about.team.${member.name}.name`)}</span - > - <span class="text-xl text-center text-secondary block" - >{$t(`about.team.${member.name}.position`)}</span - > - </div> + <div class="space-y-2"> + <span class="text-2xl text-center font-semibold block" + >{$t(`about.team.${member.name}.name`)}</span + > + <span class="text-xl text-center text-secondary block" + >{$t(`about.team.${member.name}.position`)}</span + > + </div> - <div class="mt-2 flex justify-center items-center space-x-5"> - {#each member.socials as social} - <a - href={social.url} - target="_blank" - rel="noreferrer" - class={`rounded-full p-2 ${social.color}`}><Icon icon={social.type} style="w-6" /></a - > - {/each} + <div class="mt-2 flex justify-center items-center space-x-5"> + {#each member.socials as social} + <a + href={social.url} + target="_blank" + rel="noreferrer" + class={`rounded-full p-2 ${social.color}`} + ><Icon icon={social.type} style="w-6" /></a + > + {/each} + </div> + </div> + <div class="mt-5 md:mt-0 text-secondary text-xl w-full md:w-[450px]"> + {$t(`about.team.${member.name}.bio`)} + </div> </div> - + {/each} </div> - <div class="mt-5 md:mt-0 text-secondary text-xl w-full md:w-[450px]"> - {$t(`about.team.${member.name}.bio`)} - </div> -</div> - {/each} -</div> -</div> + </div> </div> <div class="mt-20"> diff --git a/src/components/LocaleSelector.svelte b/src/components/LocaleSelector.svelte index 9f4a1428..a4a139f2 100644 --- a/src/components/LocaleSelector.svelte +++ b/src/components/LocaleSelector.svelte @@ -10,10 +10,10 @@ </select> <style> -select { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - border: none; -} - </style> + select { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + border: none; + } +</style> diff --git a/src/components/LocationsMap.svelte b/src/components/LocationsMap.svelte index 063b4681..bf2e4339 100644 --- a/src/components/LocationsMap.svelte +++ b/src/components/LocationsMap.svelte @@ -37,26 +37,26 @@ .tileLayer('http://{s}tile.stamen.com/toner/{z}/{x}/{y}.png', { // leaflet.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 19, - subdomains: ['', 'a.', 'b.', 'c.', 'd.'], + subdomains: ['', 'a.', 'b.', 'c.', 'd.'] }) .addTo(map); // let tonerLayer = new L.StamenTileLayer("toner"); // map.addLayer(tonerLayer); - - leaflet .marker([49.27034, -123.141373]) .addTo(map) .bindPopup( 'Rolf Vancouver <br> 1628 W 1st Ave #231, Vancouver <br> <a href="https://www.rolfbodywork.com" target="_blank" rel="noreferrer">www.rolfbodywork.com</a>' - )._icon.classList.add("huechange"); + ) + ._icon.classList.add('huechange'); leaflet .marker([49.26419, -123.15702]) .addTo(map) - .bindPopup('Tacos Jorge <br> 2287 W Broadway, Vancouver')._icon.classList.add("huechange"); + .bindPopup('Tacos Jorge <br> 2287 W Broadway, Vancouver') + ._icon.classList.add('huechange'); } }); diff --git a/src/components/RegisterOrLogin.svelte b/src/components/RegisterOrLogin.svelte index 5b1b9a95..6e19c7d5 100644 --- a/src/components/RegisterOrLogin.svelte +++ b/src/components/RegisterOrLogin.svelte @@ -86,7 +86,10 @@ {#if pageID === 'signIn'} <div> - <label for="token" class="font-semibold">{$t('login.token')} <span class="text-secondary">({$t('login.optional')})</span></label> + <label for="token" class="font-semibold" + >{$t('login.token')} + <span class="text-secondary">({$t('login.optional')})</span></label + > <!-- svelte-ignore a11y-autofocus --> <input name="token" @@ -103,7 +106,7 @@ {$t('login.passwordRecommendation')} </p> {:else} - <!-- TODO --> + <!-- TODO --> <!-- <div class="flex justify-end items-center"> --> <!-- <a href="/forgot" class="underline underline-offset-4 text-black text-sm" --> <!-- >{$t('login.forgotUserOrPassword')}</a --> diff --git a/src/locales/en.json b/src/locales/en.json index 433a9668..875af05f 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -11,30 +11,30 @@ "p4": "Intra-account transfers between custodial wallets of different users on our server are completely free, instant, and unlimited.", "team": { "header": "The Team", - "adam": { - "name": "Adam Soltys", - "position": "Chief Technical Officer", - "bio": "Adam is a Web Developer and bitcoin enthusiast who believes sound money is a key tool to liberate humanity and increase global prosperity. He started working on a simple page for merchants to do price conversion and take bitcoin payments in 2012 and the rest is history! He lives in Vancouver with his wife Chelsea and two children." + "adam": { + "name": "Adam Soltys", + "position": "Chief Technical Officer", + "bio": "Adam is a Web Developer and bitcoin enthusiast who believes sound money is a key tool to liberate humanity and increase global prosperity. He started working on a simple page for merchants to do price conversion and take bitcoin payments in 2012 and the rest is history! He lives in Vancouver with his wife Chelsea and two children." }, - "secondl1ght": { - "name": "secondl1ght", - "position": "Web Developer", - "bio": "A self-taught Web Developer, secondl1ght dove head first down the bitcoin rabbit hole and left his fiat job to focus on bitcoin development full-time. He contributes to open source projects, is a privacy advocate, and freedom lover." + "secondl1ght": { + "name": "secondl1ght", + "position": "Web Developer", + "bio": "A self-taught Web Developer, secondl1ght dove head first down the bitcoin rabbit hole and left his fiat job to focus on bitcoin development full-time. He contributes to open source projects, is a privacy advocate, and freedom lover." }, - "shauna": { - "name": "Shauna", - "position": "Operations & Marketing", - "bio": "Strategic & Project Management. Jack of all Trades. Can always find time to meet for coffee." + "shauna": { + "name": "Shauna", + "position": "Operations & Marketing", + "bio": "Strategic & Project Management. Jack of all Trades. Can always find time to meet for coffee." }, - "cole": { - "name": "Cole Goodwin", - "position": "Bitcoin Professional", - "bio": "As a Certified Bitcoin Professional, Cole is a driven individual with a passion for freedom. He came across bitcoin in 2016 and studied it in depth. In summer 2021 he quit his 9-5 job due to the passive income from bitcoin & ASIC Mining. After discovering the lightning network, Cole met Adam. Now being a part of the coinos team, we want to introduce the lightning network to as many users as possible." + "cole": { + "name": "Cole Goodwin", + "position": "Bitcoin Professional", + "bio": "As a Certified Bitcoin Professional, Cole is a driven individual with a passion for freedom. He came across bitcoin in 2016 and studied it in depth. In summer 2021 he quit his 9-5 job due to the passive income from bitcoin & ASIC Mining. After discovering the lightning network, Cole met Adam. Now being a part of the coinos team, we want to introduce the lightning network to as many users as possible." }, - "john": { - "name": "John Barratt", - "position": "Full Stack Web Developer", - "bio": "When not coding you can find John out in the woods hiking all the great trails that BC has to offer." + "john": { + "name": "John Barratt", + "position": "Full Stack Web Developer", + "bio": "When not coding you can find John out in the woods hiking all the great trails that BC has to offer." } }, "locations": { @@ -70,7 +70,7 @@ "support": "Support", "telegram": "Telegram", "twitter": "Twitter", - "news": "News" + "news": "News" }, "howItWorks": { "header": "How It Works", @@ -122,7 +122,7 @@ } }, "login": { - "optional": "Optional", + "optional": "Optional", "token": "2FA Token", "username": "Username", "password": "Password", @@ -156,7 +156,7 @@ "fetchingRate": "fetching rate...", "optionalNote": "Note (Optional)", "send": "Send", - "receive": "Receive a Payment", + "receive": "Receive a Payment", "withdraw": "Withdraw" }, "receive": { diff --git a/src/routes/[username]/dashboard/+page.svelte b/src/routes/[username]/dashboard/+page.svelte index 9c9d8908..1605999a 100644 --- a/src/routes/[username]/dashboard/+page.svelte +++ b/src/routes/[username]/dashboard/+page.svelte @@ -55,25 +55,25 @@ <!-- >{$selectedRate ? btcPrice : $t('user.dashboard.fetchingRate')}</span --> <!-- > --> <!-- </span> --> - <!-- --> + <!-- --> <h3 class="text-secondary font-bold border-b pb-1 mt-10 mb-6 w-full md:w-[500px]"> {$t('user.dashboard.ACCOUNT_BALANCE')} </h3> - <span class="text-3xl font-bold block mb-1" - >{accountBalanceSats} SAT</span - > - - <span class="text-secondary text-xl block">{$selectedRate ? accountBalanceFiat : $t('user.dashboard.fetchingRate')}</span> + <span class="text-3xl font-bold block mb-1">{accountBalanceSats} SAT</span> - <div class="flex space-x-5"> - <button class="rounded-full border py-2 font-bold mt-4" on:click={toggle} - >{$t('user.dashboard.receive')}</button + <span class="text-secondary text-xl block" + >{$selectedRate ? accountBalanceFiat : $t('user.dashboard.fetchingRate')}</span > - <button class="rounded-full border py-2 font-bold mt-4" on:click={toggle} - >{$t('user.dashboard.withdraw')}</button - > - </div> + + <div class="flex space-x-5"> + <button class="rounded-full border py-2 font-bold mt-4" on:click={toggle} + >{$t('user.dashboard.receive')}</button + > + <button class="rounded-full border py-2 font-bold mt-4" on:click={toggle} + >{$t('user.dashboard.withdraw')}</button + > + </div> {:else} <div class="space-y-3 w-[250px] md:w-[500px] md:pr-20"> <button on:click={() => (withdrawing = false)}> diff --git a/src/routes/[username]/transactions/[...page]/+page.svelte b/src/routes/[username]/transactions/[...page]/+page.svelte index a5209ed8..8e91a010 100644 --- a/src/routes/[username]/transactions/[...page]/+page.svelte +++ b/src/routes/[username]/transactions/[...page]/+page.svelte @@ -5,11 +5,14 @@ import { f, s } from '$lib/utils'; export let data; - let { user } = data; + let { user } = data; $newPayment = false; - let page, total, transactions = [], pages = []; - $: data && ({ page, pages, total, transactions } = data); + let page, + total, + transactions = [], + pages = []; + $: data && ({ page, pages, total, transactions } = data); </script> <AppHeader /> @@ -20,17 +23,17 @@ </h1> <div class="container w-full mx-auto flex px-10 lg:px-40 mb-8 text-right"> - <div class="ml-auto flex"> - {#if pages.length > 1} - {#each pages as _, i} - <a href={`/${user.username}/transactions/${i+1}`} class:active={page === i + 1}> - <div class="border p-4 px-6 border-r-0 last:border-r"> - {i + 1} - </div> - </a> - {/each} - {/if} - </div> + <div class="ml-auto flex"> + {#if pages.length > 1} + {#each pages as _, i} + <a href={`/${user.username}/transactions/${i + 1}`} class:active={page === i + 1}> + <div class="border p-4 px-6 border-r-0 last:border-r"> + {i + 1} + </div> + </a> + {/each} + {/if} + </div> </div> <div class="container w-full mx-auto md:text-lg px-10 lg:px-40"> @@ -74,5 +77,7 @@ </div> <style> - .active { @apply font-bold; } + .active { + @apply font-bold; + } </style> diff --git a/src/routes/invoice/[id]/+page.svelte b/src/routes/invoice/[id]/+page.svelte index 978e2b9a..35bd06bb 100644 --- a/src/routes/invoice/[id]/+page.svelte +++ b/src/routes/invoice/[id]/+page.svelte @@ -52,9 +52,7 @@ $: tipAmountSats = s(tip); - $: totalAmountSats = s( - amount + parseFloat(tipAmountSats.replace(/,/g, '')) - ); + $: totalAmountSats = s(amount + parseFloat(tipAmountSats.replace(/,/g, ''))); let apply = async () => { tipPercent = (customTipAmount / amountFiat) * 100; |
