diff options
| -rw-r--r-- | src/app.css | 2 | ||||
| -rw-r--r-- | src/components/Password.svelte | 12 | ||||
| -rw-r--r-- | src/locales/en.json | 2 | ||||
| -rw-r--r-- | src/routes/(app)/settings/security/+page.svelte | 61 | ||||
| -rw-r--r-- | src/routes/+page.svelte | 4 |
5 files changed, 41 insertions, 40 deletions
diff --git a/src/app.css b/src/app.css index 86dcc94c..3d3ffd94 100644 --- a/src/app.css +++ b/src/app.css @@ -45,7 +45,7 @@ textarea:focus, textarea:focus-within, .input:focus, .input:focus-within { @apply outline-offset-0; } -input.clean { +input.clean, textarea.clean { border: none; outline: none; padding: 0; diff --git a/src/components/Password.svelte b/src/components/Password.svelte index 81bc1285..dc77c0d3 100644 --- a/src/components/Password.svelte +++ b/src/components/Password.svelte @@ -1,4 +1,4 @@ -<script> +<script lang="ts"> import { t } from "$lib/translations"; import { preventDefault } from "svelte/legacy"; @@ -68,10 +68,14 @@ ></iconify-icon> </label> <div class="w-full flex gap-2"> - <button type="button" class="btn !w-auto grow" onclick={cancel} onkeydown={cancel} - >Cancel</button + <button + type="button" + class="btn !w-auto grow" + onclick={cancel} + onkeydown={cancel}>Cancel</button + > + <button type="submit" class="btn btn-accent !w-auto grow">Submit</button > - <button type="submit" class="btn btn-accent !w-auto grow">Submit</button> </div> </form> </div> diff --git a/src/locales/en.json b/src/locales/en.json index 5fcfa880..c47bf051 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -248,7 +248,7 @@ "memoPrompt": "Checkout instructions", "memoPromptPlaceholder": "e.g. Please enter your name for the order", "rememberFor": "Remember for", - "import": "Import key", + "import": "Import secret key", "destination": "Autowithdrawal address", "destinationDesc": "The address that withdrawals will be sent to", "destinationPlaceholder": "Enter a Bitcoin, Liquid or Lightning address", diff --git a/src/routes/(app)/settings/security/+page.svelte b/src/routes/(app)/settings/security/+page.svelte index 32488d1e..cc988d6c 100644 --- a/src/routes/(app)/settings/security/+page.svelte +++ b/src/routes/(app)/settings/security/+page.svelte @@ -19,11 +19,9 @@ let confirming2fa = $state(), disabling2fa = $state(), importing = $state(), - locked, - mnemonic, + mnemonic = $state(), newNsec = $state(), nsec = $state(), - old, otp = $state(), password = $state(), pin = $state(""), @@ -61,8 +59,6 @@ }; let checkPin = async () => { - old = $current; - try { if (pin.length > 5 && pin === verify) { user.haspin = true; @@ -168,26 +164,30 @@ <input type="hidden" name="newpin" value={disablingPin ? "delete" : pin} /> <input type="hidden" name="confirm" bind:value={password} /> -<div class="relative mb-5"> +<div> <label for="password" class="block font-bold block mb-1" >{$t("user.settings.newPassword")}</label > - {#if revealPassword} - <input name="password" type="text" bind:value={password} /> - {:else} - <input name="password" type="password" bind:value={password} /> - {/if} - <button - type="button" - onclick={togglePassword} - onkeydown={togglePassword} - class="absolute right-5 top-11" + <label + for="password" + class="input flex items-center justify-center gap-2 w-full" > + {#if revealPassword} + <input name="password" type="text" bind:value={password} class="clean" /> + {:else} + <input + name="password" + type="password" + bind:value={password} + class="clean" + /> + {/if} <iconify-icon + onclick={togglePassword} icon={revealPassword ? "ph:eye-bold" : "ph:eye-slash-bold"} width="32" ></iconify-icon> - </button> + </label> </div> <div> @@ -264,7 +264,7 @@ {/if} </div> -<div> +<div class="space-y-2"> <label for="seedphrase" class="font-bold" >{$t("user.settings.nostrKeys")}</label > @@ -274,6 +274,15 @@ </p> <div class="flex flex-wrap sm:flex-nowrap gap-2"> + <button + type="button" + class="btn !w-auto flex-grow" + onclick={toggleImporting} + > + <iconify-icon icon="ph:arrow-down-left-bold" width="32"></iconify-icon> + {$t("user.settings.import")} + </button> + <button type="button" class="btn !w-auto flex-grow" onclick={toggleNsec}> {#if revealNsec} <iconify-icon icon="ph:eye-slash-bold" width="32"></iconify-icon> @@ -283,15 +292,6 @@ {$t("user.settings.revealNsec")} {/if} </button> - - <button - type="button" - class="btn !w-auto flex-grow" - onclick={toggleImporting} - > - <iconify-icon icon="ph:floppy-disk-bold" width="32"></iconify-icon> - {$t("user.settings.import")} - </button> </div> {#if importing} @@ -299,13 +299,10 @@ {/if} {#if revealNsec} - <div class="text-lg break-all"> - {nsec} - </div> + <button type="button" class="btn break-all !h-auto font-normal leading-normal flex-nowrap" onclick={() => copy(nsec)}> + <div>{nsec}</div> - <button type="button" class="btn" onclick={() => copy(nsec)}> <iconify-icon icon="ph:copy-bold" width="32"></iconify-icon> - Copy </button> {/if} </div> diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 480ea1c4..998673f9 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,5 +1,5 @@ -<script> - import { run } from 'svelte/legacy'; +<script lang="ts"> + import { run } from "svelte/legacy"; import LandingHeader from "$comp/LandingHeader.svelte"; import LandingHero from "$comp/LandingHero.svelte"; |