add password showing option
This commit is contained in:
parent
4bd130aad9
commit
67cf564b01
|
@ -1,16 +1,17 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Input, Button, Spinner, Checkbox } from "flowbite-svelte";
|
import { Input, Button, Spinner, Checkbox } from "flowbite-svelte";
|
||||||
import { performLogin } from "../util/loginUtil";
|
|
||||||
import type { User } from "../types/user";
|
import type { User } from "../types/user";
|
||||||
import type { Error } from "../types/error";
|
import type { Error } from "../types/error";
|
||||||
import { currentPage, currentUser, startup } from "../storage/localStore";
|
import { currentPage, currentUser, startup } from "../storage/localStore";
|
||||||
import toast from "svelte-french-toast";
|
import toast from "svelte-french-toast";
|
||||||
import { Page } from "../consts/pages";
|
import { Page } from "../consts/pages";
|
||||||
|
import { EyeSlashSolid, EyeSolid } from "flowbite-svelte-icons";
|
||||||
|
|
||||||
let loading = false;
|
let loading = false;
|
||||||
let username = "";
|
let username = "";
|
||||||
let password = "";
|
let password = "";
|
||||||
let saveCredentials = false;
|
let saveCredentials = false;
|
||||||
|
let showPassword = false;
|
||||||
|
|
||||||
const processLogin = async () => {
|
const processLogin = async () => {
|
||||||
loading = true;
|
loading = true;
|
||||||
|
@ -122,12 +123,25 @@
|
||||||
bind:value={username}
|
bind:value={username}
|
||||||
/>
|
/>
|
||||||
<Input
|
<Input
|
||||||
type="password"
|
type={showPassword ? "text" : "password"}
|
||||||
placeholder="Password"
|
placeholder="Password"
|
||||||
size="md"
|
size="md"
|
||||||
disabled={loading}
|
disabled={loading}
|
||||||
bind:value={password}
|
bind:value={password}
|
||||||
/>
|
>
|
||||||
|
<Button
|
||||||
|
slot="right"
|
||||||
|
color="none"
|
||||||
|
class="!outline-none !ring-0 !p-0 !m-0 !bg-transparent !border-none"
|
||||||
|
on:click={() => (showPassword = !showPassword)}
|
||||||
|
>
|
||||||
|
{#if showPassword}
|
||||||
|
<EyeSolid class="outline-none border-none" />
|
||||||
|
{:else}
|
||||||
|
<EyeSlashSolid class="outline-none border-none" />
|
||||||
|
{/if}
|
||||||
|
</Button>
|
||||||
|
</Input>
|
||||||
<Checkbox bind:checked={saveCredentials}>Save credentials</Checkbox>
|
<Checkbox bind:checked={saveCredentials}>Save credentials</Checkbox>
|
||||||
<div class="flex flex-col justify-center items-center gap-5 mt-1">
|
<div class="flex flex-col justify-center items-center gap-5 mt-1">
|
||||||
<Button
|
<Button
|
||||||
|
|
Loading…
Reference in New Issue
Block a user