imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

files scrollbar layout done

Browse Source
This commit is contained in:
chiayin
2023-02-08 14:52:02 +08:00
parent 9dc25b9b99
commit 1e5cac35c7
15 changed files with 580 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/views/Login/index.vue
View File

@@ -6,23 +6,23 @@
<form action="#" method="post" class="w-full grid gap-2" @submit.prevent="signIn">
<label for="account" class="relative">
<p class="text-sm font-normal mb-2">Account</p>
<span class="absolute bottom-2 left-0 flex items-center pl-2 pr-2 border-r border-neutral">
<IconMember class="h-5 w-5 fill-default"/>
<span class="absolute flex bottom-1 left-0 items-center pl-2 pr-2 border-r border-neutral-300 h-[26px]">
<IconMember class="h-5 w-5 fill-current"/>
</span>
<input type="text" id="account" class="w-full border border-neutral rounded py-1 pl-10 pr-2 focus:outline-none focus:border-primary focus:ring-1 " :class="{'border-danger':isInvalid}" required autofocus v-model.trim="auth.username" @change="changeHandler($event)"/>
<input type="text" id="account" class="w-full border border-neutral-300 rounded py-1 pl-10 pr-2 focus:outline-none focus:border-primary focus:ring-1 " :class="{'border-danger':isInvalid}" required autofocus v-model.trim="auth.username" @change="changeHandler($event)"/>
</label>
<label for="passwordt" class="relative block">
<p class="text-sm font-normal mb-2">Password</p>
<span class="absolute bottom-2 left-0 flex items-center pl-2 pr-2 border-r border-neutral">
<IconLockKey class="h-5 w-5"/>
<span class="absolute flex bottom-1 left-0 items-center pl-2 pr-2 border-r border-neutral-300 h-[26px]">
<IconLockKey class="h-5 w-5 fill-current"/>
</span>
<input :type="showPassword ? 'text' : 'password'" id="password" aria-describedby="password-addon" class="w-full border border-neutral rounded py-1 pl-10 pr-2 focus:outline-none focus:border-primary focus:ring-1 " :class="{'border-danger':isInvalid}" required v-model.trim="auth.password" @change="changeHandler($event)"/>
<input :type="showPassword ? 'text' : 'password'" id="password" aria-describedby="password-addon" class="w-full border border-neutral-300 rounded py-1 pl-10 pr-2 focus:outline-none focus:border-primary focus:ring-1 " :class="{'border-danger':isInvalid}" required v-model.trim="auth.password" @change="changeHandler($event)"/>
<span class="absolute bottom-2 right-4 inline-flex items-center cursor-pointer" v-show="auth.password" @click="showPassword = !showPassword">
<IconEyeClose class="h-5 w-5" v-if="showPassword"/>
<IconEyeOpen class="h-5 w-5" v-else/>
</span>
</label>
<p class="mb-6 text-danger">
<p class="my-4 text-danger">
<span v-show="isInvalid">
<IconWarnTriangle class="h-4 w-5 mx-2 mb-[2px] inline-block text-danger"/>Incorrect account or password.
</span>