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

color and logo

Browse Source
This commit is contained in:
koreacomp5
2025-11-17 10:36:53 +09:00
parent 99e2ca6eff
commit eca3e76c72
2 changed files with 19 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/app/login/page.tsx
View File

@@ -2,6 +2,7 @@
import { useState } from "react";
import Link from "next/link";
import MainLogo from "@/app/svgs/mainlogosvg"
export default function LoginPage() {
const [userId, setUserId] = useState("");
@@ -19,14 +20,13 @@ export default function LoginPage() {
return (
<div className="min-h-screen w-full flex flex-col items-center justify-center">
{/* 카드 컨테이너 */}
<div className="w-[480px] rounded-xl border border-[var(--color-input-border)] bg-white p-8 shadow-sm">
<div className="w-[480px] rounded-xl bg-white p-8 ">
{/* 로고 영역 */}
<div className="mb-10 flex flex-col items-center">
<div className="mb-2 flex h-[54px] w-[72px] items-center justify-center rounded-md bg-[var(--color-inactive-button)]/20" />
<div
className="text-[28px] font-semibold leading-none"
style={{ color: "var(--color-logo-text)" }}
>
<div className="mb-[7px]">
<MainLogo/>
</div>
<div className="text-[28.8px] font-[800] leading-[145%] text-neutral-700" >
XR LMS
</div>
</div>
@@ -44,25 +44,14 @@ export default function LoginPage() {
name="userId"
value={userId}
onChange={(e) => setUserId(e.target.value)}
placeholder="아이디"
className="h-14 w-full rounded-lg border px-4 text-[15px] outline-none transition-shadow"
style={{
borderColor: "var(--color-input-border)",
color: "var(--color-basic-text)",
// placeholder 색상
// Tailwind v4 arbitrary 적용이 번거로워 인라인 사용
}}
onFocus={(e) => {
e.currentTarget.style.boxShadow =
"0 0 0 2px rgba(51,60,71,0.15)";
e.currentTarget.style.borderColor =
"var(--color-input-border-select)";
}}
onBlur={(e) => {
e.currentTarget.style.boxShadow = "none";
e.currentTarget.style.borderColor =
"var(--color-input-border)";
}}
placeholder="아이디 (이메일)"
className="w-[480px] h-[56px] px-[12px] py-[7px] rounded-[8px] border border-neutral-40
focus:outline-none focus:ring-0 focus:ring-offset-0 focus:shadow-none
focus:appearance-none focus:border-neutral-700
text-[18px] text-neutral-700 font-[400] leading-[150%] placeholder:text-input-placeholder-text "
/>
</div>
{/* 비밀번호 */}
@@ -78,21 +67,6 @@ export default function LoginPage() {
onChange={(e) => setPassword(e.target.value)}
placeholder="비밀번호"
className="h-14 w-full rounded-lg border px-4 text-[15px] outline-none transition-shadow"
style={{
borderColor: "var(--color-input-border)",
color: "var(--color-basic-text)",
}}
onFocus={(e) => {
e.currentTarget.style.boxShadow =
"0 0 0 2px rgba(51,60,71,0.15)";
e.currentTarget.style.borderColor =
"var(--color-input-border-select)";
}}
onBlur={(e) => {
e.currentTarget.style.boxShadow = "none";
e.currentTarget.style.borderColor =
"var(--color-input-border)";
}}
/>
</div>
</div>
@@ -132,7 +106,7 @@ export default function LoginPage() {
{/* 로그인 버튼 */}
<button
type="submit"
className="h-14 w-full rounded-lg text-[16px] font-semibold text-white transition-opacity"
className="h-14 w-full rounded-lg text-[16px] font-semibold text-white transition-opacity cursor-pointer"
style={{ backgroundColor: "var(--color-active-button)" }}
>
로그인