diff options
Diffstat (limited to 'src/routes')
| -rw-r--r-- | src/routes/+page.svelte | 68 |
1 files changed, 19 insertions, 49 deletions
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index f50db726..6bdd9699 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -10,45 +10,19 @@ Footer } from '$comp'; + import { _ } from 'svelte-i18n'; + let howItWorks; let faq; let about; const howItWorksSteps = [ - { - image: 'hand', - step: '1. Create your account', - description: 'A username & password is all you need to get started.' - }, - { - image: 'bolt', - step: '2. Ask for payments', - description: 'The same as you normally would, but with bitcoin.' - }, - { - image: 'smile', - step: "3. That's all!", - description: 'You can convert to local currency at any point.' - } + { image: 'hand', stepID: 'step1' }, + { image: 'bolt', stepID: 'step2' }, + { image: 'smile', stepID: 'step3' } ]; - const faqQuestions = [ - { - question: 'What does it cost?', - answer: - 'CoinOS is free to use. You only pay a 1% fee if/when you withdraw your funds. Compare this to 3% typically charged by a credit card processor.' - }, - { - question: 'Do I need any special device or software?', - answer: - 'No. CoinOS is web-based, so as long as you have an internet connection, you can use it on any device or hardware. Most merchants might use it on a phone or a tablet.' - }, - { - question: 'Are my funds safe?', - answer: - 'Your funds are stored on our secure server, however we recommend that you withdraw them to your own cold storage for long-term savings.' - } - ]; + const faqIDs = ["cost", "compatibility", "safety"]; </script> <LandingHeader {howItWorks} {faq} {about} /> @@ -60,45 +34,41 @@ <!-- landing info 1 --> <LandingInfoCard image="lightning-qr" - title="Instant payments via Lightning." - description="The moment your customer sends a payment, it’s there. No waiting for bank settlements or - worrying about chargebacks. Instant settlement, in seconds. Say goodbye to 3% credit card - processing fees." + title={$_('landing.info1.title')} + description={$_('landing.info1.description')} /> <!-- landing info 2 --> <LandingInfoCard image="phone-checkout" - title="Simple to use, custodial by default." + title={$_('landing.info2.title')} order="reverse" > - Just enter an amount, share QR code and you’re done. + {$_('landing.info2.description1')} <br /><br /> - CoinOS is custodial by default, which eliminates the need to understand how bitcoin/lightning works. - We do all the heavy lifting so you can focus on your business. + {$_('landing.info2.description2')} <br /><br /> - You always have the option of - <span class="underline underline-offset-4">taking custody</span> of your own keys. + {@html $_('landing.info2.description3')} </LandingInfoCard> <!-- landing info 3 --> <div> <LandingInfoCard image="customize" - title="Brand it your way!" - description="Customize your point of sale look and feel, or keep it on default - totally up to you." + title={$_('landing.info3.title')} + description={$_('landing.info3.description')} /> <div bind:this={howItWorks} /> </div> <!-- how it works --> <div> - <h3 class="text-5xl font-medium mb-10 text-center">How it works</h3> + <h3 class="text-5xl font-medium mb-10 text-center">{$_('howItWorks.header')}</h3> <div class="block lg:flex justify-center items-center space-y-10 lg:space-y-0 lg:space-x-10 text-center" > {#each howItWorksSteps as step} - <HowItWorksCard image={step.image} step={step.step} description={step.description} /> + <HowItWorksCard image={step.image} stepID={step.stepID} /> {/each} </div> <div bind:this={faq} /> @@ -107,9 +77,9 @@ <!-- faq --> <div> <div class="space-y-10"> - <h3 class="text-5xl font-medium text-center">FAQ</h3> - {#each faqQuestions as question} - <FaqCard question={question.question} answer={question.answer} /> + <h3 class="text-5xl font-medium text-center">{$_('faq.header')}</h3> + {#each faqIDs as faqID} + <FaqCard questionID={faqID} /> {/each} </div> <div bind:this={about} /> |