feat(auth): 비밀번호 표시 토글을 SVG 아이콘으로 통일
- AuthPasswordVisibilityToggle 공통 컴포넌트 추가 - signin·signup(비밀번호·확인)에 적용, 접근성 field-name 구분 - v0.0.61 문서 반영 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -53,7 +53,7 @@ const submitSignIn = async () => {
|
||||
<template>
|
||||
<section class="auth-signin min-h-screen bg-[#0a0b0d] text-[#f5f7fa]">
|
||||
<div class="mx-auto flex min-h-screen w-full max-w-[1280px] items-center px-5 py-12 sm:px-10 lg:px-16">
|
||||
<div class="w-full max-w-[430px] rounded-2xl border border-[#1a212a] bg-[#0d1116] p-5 sm:p-8">
|
||||
<div class="w-full max-w-[430px] p-5 sm:p-8">
|
||||
<p class="text-2xl font-semibold leading-tight">
|
||||
로그인
|
||||
</p>
|
||||
@@ -77,17 +77,11 @@ const submitSignIn = async () => {
|
||||
<div class="flex items-center rounded-[8px] border border-[#1a212a] transition-colors focus-within:border-[#2f6feb]">
|
||||
<input
|
||||
v-model="form.password"
|
||||
class="h-10 w-full bg-transparent px-3 text-sm outline-none"
|
||||
class="h-10 min-w-0 flex-1 bg-transparent px-3 text-sm outline-none"
|
||||
:type="showPassword ? 'text' : 'password'"
|
||||
autocomplete="current-password"
|
||||
>
|
||||
<button
|
||||
class="px-3 text-xs text-[#9ba3af] transition-opacity hover:opacity-80"
|
||||
type="button"
|
||||
@click="showPassword = !showPassword"
|
||||
>
|
||||
{{ showPassword ? '숨기기' : '보기' }}
|
||||
</button>
|
||||
<AuthPasswordVisibilityToggle v-model="showPassword" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user