motaju/xrlms
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

global css 적용, 권한설정 완료1

Browse Source
This commit is contained in:
wallace
2025-11-27 00:45:55 +09:00
parent 5a5cf3e9e6
commit 5a2d770589
9 changed files with 285 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/app/menu/ChangePasswordModal.tsx
View File

@@ -96,15 +96,15 @@ export default function ChangePasswordModal({ open, onClose, onSubmit, showVerif
role="dialog"
aria-modal="true"
>
<div className="w-[480px] rounded-[12px] border border-[#dee1e6] bg-white shadow-[0_10px_30px_rgba(0,0,0,0.06)]">
<div className="w-[480px] rounded-[12px] border border-input-border bg-white shadow-[0_10px_30px_rgba(0,0,0,0.06)]">
{/* header */}
<div className="flex items-center justify-between p-6">
<h2 className="text-[20px] font-bold leading-[1.5] text-[#333c47]">비밀번호 변경</h2>
<h2 className="text-[20px] font-bold leading-[1.5] text-neutral-700">비밀번호 변경</h2>
<button
type="button"
aria-label="닫기"
onClick={onClose}
className="inline-flex size-6 items-center justify-center text-[#333c47] hover:opacity-80 cursor-pointer"
className="inline-flex size-6 items-center justify-center text-neutral-700 hover:opacity-80 cursor-pointer"
>
<ModalCloseSvg />
</button>
@@ -113,14 +113,14 @@ export default function ChangePasswordModal({ open, onClose, onSubmit, showVerif
{/* body */}
<div className="flex flex-col gap-[10px] px-6">
<div className="flex flex-col gap-2">
<label className="w-[100px] text-[15px] font-semibold leading-[1.5] text-[#6c7682]">아이디 (이메일)</label>
<label className="w-[100px] text-[15px] font-semibold leading-[1.5] text-text-label">아이디 (이메일)</label>
<div className="flex items-center gap-3">
<input
type="email"
value={email}
onChange={(e) => setEmail(e.target.value)}
className={[
"h-10 flex-1 rounded-[8px] border border-[#dee1e6] px-3 text-[16px] leading-[1.5] text-[#333c47] placeholder-[#b1b8c0] outline-none",
"h-10 flex-1 rounded-[8px] border border-input-border px-3 text-[16px] leading-[1.5] text-neutral-700 placeholder:text-text-placeholder-alt outline-none",
hasError ? "bg-white" : isCodeSent ? "bg-neutral-50" : "bg-white",
].join(" ")}
placeholder="이메일"
@@ -132,7 +132,7 @@ export default function ChangePasswordModal({ open, onClose, onSubmit, showVerif
setIsCodeSent(true);
setError(null);
}}
className="h-10 w-[136px] rounded-[8px] bg-[#f1f3f5] px-3 text-[16px] font-semibold leading-[1.5] text-[#333c47] cursor-pointer"
className="h-10 w-[136px] rounded-[8px] bg-bg-gray-light px-3 text-[16px] font-semibold leading-[1.5] text-neutral-700 cursor-pointer"
>
{isCodeSent ? "인증번호 재전송" : "인증번호 전송"}
</button>
@@ -140,13 +140,13 @@ export default function ChangePasswordModal({ open, onClose, onSubmit, showVerif
</div>
{requireCode ? (
<div className="flex flex-col gap-2">
<div className="w-[100px] text-[15px] font-semibold leading-[1.5] text-[#6c7682]">인증번호</div>
<div className="w-[100px] text-[15px] font-semibold leading-[1.5] text-text-label">인증번호</div>
<div className="flex items-center gap-3">
<input
type="text"
value={code}
onChange={(e) => setCode(e.target.value)}
className="h-10 flex-1 rounded-[8px] border border-[#dee1e6] bg-white px-3 text-[16px] leading-[1.5] text-[#333c47] placeholder-[#b1b8c0] outline-none"
className="h-10 flex-1 rounded-[8px] border border-input-border bg-white px-3 text-[16px] leading-[1.5] text-neutral-700 placeholder:text-text-placeholder-alt outline-none"
placeholder="인증번호를 입력해 주세요."
/>
<button
@@ -154,7 +154,7 @@ export default function ChangePasswordModal({ open, onClose, onSubmit, showVerif
disabled={!canConfirm}
className={[
"h-10 w-[136px] rounded-[8px] px-3 text-[16px] font-semibold leading-[1.5] cursor-pointer disabled:cursor-default",
canConfirm ? "bg-[#f1f3f5] text-[#4c5561]" : "bg-gray-50 text-[#b1b8c0]",
canConfirm ? "bg-bg-gray-light text-basic-text" : "bg-gray-50 text-text-placeholder-alt",
].join(" ")}
>
인증번호 확인
@@ -162,37 +162,37 @@ export default function ChangePasswordModal({ open, onClose, onSubmit, showVerif
</div>
{isCodeSent && !hasError && !isVerified ? (
<div className="px-1">
<p className="text-[13px] font-semibold leading-[1.4] text-[#384fbf]">
<p className="text-[13px] font-semibold leading-[1.4] text-primary">
인증 확인을 위해 작성한 이메일로 인증번호를 발송했습니다.
</p>
<p className="text-[13px] font-semibold leading-[1.4] text-[#384fbf]">
<p className="text-[13px] font-semibold leading-[1.4] text-primary">
이메일을 확인해 주세요.
</p>
</div>
) : null}
{error ? (
<p className="px-1 text-[13px] font-semibold leading-[1.4] text-[#f64c4c]">
<p className="px-1 text-[13px] font-semibold leading-[1.4] text-error">
{error}
</p>
) : null}
</div>
) : null}
<div className="flex flex-col gap-2">
<label className="text-[15px] font-semibold leading-[1.5] text-[#6c7682]">새 비밀번호</label>
<label className="text-[15px] font-semibold leading-[1.5] text-text-label">새 비밀번호</label>
<input
type="password"
value={newPassword}
onChange={(e) => setNewPassword(e.target.value)}
disabled={!isVerified}
className={[
"h-10 rounded-[8px] border border-[#dee1e6] px-3 text-[16px] leading-[1.5] text-[#333c47] placeholder-[#b1b8c0] outline-none",
"h-10 rounded-[8px] border border-input-border px-3 text-[16px] leading-[1.5] text-neutral-700 placeholder:text-text-placeholder-alt outline-none",
isVerified ? "bg-white" : "bg-neutral-50",
].join(" ")}
placeholder="새 비밀번호"
/>
</div>
<div className="flex flex-col gap-2">
<label className="text-[15px] font-semibold leading-[1.5] text-[#6c7682]">
<label className="text-[15px] font-semibold leading-[1.5] text-text-label">
새 비밀번호 확인
</label>
<input
@@ -201,7 +201,7 @@ export default function ChangePasswordModal({ open, onClose, onSubmit, showVerif
onChange={(e) => setConfirmPassword(e.target.value)}
disabled={!isVerified}
className={[
"h-10 rounded-[8px] border border-[#dee1e6] px-3 text-[16px] leading-[1.5] text-[#333c47] placeholder-[#b1b8c0] outline-none",
"h-10 rounded-[8px] border border-input-border px-3 text-[16px] leading-[1.5] text-neutral-700 placeholder:text-text-placeholder-alt outline-none",
isVerified ? "bg-white" : "bg-neutral-50",
].join(" ")}
placeholder="새 비밀번호 확인"
@@ -214,14 +214,14 @@ export default function ChangePasswordModal({ open, onClose, onSubmit, showVerif
<button
type="button"
onClick={onClose}
className="h-12 w-[136px] rounded-[10px] bg-[#f1f3f5] px-4 text-[16px] font-semibold leading-[1.5] text-[#4c5561] cursor-pointer"
className="h-12 w-[136px] rounded-[10px] bg-bg-gray-light px-4 text-[16px] font-semibold leading-[1.5] text-basic-text cursor-pointer"
>
취소
</button>
<button
type="button"
onClick={handleSubmit}
className="h-12 w-[136px] rounded-[10px] bg-[#8598e8] px-4 text-[16px] font-semibold leading-[1.5] text-white cursor-pointer"
className="h-12 w-[136px] rounded-[10px] bg-inactive-button px-4 text-[16px] font-semibold leading-[1.5] text-white cursor-pointer"
>
비밀번호 변경
</button>