|
|
|
@ -12,6 +12,7 @@ |
|
|
|
<script lang="ts"> |
|
|
|
<script lang="ts"> |
|
|
|
import { Button, Alert, Dropzone, Toggle } from "flowbite-svelte"; |
|
|
|
import { Button, Alert, Dropzone, Toggle } from "flowbite-svelte"; |
|
|
|
import { link, querystring } from "svelte-spa-router"; |
|
|
|
import { link, querystring } from "svelte-spa-router"; |
|
|
|
|
|
|
|
import CenteredLayout from "../lib/CenteredLayout.svelte"; |
|
|
|
// @ts-ignore |
|
|
|
// @ts-ignore |
|
|
|
import EULogo from "../assets/EU.svg?component"; |
|
|
|
import EULogo from "../assets/EU.svg?component"; |
|
|
|
// @ts-ignore |
|
|
|
// @ts-ignore |
|
|
|
@ -388,6 +389,7 @@ |
|
|
|
}; |
|
|
|
}; |
|
|
|
</script> |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<CenteredLayout> |
|
|
|
{#if wait} |
|
|
|
{#if wait} |
|
|
|
<div class=" max-w-6xl lg:px-8 mx-auto px-4 text-primary-700"> |
|
|
|
<div class=" max-w-6xl lg:px-8 mx-auto px-4 text-primary-700"> |
|
|
|
{#if wait === true} |
|
|
|
{#if wait === true} |
|
|
|
@ -418,7 +420,7 @@ |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{:else} |
|
|
|
{:else} |
|
|
|
<main class="container3" bind:this={top}> |
|
|
|
<div class="container3" bind:this={top}> |
|
|
|
<div class="row"> |
|
|
|
<div class="row"> |
|
|
|
<a href="#/"> |
|
|
|
<a href="#/"> |
|
|
|
<Logo class="logo block h-40" alt="NextGraph Logo" /> |
|
|
|
<Logo class="logo block h-40" alt="NextGraph Logo" /> |
|
|
|
@ -443,13 +445,13 @@ |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
{#if registration_error == "AlreadyExists"} |
|
|
|
{#if registration_error == "AlreadyExists"} |
|
|
|
<p class="max-w-xl md:mx-auto lg:max-w-2xl mb-5"> |
|
|
|
<p class="max-w-xl md:mx-auto lg:max-w-2xl mb-5"> |
|
|
|
The user is already registered with the selected broker.<br /> Try logging |
|
|
|
The user is already registered with the selected broker.<br /> Try |
|
|
|
in instead |
|
|
|
logging in instead |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
<a use:link href="/wallet/login"> |
|
|
|
<a use:link href="/wallet/login"> |
|
|
|
<button |
|
|
|
<button |
|
|
|
tabindex="-1" |
|
|
|
tabindex="-1" |
|
|
|
class="text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
class="text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
Login |
|
|
|
Login |
|
|
|
</button> |
|
|
|
</button> |
|
|
|
@ -461,7 +463,7 @@ |
|
|
|
<a use:link href="/"> |
|
|
|
<a use:link href="/"> |
|
|
|
<button |
|
|
|
<button |
|
|
|
tabindex="-1" |
|
|
|
tabindex="-1" |
|
|
|
class="text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
class="text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
Go back to homepage |
|
|
|
Go back to homepage |
|
|
|
</button> |
|
|
|
</button> |
|
|
|
@ -472,8 +474,8 @@ |
|
|
|
<div class=" max-w-6xl lg:px-8 mx-auto px-4"> |
|
|
|
<div class=" max-w-6xl lg:px-8 mx-auto px-4"> |
|
|
|
<p class="max-w-xl md:mx-auto lg:max-w-2xl"> |
|
|
|
<p class="max-w-xl md:mx-auto lg:max-w-2xl"> |
|
|
|
A <b>NextGraph Wallet</b> is unique to each person. It stores your |
|
|
|
A <b>NextGraph Wallet</b> is unique to each person. It stores your |
|
|
|
credentials and authorizations to access documents. <br /><br />If you |
|
|
|
credentials and authorizations to access documents. <br /><br />If |
|
|
|
already have a wallet, you should not create a new one, instead, |
|
|
|
you already have a wallet, you should not create a new one, instead, |
|
|
|
<a href="/wallet/login" use:link |
|
|
|
<a href="/wallet/login" use:link |
|
|
|
>login here with your existing wallet.</a |
|
|
|
>login here with your existing wallet.</a |
|
|
|
> |
|
|
|
> |
|
|
|
@ -495,7 +497,9 @@ |
|
|
|
<h2 class="pb-5 text-xl"> |
|
|
|
<h2 class="pb-5 text-xl"> |
|
|
|
What is a wallet? <span class="text-sm">Please read</span> |
|
|
|
What is a wallet? <span class="text-sm">Please read</span> |
|
|
|
</h2> |
|
|
|
</h2> |
|
|
|
<ul class="mb-8 space-y-4 text-left text-gray-500 dark:text-gray-400"> |
|
|
|
<ul |
|
|
|
|
|
|
|
class="mb-8 space-y-4 text-left text-gray-500 dark:text-gray-400" |
|
|
|
|
|
|
|
> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
<!-- Icon --> |
|
|
|
<!-- Icon --> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
@ -559,10 +563,11 @@ |
|
|
|
/> |
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
<span |
|
|
|
<span |
|
|
|
>In order to open it, you will need to enter your <b>pazzle</b> |
|
|
|
>In order to open it, you will need to enter your <b>pazzle</b |
|
|
|
|
|
|
|
> |
|
|
|
and a |
|
|
|
and a |
|
|
|
<b>PIN code</b> of 4 digits. Your personal pazzle (contraction of |
|
|
|
<b>PIN code</b> of 4 digits. Your personal pazzle (contraction |
|
|
|
puzzle and password) is composed of 9 images you should remember. |
|
|
|
of puzzle and password) is composed of 9 images you should remember. |
|
|
|
The order of the images is important too.</span |
|
|
|
The order of the images is important too.</span |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
@ -585,10 +590,10 @@ |
|
|
|
/> |
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
<span |
|
|
|
<span |
|
|
|
>Don't worry, it is easier to remember 9 images than a password |
|
|
|
>Don't worry, it is easier to remember 9 images than a |
|
|
|
like "69$g&ms%C*%", and it has the same strength as a complex |
|
|
|
password like "69$g&ms%C*%", and it has the same strength as a |
|
|
|
password. The entropy of your pazzle is <b>66bits</b>, which is |
|
|
|
complex password. The entropy of your pazzle is <b>66bits</b>, |
|
|
|
considered very high by all standards.</span |
|
|
|
which is considered very high by all standards.</span |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
|
|
|
|
|
|
|
|
@ -611,10 +616,10 @@ |
|
|
|
<span |
|
|
|
<span |
|
|
|
>You should only create <b>one unique wallet for yourself</b>. |
|
|
|
>You should only create <b>one unique wallet for yourself</b>. |
|
|
|
All your accounts, identities and permissions will be added to |
|
|
|
All your accounts, identities and permissions will be added to |
|
|
|
this unique wallet later on. Do not create another wallet if you |
|
|
|
this unique wallet later on. Do not create another wallet if |
|
|
|
already have one. Instead, you will |
|
|
|
you already have one. Instead, you will |
|
|
|
<b>import</b> your existing wallet in all the apps and websites where |
|
|
|
<b>import</b> your existing wallet in all the apps and websites |
|
|
|
you need it</span |
|
|
|
where you need it</span |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
@ -635,9 +640,9 @@ |
|
|
|
/> |
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
<span |
|
|
|
<span |
|
|
|
>Your wallet can be imported with the help of a small file that |
|
|
|
>Your wallet can be imported with the help of a small file |
|
|
|
you download, or with a QRcode. In any case, you should never |
|
|
|
that you download, or with a QRcode. In any case, you should |
|
|
|
share this file or QRcode with anybody else.</span |
|
|
|
never share this file or QRcode with anybody else.</span |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
@ -681,11 +686,12 @@ |
|
|
|
/> |
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
<span |
|
|
|
<span |
|
|
|
>For the same reason, we won't be able to help you if you forget |
|
|
|
>For the same reason, we won't be able to help you if you |
|
|
|
your pazzle or PIN code, or if you loose the wallet file. There |
|
|
|
forget your pazzle or PIN code, or if you loose the wallet |
|
|
|
is no "password recovery" option in this case. You can note your |
|
|
|
file. There is no "password recovery" option in this case. You |
|
|
|
pazzle down on a piece of paper until you remember it, but don't |
|
|
|
can note your pazzle down on a piece of paper until you |
|
|
|
forget to destroy this note after a while.</span |
|
|
|
remember it, but don't forget to destroy this note after a |
|
|
|
|
|
|
|
while.</span |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
</ul> |
|
|
|
@ -695,7 +701,7 @@ |
|
|
|
<button |
|
|
|
<button |
|
|
|
on:click|once={create_wallet} |
|
|
|
on:click|once={create_wallet} |
|
|
|
role="button" |
|
|
|
role="button" |
|
|
|
class="text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
class="text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
@ -719,8 +725,8 @@ |
|
|
|
<div class=" max-w-6xl lg:px-8 mx-auto px-4"> |
|
|
|
<div class=" max-w-6xl lg:px-8 mx-auto px-4"> |
|
|
|
<p class="max-w-xl md:mx-auto lg:max-w-2xl"> |
|
|
|
<p class="max-w-xl md:mx-auto lg:max-w-2xl"> |
|
|
|
NextGraph is based on an efficient decentralized P2P network, and in |
|
|
|
NextGraph is based on an efficient decentralized P2P network, and in |
|
|
|
order to join this network and start using the app, you need to first |
|
|
|
order to join this network and start using the app, you need to |
|
|
|
select a <b>broker server</b>. |
|
|
|
first select a <b>broker server</b>. |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
<div |
|
|
|
@ -730,7 +736,9 @@ |
|
|
|
<h2 class="pb-5 text-xl"> |
|
|
|
<h2 class="pb-5 text-xl"> |
|
|
|
What is a broker? <span class="text-sm">Please read</span> |
|
|
|
What is a broker? <span class="text-sm">Please read</span> |
|
|
|
</h2> |
|
|
|
</h2> |
|
|
|
<ul class="mb-8 space-y-4 text-left text-gray-500 dark:text-gray-400"> |
|
|
|
<ul |
|
|
|
|
|
|
|
class="mb-8 space-y-4 text-left text-gray-500 dark:text-gray-400" |
|
|
|
|
|
|
|
> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
fill="none" |
|
|
|
fill="none" |
|
|
|
@ -748,10 +756,10 @@ |
|
|
|
/> |
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
<span> |
|
|
|
<span> |
|
|
|
The broker helps you keep all your data in <b>sync</b>, as it is |
|
|
|
The broker helps you keep all your data in <b>sync</b>, as it |
|
|
|
connected to the internet 24/7 and keeps a copy of the updates |
|
|
|
is connected to the internet 24/7 and keeps a copy of the |
|
|
|
for you. This way, even if the devices of the other participants |
|
|
|
updates for you. This way, even if the devices of the other |
|
|
|
are offline, you can still see their changes</span |
|
|
|
participants are offline, you can still see their changes</span |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
@ -771,9 +779,9 @@ |
|
|
|
/> |
|
|
|
/> |
|
|
|
</svg> |
|
|
|
</svg> |
|
|
|
<span> |
|
|
|
<span> |
|
|
|
All your data is secure and <b>end-to-end encrypted</b>, and the |
|
|
|
All your data is secure and <b>end-to-end encrypted</b>, and |
|
|
|
broker cannot see the content of the documents as it does not |
|
|
|
the broker cannot see the content of the documents as it does |
|
|
|
have the keys to decrypt them.</span |
|
|
|
not have the keys to decrypt them.</span |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
<li class="flex space-x-3"> |
|
|
|
@ -864,9 +872,9 @@ |
|
|
|
<span> |
|
|
|
<span> |
|
|
|
Soon we will offer you the opportunity to host your own broker |
|
|
|
Soon we will offer you the opportunity to host your own broker |
|
|
|
at <b>home</b> |
|
|
|
at <b>home</b> |
|
|
|
or <b>office</b>. Instead of using a "broker service provider", |
|
|
|
or <b>office</b>. Instead of using a "broker service |
|
|
|
you will own a small device that you connect behind your |
|
|
|
provider", you will own a small device that you connect behind |
|
|
|
internet router. It is called <b>NG Box</b> and will be available |
|
|
|
your internet router. It is called <b>NG Box</b> and will be available |
|
|
|
soon.</span |
|
|
|
soon.</span |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
@ -897,7 +905,9 @@ |
|
|
|
> |
|
|
|
> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
</ul> |
|
|
|
<h2 class="mt-3 text-xl">Please choose one broker among the list</h2> |
|
|
|
<h2 class="mt-3 text-xl"> |
|
|
|
|
|
|
|
Please choose one broker among the list |
|
|
|
|
|
|
|
</h2> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{#if pre_invitation} |
|
|
|
{#if pre_invitation} |
|
|
|
@ -906,7 +916,7 @@ |
|
|
|
on:click|once={async () => { |
|
|
|
on:click|once={async () => { |
|
|
|
await select_bsp(pre_invitation.V0.url, pre_invitation.V0.name); |
|
|
|
await select_bsp(pre_invitation.V0.url, pre_invitation.V0.name); |
|
|
|
}} |
|
|
|
}} |
|
|
|
class="choice-button text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
class="choice-button text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
fill="none" |
|
|
|
fill="none" |
|
|
|
@ -930,7 +940,7 @@ |
|
|
|
<div class="row mt-5"> |
|
|
|
<div class="row mt-5"> |
|
|
|
<button |
|
|
|
<button |
|
|
|
on:click|once={selectEU} |
|
|
|
on:click|once={selectEU} |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:outline-none focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<EULogo class="mr-4 block h-10 w-10" alt="European Union flag" /> |
|
|
|
<EULogo class="mr-4 block h-10 w-10" alt="European Union flag" /> |
|
|
|
For European Union citizens |
|
|
|
For European Union citizens |
|
|
|
@ -940,7 +950,7 @@ |
|
|
|
<div class="row mt-5"> |
|
|
|
<div class="row mt-5"> |
|
|
|
<button |
|
|
|
<button |
|
|
|
on:click|once={selectNET} |
|
|
|
on:click|once={selectNET} |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:outline-none focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
fill="none" |
|
|
|
fill="none" |
|
|
|
@ -967,7 +977,7 @@ |
|
|
|
disabled |
|
|
|
disabled |
|
|
|
style="justify-content: left;" |
|
|
|
style="justify-content: left;" |
|
|
|
on:click|once={enterINVITE} |
|
|
|
on:click|once={enterINVITE} |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:outline-none focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
fill="none" |
|
|
|
fill="none" |
|
|
|
@ -992,7 +1002,7 @@ |
|
|
|
<div class="row mt-5"> |
|
|
|
<div class="row mt-5"> |
|
|
|
<button |
|
|
|
<button |
|
|
|
on:click|once={enterQRcode} |
|
|
|
on:click|once={enterQRcode} |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:outline-none focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
><svg |
|
|
|
><svg |
|
|
|
class="mr-4 block h-10 w-10" |
|
|
|
class="mr-4 block h-10 w-10" |
|
|
|
fill="none" |
|
|
|
fill="none" |
|
|
|
@ -1021,7 +1031,7 @@ |
|
|
|
<div class="row mt-5"> |
|
|
|
<div class="row mt-5"> |
|
|
|
<button |
|
|
|
<button |
|
|
|
on:click={displaySelfHost} |
|
|
|
on:click={displaySelfHost} |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:outline-none focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
fill="none" |
|
|
|
fill="none" |
|
|
|
@ -1044,7 +1054,7 @@ |
|
|
|
<div class="row mt-5 mb-12"> |
|
|
|
<div class="row mt-5 mb-12"> |
|
|
|
<button |
|
|
|
<button |
|
|
|
on:click={displayNGbox} |
|
|
|
on:click={displayNGbox} |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:outline-none focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
class="choice-button text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
xmlns="http://www.w3.org/2000/svg" |
|
|
|
xmlns="http://www.w3.org/2000/svg" |
|
|
|
@ -1185,9 +1195,9 @@ |
|
|
|
PIN on malicious sites and apps. |
|
|
|
PIN on malicious sites and apps. |
|
|
|
<Alert color="red" class="mt-5"> |
|
|
|
<Alert color="red" class="mt-5"> |
|
|
|
Every time you will use your wallet, if you do not see and |
|
|
|
Every time you will use your wallet, if you do not see and |
|
|
|
recognize your own security phrase and image before entering your |
|
|
|
recognize your own security phrase and image before entering |
|
|
|
pazzle, please stop and DO NOT enter your pazzle, as you would be |
|
|
|
your pazzle, please stop and DO NOT enter your pazzle, as you |
|
|
|
the victim of a phishing attempt. |
|
|
|
would be the victim of a phishing attempt. |
|
|
|
</Alert> |
|
|
|
</Alert> |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
<p class="text-left mt-5"> |
|
|
|
<p class="text-left mt-5"> |
|
|
|
@ -1199,14 +1209,16 @@ |
|
|
|
It should be something you will remember, but not something too |
|
|
|
It should be something you will remember, but not something too |
|
|
|
personal. |
|
|
|
personal. |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li>Do not enter your full name, nor address, nor phone number.</li> |
|
|
|
|
|
|
|
<li> |
|
|
|
<li> |
|
|
|
Instead, you can enter a quote, a small sentence that you like, or |
|
|
|
Do not enter your full name, nor address, nor phone number. |
|
|
|
something meaningless to others, but unique to you. |
|
|
|
</li> |
|
|
|
|
|
|
|
<li> |
|
|
|
|
|
|
|
Instead, you can enter a quote, a small sentence that you like, |
|
|
|
|
|
|
|
or something meaningless to others, but unique to you. |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li> |
|
|
|
<li> |
|
|
|
The image should be minimum 150x150px. There is no need to provide |
|
|
|
The image should be minimum 150x150px. There is no need to |
|
|
|
more than 400x400px as it will be scaled down anyway. |
|
|
|
provide more than 400x400px as it will be scaled down anyway. |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li> |
|
|
|
<li> |
|
|
|
We accept several formats like JPEG, PNG, GIF, WEBP and more. |
|
|
|
We accept several formats like JPEG, PNG, GIF, WEBP and more. |
|
|
|
@ -1215,14 +1227,16 @@ |
|
|
|
The image should be unique to you. But it should not be too |
|
|
|
The image should be unique to you. But it should not be too |
|
|
|
personal neither. |
|
|
|
personal neither. |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li>Do not upload your face picture, this is not a profile pic.</li> |
|
|
|
<li> |
|
|
|
|
|
|
|
Do not upload your face picture, this is not a profile pic. |
|
|
|
|
|
|
|
</li> |
|
|
|
<li> |
|
|
|
<li> |
|
|
|
The best would be a landscape you like or any other picture that |
|
|
|
The best would be a landscape you like or any other picture that |
|
|
|
you will recognize as unique. |
|
|
|
you will recognize as unique. |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li> |
|
|
|
<li> |
|
|
|
Please be aware that other people who are sharing this device with |
|
|
|
Please be aware that other people who are sharing this device |
|
|
|
you, will be able to see this image and phrase. |
|
|
|
with you, will be able to see this image and phrase. |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
</ul> |
|
|
|
<input |
|
|
|
<input |
|
|
|
@ -1239,7 +1253,7 @@ |
|
|
|
<button |
|
|
|
<button |
|
|
|
on:click|once={save_security} |
|
|
|
on:click|once={save_security} |
|
|
|
bind:this={validate_button} |
|
|
|
bind:this={validate_button} |
|
|
|
class="animate-bounce mt-10 text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
class="animate-bounce mt-10 text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mb-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
@ -1275,8 +1289,8 @@ |
|
|
|
{#if mobile} |
|
|
|
{#if mobile} |
|
|
|
<span class="font-semibold">Tap to upload an image</span> |
|
|
|
<span class="font-semibold">Tap to upload an image</span> |
|
|
|
{:else} |
|
|
|
{:else} |
|
|
|
<span class="font-semibold">Click to select an image</span> or drag |
|
|
|
<span class="font-semibold">Click to select an image</span> or |
|
|
|
and drop |
|
|
|
drag and drop |
|
|
|
{/if} |
|
|
|
{/if} |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
@ -1319,22 +1333,23 @@ |
|
|
|
<div class=" max-w-6xl lg:px-8 mx-auto px-4" bind:this={info_options}> |
|
|
|
<div class=" max-w-6xl lg:px-8 mx-auto px-4" bind:this={info_options}> |
|
|
|
<p class="max-w-xl mb-10 md:mx-auto lg:max-w-2xl"> |
|
|
|
<p class="max-w-xl mb-10 md:mx-auto lg:max-w-2xl"> |
|
|
|
<span class="text-xl">We are almost done !</span><br /> |
|
|
|
<span class="text-xl">We are almost done !</span><br /> |
|
|
|
There are 4 options to choose before we can create your wallet. Those options |
|
|
|
There are 4 options to choose before we can create your wallet. Those |
|
|
|
can help you to use and keep your wallet. But we also want to be careful |
|
|
|
options can help you to use and keep your wallet. But we also want to |
|
|
|
with your security and privacy.<br /><br /> |
|
|
|
be careful with your security and privacy.<br /><br /> |
|
|
|
Remember that in any case, once your wallet will be created, you will download |
|
|
|
Remember that in any case, once your wallet will be created, you will |
|
|
|
a file that you should keep privately somewhere on your device, USB key |
|
|
|
download a file that you should keep privately somewhere on your device, |
|
|
|
or hard-disk. This is the default way you can use and keep your wallet. |
|
|
|
USB key or hard-disk. This is the default way you can use and keep your |
|
|
|
Now let's look at some options that can make your life a bit easier. |
|
|
|
wallet. Now let's look at some options that can make your life a bit |
|
|
|
|
|
|
|
easier. |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
<p class="max-w-xl md:mx-auto lg:max-w-2xl text-left"> |
|
|
|
<p class="max-w-xl md:mx-auto lg:max-w-2xl text-left"> |
|
|
|
<span class="text-xl">Do you trust this device? </span> <br /> |
|
|
|
<span class="text-xl">Do you trust this device? </span> <br /> |
|
|
|
If you do, if this device is yours or is used by few trusted persons of |
|
|
|
If you do, if this device is yours or is used by few trusted persons |
|
|
|
your family or workplace, and you would like to login again from this device |
|
|
|
of your family or workplace, and you would like to login again from this |
|
|
|
in the future, then you can save your wallet on this device. To the contrary, |
|
|
|
device in the future, then you can save your wallet on this device. To |
|
|
|
if this device is public and shared by strangers, do not save your wallet |
|
|
|
the contrary, if this device is public and shared by strangers, do not |
|
|
|
here. {#if !tauri_platform}By selecting this option, you agree to save |
|
|
|
save your wallet here. {#if !tauri_platform}By selecting this |
|
|
|
some cookies on your browser.{/if}<br /> |
|
|
|
option, you agree to save some cookies on your browser.{/if}<br /> |
|
|
|
<Toggle class="mt-3" bind:checked={options.trusted} |
|
|
|
<Toggle class="mt-3" bind:checked={options.trusted} |
|
|
|
>Save my wallet on this device?</Toggle |
|
|
|
>Save my wallet on this device?</Toggle |
|
|
|
> |
|
|
|
> |
|
|
|
@ -1345,8 +1360,8 @@ |
|
|
|
this would happen, your wallet would be lost forever, together with all |
|
|
|
this would happen, your wallet would be lost forever, together with all |
|
|
|
your documents. We can keep an encrypted copy of your wallet in our cloud. |
|
|
|
your documents. We can keep an encrypted copy of your wallet in our cloud. |
|
|
|
Only you will be able to download it with a special link. You would have |
|
|
|
Only you will be able to download it with a special link. You would have |
|
|
|
to keep this link safely though. By selecting this option, you agree to |
|
|
|
to keep this link safely though. By selecting this option, you agree |
|
|
|
the |
|
|
|
to the |
|
|
|
<a target="_blank" href="https://nextgraph.one/#/tos" |
|
|
|
<a target="_blank" href="https://nextgraph.one/#/tos" |
|
|
|
>Terms of Service of our cloud</a |
|
|
|
>Terms of Service of our cloud</a |
|
|
|
>. |
|
|
|
>. |
|
|
|
@ -1356,12 +1371,13 @@ |
|
|
|
> |
|
|
|
> |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
<p class="max-w-xl md:mx-auto mt-10 lg:max-w-2xl text-left"> |
|
|
|
<p class="max-w-xl md:mx-auto mt-10 lg:max-w-2xl text-left"> |
|
|
|
<span class="text-xl">Create a PDF file of your wallet? </span> <br /> |
|
|
|
<span class="text-xl">Create a PDF file of your wallet? </span> |
|
|
|
|
|
|
|
<br /> |
|
|
|
We can prepare for you a PDF file containing all the information of your |
|
|
|
We can prepare for you a PDF file containing all the information of your |
|
|
|
wallet, unencrypted. You should print this file and then delete the PDF |
|
|
|
wallet, unencrypted. You should print this file and then delete the PDF |
|
|
|
(and empty the trash). Keep this printed document in a safe place. It contains |
|
|
|
(and empty the trash). Keep this printed document in a safe place. It |
|
|
|
all the information to regenerate your wallet in case you lost access to |
|
|
|
contains all the information to regenerate your wallet in case you lost |
|
|
|
it. |
|
|
|
access to it. |
|
|
|
<br /> |
|
|
|
<br /> |
|
|
|
<Toggle disabled class="mt-3" bind:checked={options.pdf} |
|
|
|
<Toggle disabled class="mt-3" bind:checked={options.pdf} |
|
|
|
>Create a PDF of my wallet?</Toggle |
|
|
|
>Create a PDF of my wallet?</Toggle |
|
|
|
@ -1372,12 +1388,12 @@ |
|
|
|
<span class="text-xl" |
|
|
|
<span class="text-xl" |
|
|
|
>Create a link to access your wallet easily? |
|
|
|
>Create a link to access your wallet easily? |
|
|
|
</span> <br /> |
|
|
|
</span> <br /> |
|
|
|
When you want to use your wallet on the web or from other devices, we |
|
|
|
When you want to use your wallet on the web or from other devices, |
|
|
|
can help you find your wallet by creating a simple link accessible from |
|
|
|
we can help you find your wallet by creating a simple link accessible |
|
|
|
anywhere. Only you will have access to this link. In order to do so, |
|
|
|
from anywhere. Only you will have access to this link. In order to |
|
|
|
we will keep your wallet ID and some information about your broker on |
|
|
|
do so, we will keep your wallet ID and some information about your |
|
|
|
our cloud servers. If you prefer to opt out, just uncheck this option. |
|
|
|
broker on our cloud servers. If you prefer to opt out, just uncheck |
|
|
|
By selecting this option, you agree to the |
|
|
|
this option. By selecting this option, you agree to the |
|
|
|
<a target="_blank" href="https://nextgraph.one/#/tos" |
|
|
|
<a target="_blank" href="https://nextgraph.one/#/tos" |
|
|
|
>Terms of Service of our cloud</a |
|
|
|
>Terms of Service of our cloud</a |
|
|
|
>. |
|
|
|
>. |
|
|
|
@ -1389,7 +1405,7 @@ |
|
|
|
{/if} |
|
|
|
{/if} |
|
|
|
<button |
|
|
|
<button |
|
|
|
on:click|once={do_wallet} |
|
|
|
on:click|once={do_wallet} |
|
|
|
class="mt-10 mb-20 text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55" |
|
|
|
class="mt-10 mb-20 text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
@ -1461,7 +1477,7 @@ |
|
|
|
tabindex="-1" |
|
|
|
tabindex="-1" |
|
|
|
class:animate-bounce={animateDownload} |
|
|
|
class:animate-bounce={animateDownload} |
|
|
|
on:click={() => (animateDownload = false)} |
|
|
|
on:click={() => (animateDownload = false)} |
|
|
|
class="mt-10 mb-8 text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55" |
|
|
|
class="mt-10 mb-8 text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
@ -1496,12 +1512,13 @@ |
|
|
|
<br /><br /> |
|
|
|
<br /><br /> |
|
|
|
Copy it on a piece of paper.<br /> Use that until you memorized it,<br |
|
|
|
Copy it on a piece of paper.<br /> Use that until you memorized it,<br |
|
|
|
/> |
|
|
|
/> |
|
|
|
then throw it away.<br /> The order of each image is important.<br /> |
|
|
|
then throw it away.<br /> The order of each image is important.<br |
|
|
|
|
|
|
|
/> |
|
|
|
Now click on "Continue to Login"<br /><br /> |
|
|
|
Now click on "Continue to Login"<br /><br /> |
|
|
|
<a href="/wallet/login" use:link> |
|
|
|
<a href="/wallet/login" use:link> |
|
|
|
<button |
|
|
|
<button |
|
|
|
tabindex="-1" |
|
|
|
tabindex="-1" |
|
|
|
class="mb-20 text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:outline-none focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mr-2" |
|
|
|
class="mb-20 text-primary-700 bg-primary-100 hover:bg-primary-100/90 focus:ring-4 focus:ring-primary-100/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-100/55 mr-2" |
|
|
|
> |
|
|
|
> |
|
|
|
<svg |
|
|
|
<svg |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
class="w-8 h-8 mr-2 -ml-1" |
|
|
|
@ -1559,8 +1576,9 @@ |
|
|
|
</button> |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{/if} |
|
|
|
{/if} |
|
|
|
</main> |
|
|
|
</div> |
|
|
|
{/if} |
|
|
|
{/if} |
|
|
|
|
|
|
|
</CenteredLayout> |
|
|
|
|
|
|
|
|
|
|
|
<style> |
|
|
|
<style> |
|
|
|
</style> |
|
|
|
</style> |
|
|
|
|
