diff options
24 files changed, 175 insertions, 129 deletions
@@ -1,4 +1,4 @@ -# coinos-ui-v2 +# coinos-ui-v2 coinos is an easy to use bitcoin point of sale application for businesses and wallet for customers, connecting the bitcoin circular economy together. @@ -28,4 +28,3 @@ This UI uses the following libraries: ### Internationalization coinos has a system for translation using [`sveltekit-i18n`](https://www.npmjs.com/package/sveltekit-i18n). For more information and instructions on how to translate coinos, click [here](./doc/i18n.md). For technical details, click [here](./doc/i18n-technical.md). - diff --git a/doc/i18n-technical.md b/doc/i18n-technical.md index 4ea2adbe..3f6a09d5 100644 --- a/doc/i18n-technical.md +++ b/doc/i18n-technical.md @@ -23,7 +23,7 @@ Each locale in `coinos-ui-v2` is defined by a JSON file in `src/locales`. Its na ```json { - "howItWorks": "How It Works", + "howItWorks": "How it works", "faq": "FAQ", "about": "About", "startInSeconds": "Start in Seconds", diff --git a/doc/i18n.md b/doc/i18n.md index 57172464..c54f6461 100644 --- a/doc/i18n.md +++ b/doc/i18n.md @@ -20,7 +20,7 @@ Each translation of coinos is stored in a special _locale file_. These files can ```JSON { - "howItWorks": "How It Works", + "howItWorks": "How it works", "faq": "FAQ", "about": "About", "startInSeconds": "Start in Seconds", diff --git a/src/components/About.svelte b/src/components/About.svelte index 9857aa92..cf45a253 100644 --- a/src/components/About.svelte +++ b/src/components/About.svelte @@ -42,22 +42,22 @@ <h3 class="text-5xl font-medium mb-10 text-center">{$t('about.header')}</h3> <div - class="container grid lg:grid-cols-3 gap-20 text-secondary text-xl relative px-20 mx-auto" + class="container grid lg:grid-cols-3 gap-20 text-secondary text-xl relative md:px-20 mx-auto space-y-5 md:space-y-0" > <p> {@html $t('about.p1')} </p> <p> + {@html $t('about.p2')} + </p> + <p> {@html $t('about.p3')} </p> - <p> - {@html $t('about.p4')} - </p> <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"> + <div class="container mt-40"> <h3 class="text-5xl font-medium mb-10 text-center"> {$t('about.team.header')} </h3> @@ -97,7 +97,7 @@ </div> </div> -<div class="mt-20"> +<div class="mt-40"> <h3 class="text-5xl font-medium mb-5 text-center">{$t('about.locations.header')}</h3> <p class="text-secondary text-xl w-full md:w-10/12 lg:w-2/3 2xl:w-[800px] mx-auto mb-10"> {@html $t('about.locations.description')} diff --git a/src/components/AppHeader.svelte b/src/components/AppHeader.svelte index 04426bd3..f0272fe1 100644 --- a/src/components/AppHeader.svelte +++ b/src/components/AppHeader.svelte @@ -116,20 +116,20 @@ </nav> {#if $subject?.profile} <div - class="absolute {avatarPosition} rounded-full overflow-hidden text-center w-24 h-24 my-auto" + class="absolute top-[111px] {avatarPosition} rounded-full border-4 border-white overflow-hidden w-32 h-32" > <img src={$tempProfileFiles && $tempProfileFiles.profile ? $tempProfileFiles.profile : `/api/public/${$subject.username}-profile.png`} - class="absolute w-full h-full object-cover object-center visible overflow-hidden" + class="w-full h-full object-cover object-center overflow-hidden" /> </div> {:else} <div - class="absolute top-[calc(175px-48px)] {avatarPosition} rounded-full border-4 border-white p-4 bg-gradient-to-r {$colorTheme} w-24 h-24" + class="absolute top-[111px] {avatarPosition} rounded-full border-4 border-white p-4 bg-gradient-to-r {$colorTheme} w-32 h-32 flex justify-center items-center" > - <Icon icon="logo-symbol-white" style="mx-auto" /> + <Icon icon="logo-symbol-white" /> </div> {/if} </header> diff --git a/src/components/LandingHero.svelte b/src/components/LandingHero.svelte index 6fcaf075..466a6194 100644 --- a/src/components/LandingHero.svelte +++ b/src/components/LandingHero.svelte @@ -8,7 +8,7 @@ <div class="mt-[96.88px] md:mt-0"> <div class="space-y-10"> <h1 - class="text-5xl md:text-6xl lg:text-7xl 2xl:text-8xl font-medium text-center w-full md:w-3/4 lg:w-1/2 max-w-7xl mx-auto leading-tight" + class="text-5xl md:text-6xl lg:text-7xl font-medium text-center w-full md:w-3/4 lg:w-1/2 max-w-7xl mx-auto leading-tight" > {$t('landing.header_before_icon')} <span class="relative"> diff --git a/src/components/LocationsMap.svelte b/src/components/LocationsMap.svelte index b1d9ce55..2227a831 100644 --- a/src/components/LocationsMap.svelte +++ b/src/components/LocationsMap.svelte @@ -9,7 +9,7 @@ if (browser) { const leaflet = await import('leaflet'); - map = leaflet.map(mapElement).setView([49.267265, -123.1491965], 13); + map = leaflet.map(mapElement, { attributionControl: false }).setView([0, 0], 0); const myCustomColour = 'orange'; @@ -76,6 +76,15 @@ .bindPopup(location.info) ._icon.classList.add('huechange'); }); + + map.fitBounds([ + [locations[0].lat, locations[0].long], + [locations[1].lat, locations[1].long], + [locations[2].lat, locations[2].long], + [locations[3].lat, locations[3].long], + [locations[4].lat, locations[4].long], + [locations[5].lat, locations[5].long] + ]); } }); diff --git a/src/components/Quote.svelte b/src/components/Quote.svelte index 23094325..1e099061 100644 --- a/src/components/Quote.svelte +++ b/src/components/Quote.svelte @@ -1,10 +1,11 @@ <svg - aria-hidden="true" - class="w-10 h-10 text-gray-400 dark:text-gray-600" - viewBox="0 0 24 27" - fill="none" - xmlns="http://www.w3.org/2000/svg" - ><path - d="M14.017 18L14.017 10.609C14.017 4.905 17.748 1.039 23 0L23.995 2.151C21.563 3.068 20 5.789 20 8h34V18H14.017ZM0 18V10.609C0 4.905 3.748 1.038 9 0L9.996 2.151C7.563 3.068 6 5.789 6 8H9.983L9.983 18L0 18Z" - fill="currentColor" - /></svg> + aria-hidden="true" + class="w-10 h-10 text-gray-400 dark:text-gray-600" + viewBox="0 0 24 27" + fill="none" + xmlns="http://www.w3.org/2000/svg" + ><path + d="M14.017 18L14.017 10.609C14.017 4.905 17.748 1.039 23 0L23.995 2.151C21.563 3.068 20 5.789 20 8h34V18H14.017ZM0 18V10.609C0 4.905 3.748 1.038 9 0L9.996 2.151C7.563 3.068 6 5.789 6 8H9.983L9.983 18L0 18Z" + fill="currentColor" + /></svg +> diff --git a/src/locales/en.json b/src/locales/en.json index 05475831..a6afe366 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -5,9 +5,9 @@ }, "about": { "header": "About", - "p1": "Coinos is an open source bitcoin payment app. Development started in Vancouver in September 2012 as a way to provide local merchants with a convenient way to accept bitcoin payments.", - "p3": "You can download the source code to run an instance and connect it to your own bitcoin and lightning nodes. We'll help you get started being a benevolent custodian and payments provider for your community.", - "p4": "Account transfers amongst users on our server are done off-chain so they're completely free, instant, and unlimited.", + "p1": "coinos is an open source bitcoin payment app. Development started in Vancouver in September 2012 as a way to provide local merchants with a convenient way to accept bitcoin payments.", + "p2": "You can download the source code to run an instance and connect it to your own bitcoin and lightning nodes. We'll help you get started being a benevolent custodian and payments provider for your community.", + "p3": "Account transfers amongst users on our server are done off-chain so they're completely free, instant, and unlimited.", "team": { "header": "The Team", "adam": { @@ -56,7 +56,7 @@ "header": "FAQ", "cost": { "question": "What does it cost?", - "answer": "Coinos is free to use. You pay nothing to register and maintain your account. You can send and receive unlimited payments over the lightning network at no cost. We charge a 0.1% conversion fee if you need to move your funds off of lightning to an on-chain bitcoin address at an external wallet or exchange." + "answer": "coinos is free to use. You pay nothing to register and maintain your account. You can send and receive unlimited payments over the lightning network at no cost. We charge a 0.1% conversion fee if you need to move your funds off of lightning to an on-chain bitcoin address at an external wallet or exchange." }, "compatibility": { "question": "Do I need any special device or software?", @@ -78,7 +78,7 @@ "news": "News" }, "howItWorks": { - "header": "How It Works", + "header": "How it works", "step1": { "header": "1. Create your account", "description": "A username and password is all you need to get started." @@ -118,7 +118,7 @@ "info2": { "title": "Simple to use", "description1": "Just enter an amount in your local currency, share the QR code and you’re done.", - "description2": "Coinos gives you free access to use our hosted bitcoin and lightning nodes, eliminating the need to understand how bitcoin or lightning works. We do all the heavy lifting so you can focus on your business.", + "description2": "coinos gives you free access to use our hosted bitcoin and lightning nodes, eliminating the need to understand how bitcoin or lightning works. We do all the heavy lifting so you can focus on your business.", "description3": "You always have the option of taking custody of your funds by withdrawing instantly at any time." }, "info3": { @@ -160,7 +160,7 @@ "scanToPayBTC": "Scan to pay with bitcoin", "dashboard": { "ACCOUNT_BALANCE": "ACCOUNT BALANCE", - "bitcoinPrice": "Bitcoin Price:", + "bitcoinPrice": "bitcoin Price:", "conversionFeeWarning": "You will be charged a 1% withdrawal fee on the amount.", "dataFromBinance": "Data from <span class=\"text-black\">Binance</span>.", "fetchingRate": "fetching rate...", @@ -195,7 +195,7 @@ "themeDescription": "Select from the default color themes.", "localCurrency": "Local Currency", "btcUnit": "Display bitcoin in:", - "bitcoin": "Bitcoin", + "bitcoin": "bitcoin", "satoshis": "Satoshis", "securityPIN": "Security PIN", "securityPINDescription": "Set a security pin that will be used to unlock your settings and to send outgoing payments.", diff --git a/src/locales/fr.json b/src/locales/fr.json index 69fb6e18..221679ab 100644 --- a/src/locales/fr.json +++ b/src/locales/fr.json @@ -17,7 +17,7 @@ "bitcoin": "Utilisant bitcoin depuis 2011", "webDev": "20+ ans d'experience de programmation web en gouvernement et industrie", "bitcoinVancouver": "Organisateur précoce de la rencontre bitcoin Vancouver", - "bitcoinCoop": "Fondateur de The Bitcoin Co-op et défenseur précoce de Decentral Vancouver", + "bitcoinCoop": "Fondateur de The bitcoin Co-op et défenseur précoce de Decentral Vancouver", "beliefs": "Yogi, permaculturiste, anarchiste, décentraliste", "familialRelationships": "Mari, père, frère, fils" } @@ -36,7 +36,7 @@ "header": "FAQ", "cost": { "question": "Qu'est-ce que c'est le coût?", - "answer": "coinos est gratuit à utiliser. Vous seulment payez un prix 1% quand vous convertez vos fonds entre Bitcoin, Liquid et Lightning. Comparez-ça à les frais de dossir typiques 3% des cartes credit." + "answer": "coinos est gratuit à utiliser. Vous seulment payez un prix 1% quand vous convertez vos fonds entre bitcoin, Liquid et Lightning. Comparez-ça à les frais de dossir typiques 3% des cartes credit." }, "compatibility": { "question": "Est-ce que j'ai besoin du logiciel ou appareil special?", @@ -129,11 +129,11 @@ "user": { "follow": "Suivre", "remove": "Enlève", - "scanToPayBTC": "Scanner pour payer avec Bitcoin", + "scanToPayBTC": "Scanner pour payer avec bitcoin", "dashboard": { "ACCOUNT_BALANCE": "SOLDE", - "bitcoinPrice": "Prix de Bitcoin:", - "conversionFeeWarning": "Il y a un prix de 1% pour convertir entre Bitcoin, Liquid et Lightning.", + "bitcoinPrice": "Prix de bitcoin:", + "conversionFeeWarning": "Il y a un prix de 1% pour convertir entre bitcoin, Liquid et Lightning.", "dataFromBinance": "Données de <span class=\"text-black\">Binance</span>.", "fetchingRate": "cherchant taut de change...", "optionalNote": "Note (optionel)", @@ -162,7 +162,7 @@ "themeDescription": "Sélectionnez des thèmes dèfauts.", "localCurrency": "Monnaie Local", "btcUnit": "Voire bitcoin en:", - "bitcoin": "Bitcoin", + "bitcoin": "bitcoin", "satoshis": "Satoshis", "securityPIN": "NIP de Sécurité", "securityPINDescription": "Choisir un NIP de sécurité qui sera necessaire pour ouvrir tes préférences et pour envoyer des paiements sortants.", diff --git a/src/routes/+layout.server.js b/src/routes/+layout.server.js index b9df94c1..77ca7eaa 100644 --- a/src/routes/+layout.server.js +++ b/src/routes/+layout.server.js @@ -9,11 +9,11 @@ export async function load({ request, setHeaders, url, params }) { let { token } = cookie.parse(request.headers.get('cookie') || ''); let user; let rates; - let subject; + let subject; - if (params.username) { - subject = await get(`/users/${params.username}`); - } + if (params.username) { + subject = await get(`/users/${params.username}`); + } if (token) { try { diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index e260af38..bf347292 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -15,7 +15,7 @@ export let data; - $: $subject = data.subject; + $: $subject = data.subject; $: $token = data.token; $: $user = data.user; diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 5d00f272..09d7ff54 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -28,11 +28,12 @@ <!-- banner --> <div class="mt-[101.7px] md:mt-0 w-full text-center py-4 border border-b-black text-secondary"> <p> - Welcome to the <a href="/news" class="underline underline-offset-4 text-black" + Welcome to the <a href="/news" class="underline underline-offset-4 text-black hover:opacity-80" >new and improved coinos</a >, focused on merchant adoption! Looking for the old coinos? Visit - <a href="https://classic.coinos.io" class="underline underline-offset-4 text-black" - >classic.coinos.io</a + <a + href="https://classic.coinos.io" + class="underline underline-offset-4 text-black hover:opacity-80">classic.coinos.io</a >. </p> </div> @@ -72,9 +73,7 @@ <!-- how it works --> <div> <h3 class="text-5xl font-medium mb-10 text-center">{$t('howItWorks.header')}</h3> - <div - class="grid lg:grid-cols-3 space-y-10 lg:space-y-0 text-center" - > + <div class="grid lg:grid-cols-3 space-y-10 lg:space-y-0 text-center"> {#each howItWorksSteps as step} <HowItWorksCard image={step.image} stepID={step.stepID} /> {/each} diff --git a/src/routes/[username]/+page.svelte b/src/routes/[username]/+page.svelte index de8c3a26..1bbd6e66 100644 --- a/src/routes/[username]/+page.svelte +++ b/src/routes/[username]/+page.svelte @@ -35,16 +35,18 @@ let followed = false; </script> - <AppHeader avatarPosition="left-[calc(15vw-48px)]" /> +<AppHeader avatarPosition="left-[calc(15vw-48px)]" /> - <div class="flex xl:block justify-center items-center my-20 px-3"> - <div class="space-y-10 xl:space-y-0"> - <div class="xl:ml-[calc(15vw-48px)] space-y-2 w-full md:w-72"> - <h1 class="text-3xl font-bold">{$subject.username}</h1> +<div class="flex xl:block justify-center items-center my-20 px-3"> + <div class="space-y-10 xl:space-y-0"> + <div class="xl:ml-[calc(15vw-48px)] space-y-2 w-full md:w-72"> + <h1 class="text-3xl font-bold">{$subject.username}</h1> - <p class="text-secondary">{$subject.address && $subject.address !== "null" ? $subject.address : ''}</p> + <p class="text-secondary"> + {$subject.address && $subject.address !== 'null' ? $subject.address : ''} + </p> - <!-- TODO + <!-- TODO we need to hook this up <button class="border rounded-full py-2 w-28 font-semibold flex justify-center items-center text-sm" @@ -53,25 +55,25 @@ {$t('user.' + (followed ? 'remove' : 'follow'))} </button> --> - </div> + </div> - <div class="space-y-5 static xl:absolute top-[255px] left-[calc(50vw-150px)]"> - <div - on:click={() => copy(lightningAddress)} - id="qr" - class=" cursor-pointer w-[292px] md:w-[342px] h-[342px] border border-lightgrey rounded-3xl flex p-5 justify-center items-center relative" - /> + <div class="space-y-5 static xl:absolute top-[255px] left-[calc(50vw-150px)]"> + <div + on:click={() => copy(lightningAddress)} + id="qr" + class="cursor-pointer w-[292px] md:w-[342px] h-[342px] border border-lightgrey rounded-3xl flex p-5 justify-center items-center relative" + /> - <p class="text-secondary text-center font-semibold">{$t('user.scanToPayBTC')}</p> + <p class="text-secondary text-xl text-center font-semibold">{$t('user.scanToPayBTC')}</p> - <div - class="bg-primary font-semibold rounded-xl text-sm py-2 px-3 flex flex-wrap justify-center items-center" - > - <span>{lightningAddress}</span> - <button class="hover:opacity-80" on:click={() => copy(lightningAddress)}> - <Icon icon="copy" style="ml-2" /> - </button> - </div> + <div + class="bg-primary font-semibold rounded-xl text-sm p-3 flex flex-wrap justify-between items-center" + > + <span>{lightningAddress}</span> + <button class="hover:opacity-80" on:click={() => copy(lightningAddress)}> + <Icon icon="copy" style="ml-2" /> + </button> </div> </div> </div> +</div> diff --git a/src/routes/[username]/dashboard/+page.svelte b/src/routes/[username]/dashboard/+page.svelte index 7e424819..4c0917dc 100644 --- a/src/routes/[username]/dashboard/+page.svelte +++ b/src/routes/[username]/dashboard/+page.svelte @@ -11,7 +11,8 @@ let payreq = '', payreqField, - withdrawing; + withdrawing, + loading; let toggle = async () => { payreq = ''; @@ -21,11 +22,14 @@ }; let withdraw = async () => { + loading = true; try { await post('/withdraw', { payreq }); withdrawing = false; + loading = false; } catch (e) { failure(e.message); + loading = false; } }; @@ -40,8 +44,8 @@ <AppHeader avatarPosition="left-[calc(50vw-48px)] lg:left-[calc(15vw-48px)]" /> -<div class="text-center mx-auto lg:text-left lg:mx-0 lg:ml-[calc(15vw-48px)] mt-12 w-full md:w-72"> - <h2 class="text-2xl font-semibold">{user.username}</h2> +<div class="text-center mx-auto lg:text-left lg:mx-0 lg:ml-[calc(15vw-48px)] mt-20 w-full md:w-72"> + <h2 class="text-3xl font-semibold">{user.username}</h2> <span class="text-secondary">{user.address}</span> </div> @@ -81,7 +85,7 @@ {:else} <div class="space-y-3 w-[250px] md:w-[500px] md:pr-20"> <button on:click={() => (withdrawing = false)}> - <Icon icon="arrow-left" style="w-8" /> + <Icon icon="arrow-left" style="w-8 hover:opacity-80" /> </button> <div> @@ -110,8 +114,33 @@ class="{!payreq ? 'opacity-50' : 'opacity-100 hover:opacity-80'} rounded-2xl border py-3 font-bold w-full mt-2 bg-black text-white" - on:click={withdraw}>{$t('user.dashboard.send')}</button + on:click={withdraw} > + {#if loading} + <svg + class="mx-auto h-6 w-6 animate-spin text-white" + xmlns="http://www.w3.org/2000/svg" + fill="none" + viewBox="0 0 24 24" + > + <circle + class="opacity-25" + cx="12" + cy="12" + r="10" + stroke="currentColor" + stroke-width="4" + /> + <path + class="opacity-75" + fill="currentColor" + d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" + /> + </svg> + {:else} + {$t('user.dashboard.send')} + {/if} + </button> </div> {/if} </div> diff --git a/src/routes/[username]/receive/+page.svelte b/src/routes/[username]/receive/+page.svelte index 6a286071..ba443ff2 100644 --- a/src/routes/[username]/receive/+page.svelte +++ b/src/routes/[username]/receive/+page.svelte @@ -87,7 +87,7 @@ {#if $user} <AppHeader /> - <div class="flex justify-center items-center mt-20 mb-3 px-3"> + <div class="flex justify-center items-center mt-24 mb-3 px-3"> {#if $selectedRate} <div class="space-y-5"> <!-- amounts --> @@ -172,7 +172,7 @@ <div class="space-y-3 w-full md:w-[300px] mx-auto"> <button - class="bg-black text-white rounded-xl w-full h-[48px] flex justify-center items-center font-semibold text-sm {$invoiceAmount === + class="bg-black text-white rounded-xl w-full h-[48px] flex justify-center items-center font-semibold {$invoiceAmount === 0 || loading ? 'opacity-50' : 'opacity-100 hover:opacity-80'}" diff --git a/src/routes/[username]/settings/+page.svelte b/src/routes/[username]/settings/+page.svelte index e3acc93c..978f537a 100644 --- a/src/routes/[username]/settings/+page.svelte +++ b/src/routes/[username]/settings/+page.svelte @@ -37,8 +37,8 @@ <AppHeader /> -<form on:submit|preventDefault={save} class="mb-28"> - <div class="my-20 px-3 md:px-0 w-full md:w-[400px] mx-auto space-y-8"> +<form on:submit|preventDefault={save} class="mb-[154px]"> + <div class="mt-24 mb-20 px-3 md:px-0 w-full md:w-[400px] mx-auto space-y-8"> <h1 class="text-center text-3xl md:text-4xl font-semibold mb-10"> {$t('user.settings.header')} </h1> @@ -55,9 +55,13 @@ <svelte:component this={comp} /> </div> - <div class="z-10 fixed bottom-0 bg-white shadow border w-full"> - <button type="submit" class="primary"> - <Icon icon="save" style="mr-1" /> + <div + class="z-10 fixed bottom-0 bg-white shadow border-t w-full flex justify-center items-center py-3" + > + <button + type="submit" + class="bg-black text-white rounded-xl font-semibold mx-auto py-3 w-40 hover:opacity-80" + > <div class="my-auto">Save Settings</div> </button> </div> diff --git a/src/routes/[username]/settings/_account.svelte b/src/routes/[username]/settings/_account.svelte index dbaea87e..ff7676f4 100644 --- a/src/routes/[username]/settings/_account.svelte +++ b/src/routes/[username]/settings/_account.svelte @@ -213,6 +213,7 @@ {/if} </div> +<!-- TODO <div> <span class="font-bold mb-1 block">{$t('user.settings.theme')}</span> <p class="text-secondary mb-1">{$t('user.settings.themeDescription')}</p> @@ -226,4 +227,4 @@ on:click={() => handleThemeClick(colors)} /> {/each} -</div> +</div> --> diff --git a/src/routes/[username]/settings/_security.svelte b/src/routes/[username]/settings/_security.svelte index b74193cf..1b8fb125 100644 --- a/src/routes/[username]/settings/_security.svelte +++ b/src/routes/[username]/settings/_security.svelte @@ -36,7 +36,7 @@ toggleEnabling(); } } catch (e) { - failure('Failed to enable 2fa, try again'); + failure('Failed to enable 2FA, try again'); } }; @@ -50,13 +50,14 @@ toggleDisabling(); } } catch (e) { - failure('Failed to disable 2fa, try again'); + failure('Failed to disable 2FA, try again'); } }; $: otpUri = `otpauth://totp/coinos:${$user.username}?secret=${$user.otpsecret}&period=30&digits=6&algorithm=SHA1&issuer=coinos`; </script> +<!-- TODO <div> <span class="font-bold mb-1">{$t('user.settings.securityPIN')}</span> <p class="text-secondary mb-1"> @@ -80,9 +81,9 @@ ><Icon icon="lock" style="mr-1" /> {$t('user.settings.setPIN')}</button > {/if} -</div> +</div> --> -<!-- TODO --> +<!-- TODO <div> <label for="auto-lock" class="font-bold mb-1">{$t('user.settings.autoLock')}</label> <p class="text-secondary mb-1"> @@ -95,7 +96,7 @@ <option value="60">1 h</option> <option value="480">8 h</option> </select> -</div> +</div> --> <div> <span class="font-bold mb-1">{$t('user.settings.twofa')}</span> diff --git a/src/routes/[username]/support/+page.svelte b/src/routes/[username]/support/+page.svelte index acaa8d2b..663ba8a6 100644 --- a/src/routes/[username]/support/+page.svelte +++ b/src/routes/[username]/support/+page.svelte @@ -10,7 +10,7 @@ {#if $user} <AppHeader /> - <div class="my-20"> + <div class="mt-24 mb-20"> <h1 class="text-center text-3xl md:text-4xl font-semibold mb-10"> {$t('user.support.header')} </h1> diff --git a/src/routes/[username]/transactions/[...page]/+page.svelte b/src/routes/[username]/transactions/[...page]/+page.svelte index 2e9cb70e..0eef04fe 100644 --- a/src/routes/[username]/transactions/[...page]/+page.svelte +++ b/src/routes/[username]/transactions/[...page]/+page.svelte @@ -17,7 +17,7 @@ <AppHeader /> -<div class="my-20"> +<div class="mt-24 mb-20"> <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold mb-10"> {$t('user.transactions.header')} </h1> @@ -36,7 +36,7 @@ </div> </div> - <div class="container w-full mx-auto md:text-lg px-10 lg:px-40"> + <div class="container w-full mx-auto md:text-lg px-10 lg:px-72"> <div class="text-secondary grid grid-cols-3 mb-5"> <h2>{$t('user.transactions.AMOUNT')}</h2> <h2 class="text-center">{$t('user.transactions.TYPE')}</h2> diff --git a/src/routes/invoice/[id]/+page.svelte b/src/routes/invoice/[id]/+page.svelte index 67cd8efa..d935affb 100644 --- a/src/routes/invoice/[id]/+page.svelte +++ b/src/routes/invoice/[id]/+page.svelte @@ -181,7 +181,8 @@ > <button class="hidden {showCustomAmount ? 'md:block' : ''}" - on:click={() => (showCustomAmount = false)}><Icon icon="close" /></button + on:click={() => (showCustomAmount = false)} + ><Icon icon="close" style="hover:opacity-80" /></button > </div> <h1 class="hidden md:block text-4xl font-semibold">{$t('invoice.addTipq')}</h1> @@ -258,7 +259,7 @@ /> <!-- invoice section --> - <div class="text-center space-y-5"> + <div class="text-center space-y-5 max-w-[300px]"> <button class="block md:hidden bg-black {showMobileTip ? 'text-white/50' @@ -286,11 +287,13 @@ </button> <!-- found missing translation ---> - <span class="text-secondary block" - >Scan to pay <a href="/{username}" class="text-black font-semibold">{username}</a></span + <span class="text-secondary block text-2xl break-all" + >Scan to pay <a href="/{username}" class="text-black font-semibold hover:opacity-80" + >{username}</a + ></span > - <div class="border border-gray-200 rounded-2xl"> + <div class="border border-gray-200 rounded-3xl"> <Qr {text} {image} disabled={showMobileTip} bind:qr /> </div> diff --git a/src/routes/launch-party/+page.svelte b/src/routes/launch-party/+page.svelte index be9392f4..5c6e643a 100644 --- a/src/routes/launch-party/+page.svelte +++ b/src/routes/launch-party/+page.svelte @@ -1 +1 @@ -Launch party!!!!!!!!!!!!!!!! +Launch party! diff --git a/src/routes/news/+page.svelte b/src/routes/news/+page.svelte index 9cee610c..7eb1b7d9 100644 --- a/src/routes/news/+page.svelte +++ b/src/routes/news/+page.svelte @@ -11,25 +11,23 @@ <h2 class="text-2xl font-medium">{$t('news.subheader')}</h2> - <p class="text-justify text-xl text-secondary"> - Press Release - Coinos Redesign - September 23, 2022 - </p> + <p class="text-xl font-semibold">Press Release - coinos Redesign - September 23, 2022</p> - <p> - Today Coinos is launching a new and improved interface for their open source web wallet, - allowing businesses to accept Bitcoin with no setup or merchant fees. + <p class="text-xl text-secondary"> + Today coinos is launching a new and improved interface for their open source web wallet, + allowing businesses to accept bitcoin with no setup or merchant fees. </p> - <p> - Coinos is a web-based bitcoin payment application that is mobile and tablet friendly with handy currency - conversion and reporting features. Bitcoin is the world's leading digital currency. It + <p class="text-xl text-secondary"> + coinos is a web-based bitcoin payment application that is mobile and tablet friendly with handy + currency conversion and reporting features. bitcoin is the world's leading crypto currency. It offers a secure and inexpensive way for people all over the globe to make and accept payments. </p> <blockquote - class="p-4 my-4 bg-gray-50 border-l-4 border-gray-300 dark:border-gray-500 dark:bg-gray-800" + class="p-4 my-4 bg-gray-50 border-l-4 border-gray-300 dark:border-gray-500 dark:bg-gray-800 text-xl text-secondary" > - <Quote /> Coinos has enabled businesses to accept Bitcoin since 2012, but now we have made it even + <Quote /> coinos has enabled businesses to accept bitcoin since 2012, but now we have made it even easier with a new simple, friendly and customizable interface for both businesses and customers to use. <figcaption class="flex justify-center items-center mt-6 space-x-3"> @@ -42,21 +40,21 @@ </figcaption> </blockquote> - <p> - Coinos started as an indie bitcoin wallet created by Adam Soltys with the intention of providing - people with a fast, cheap, and easy way to get started with bitcoin. it's free to register an + <p class="text-xl text-secondary"> + coinos started as an indie bitcoin wallet created by Adam Soltys with the intention of providing + people with a fast, cheap, and easy way to get started with bitcoin. It's free to register an account and you can sign up with just a username and password. </p> - <h3 class="text-xl font-medium">Why accept Bitcoin?</h3> + <h3 class="text-xl font-semibold">Why accept bitcoin?</h3> <blockquote - class="p-4 my-4 bg-gray-50 border-l-4 border-gray-300 dark:border-gray-500 dark:bg-gray-800" + class="p-4 my-4 bg-gray-50 border-l-4 border-gray-300 dark:border-gray-500 dark:bg-gray-800 text-xl text-secondary" > <Quote /> We have already brought on some local businesses, here in Vancouver, and the business owners are - excited about the opportunity Coinos is giving them to attract new customers by being able to - accept Bitcoin. With Coinos there are no set up fees, no merchant fees and transactions are safe - and secure with payments going directly to the business owner's wallet. There is no middle person. + excited about the opportunity coinos is giving them to attract new customers by being able to accept + bitcoin. With coinos there are no set up fees, no merchant fees and transactions are safe and secure + with payments going directly to the business owner's wallet. There is no middle person. <figcaption class="flex justify-center items-center mt-6 space-x-3"> <img class="w-6 h-6 rounded-full" src="/images/cole.webp" alt="Adam Soltys" /> <div class="flex items-center divide-x-2 divide-gray-500 dark:divide-gray-700"> @@ -68,8 +66,8 @@ </figcaption> </blockquote> - <h3 class="text-xl font-medium">Coinos Timeline</h3> - <ul> + <h3 class="text-xl font-semibold">coinos Timeline</h3> + <ul class="text-xl text-secondary"> <li class="flex items-center space-x-3"> <Check /> 2012 Coding started @@ -88,7 +86,7 @@ </li> <li class="flex items-center space-x-3"> <Check /> - 2021 Liquid network and asset issuance supported + 2021 Liquid Network and asset issuance supported </li> <li class="flex items-center space-x-3"> <Check /> @@ -96,21 +94,21 @@ </li> </ul> - <h3 class="text-xl font-medium">Contacts</h3> + <h3 class="text-xl font-semibold">Contacts</h3> - <p> + <p class="text-xl text-secondary"> <b>Adam Soltys</b> - Founder & CTO<br /> - <a class="hover:text-gray-500" href="mailto:[email protected] ">[email protected]</a> + <a class="hover:opacity-80" href="mailto:[email protected] ">[email protected]</a> </p> - <p> + <p class="text-xl text-secondary"> <b>Cole Goodwin</b> - Bitcoin Professional<br /> - <a class="hover:text-gray-500" href="mailto:[email protected]">[email protected]</a> + <a class="hover:opacity-80" href="mailto:[email protected]">[email protected]</a> </p> - <p> + <p class="text-xl text-secondary"> <b>Shauna Collister</b> - Operations & Marketing<br /> - <a class="hover:text-gray-500" href="mailto:[email protected]">[email protected]</a> + <a class="hover:opacity-80" href="mailto:[email protected]">[email protected]</a> </p> </div> |