login 수정1
This commit is contained in:
@@ -1,6 +1,5 @@
|
|||||||
"use client";
|
"use client";
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { useState } from "react";
|
|
||||||
|
|
||||||
type LoginOptionProps = {
|
type LoginOptionProps = {
|
||||||
onClick?: () => void;
|
onClick?: () => void;
|
||||||
@@ -14,48 +13,5 @@ export default function LoginOption({
|
|||||||
loginErrorModalEnabled,
|
loginErrorModalEnabled,
|
||||||
setLoginErrorModalEnabled,
|
setLoginErrorModalEnabled,
|
||||||
}: LoginOptionProps) {
|
}: LoginOptionProps) {
|
||||||
|
return null;
|
||||||
const [isOpen, setIsOpen] = useState(false);
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onClick={() => setIsOpen(!isOpen)}
|
|
||||||
className={`fixed bottom-2 right-2 bg-red-400 cursor-pointer rounded-full w-[40px] h-[40px] shadow-xl z-100`}
|
|
||||||
>
|
|
||||||
</button>
|
|
||||||
{isOpen && (
|
|
||||||
<div className="fixed inset-0 flex items-center justify-center z-50">
|
|
||||||
<div className="w-[500px] h-[600px] flex bg-white/80 p-10 border rounded-lg relative">
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
aria-label="닫기"
|
|
||||||
onClick={() => setIsOpen(false)}
|
|
||||||
className="absolute top-3 right-3 inline-flex items-center justify-center rounded-full w-8 h-8 bg-gray-200 hover:bg-gray-300 text-gray-700"
|
|
||||||
>
|
|
||||||
×
|
|
||||||
</button>
|
|
||||||
<ul className="flex flex-col gap-4">
|
|
||||||
<li className="flex items-center justify-between">
|
|
||||||
<p className="mr-4">login error modal</p>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
aria-label="login error modal 토글"
|
|
||||||
aria-pressed={!!loginErrorModalEnabled}
|
|
||||||
onClick={() => setLoginErrorModalEnabled?.(!loginErrorModalEnabled)}
|
|
||||||
className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${loginErrorModalEnabled ? 'bg-blue-600' : 'bg-gray-300'}`}
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
className={`inline-block h-5 w-5 transform rounded-full bg-white transition ${loginErrorModalEnabled ? 'translate-x-5' : 'translate-x-1'}`}
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
@@ -293,7 +293,7 @@ export default function LoginPage() {
|
|||||||
{/* 로그인 버튼 */}
|
{/* 로그인 버튼 */}
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
className={`h-[56px] w-full rounded-lg text-[16px] font-semibold text-white transition-opacity cursor-pointer mb-3 hover:bg-[#1F2B91] ${userId.trim().length > 0 && password.trim().length > 0 ? "bg-active-button" : "bg-inactive-button"}`}
|
className={`h-[56px] w-full rounded-lg text-[16px] font-semibold text-white transition-opacity cursor-pointer mb-3 ${userId.trim().length > 0 && password.trim().length > 0 ? "bg-active-button hover:bg-[#1F2B91]" : "bg-inactive-button"}`}
|
||||||
>
|
>
|
||||||
로그인
|
로그인
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
Reference in New Issue
Block a user