revert: 로그인 페이지 게임 에셋 스타일 롤백
All checks were successful
Client CI/CD / test (push) Successful in 11s
Client CI/CD / deploy (push) Successful in 16s

비주얼 오버홀에서 적용된 로그인 페이지의 배경 이미지, 카드 프레임,
구분선 이미지를 이전 스타일로 되돌림

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-27 09:08:18 +09:00
parent b9bdbcaabc
commit 73ab907e09
2 changed files with 22 additions and 38 deletions

View File

@@ -3,36 +3,20 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: background-color: #2E2C2F;
radial-gradient(ellipse at center, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.8) 100%), background-image:
url('/images/bg_login.webp') center/cover no-repeat; radial-gradient(ellipse at 20% 50%, rgba(186, 205, 176, 0.08) 0%, transparent 50%),
background-color: #1a1a1a; radial-gradient(ellipse at 80% 50%, rgba(186, 205, 176, 0.05) 0%, transparent 50%);
} }
.login-panel { .login-panel {
position: relative;
width: 100%; width: 100%;
max-width: 420px; max-width: 400px;
padding: 48px 40px; padding: 48px 40px;
background: rgba(0, 0, 0, 0.6); background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(186, 205, 176, 0.15);
border-radius: 12px; border-radius: 12px;
backdrop-filter: blur(12px); backdrop-filter: blur(10px);
overflow: hidden;
border: none;
}
.login-panel::before {
content: '';
position: absolute;
inset: -8px;
background: url('/images/card_frame.webp') center/100% 100% no-repeat;
pointer-events: none;
z-index: 0;
}
.login-panel > * {
position: relative;
z-index: 1;
} }
.login-header { .login-header {
@@ -132,15 +116,21 @@
.login-divider { .login-divider {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; gap: 16px;
margin: 24px 0; margin: 24px 0;
} }
.login-divider-img { .login-divider::before,
width: 100%; .login-divider::after {
max-width: 250px; content: '';
height: 16px; flex: 1;
background: url('/images/divider.webp') center/contain no-repeat; height: 1px;
background: rgba(255, 255, 255, 0.1);
}
.login-divider span {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.35);
} }
.btn-ssafy { .btn-ssafy {
@@ -222,11 +212,6 @@
padding: 32px 20px; padding: 32px 20px;
margin: 0 12px; margin: 0 12px;
border-radius: 8px; border-radius: 8px;
border: 1px solid rgba(186, 205, 176, 0.3);
}
.login-panel::before {
display: none;
} }
.game-title { .game-title {

View File

@@ -36,7 +36,6 @@ export default function LoginPage() {
<div className="login-page"> <div className="login-page">
<div className="login-panel"> <div className="login-panel">
<div className="login-header"> <div className="login-header">
<img src="/images/logo.webp" alt="One of the Plans" style={{maxWidth: 120, height: 'auto', margin: '0 auto 16px', display: 'block'}} />
<h1 className="game-title">One of the plans</h1> <h1 className="game-title">One of the plans</h1>
<p className="game-subtitle">MULTIPLAYER</p> <p className="game-subtitle">MULTIPLAYER</p>
</div> </div>
@@ -73,13 +72,13 @@ export default function LoginPage() {
{justRegistered && <p className="login-success">회원가입이 완료되었습니다. 로그인해주세요.</p>} {justRegistered && <p className="login-success">회원가입이 완료되었습니다. 로그인해주세요.</p>}
{error && <p id="login-error" className="login-error" role="alert">{error}</p>} {error && <p id="login-error" className="login-error" role="alert">{error}</p>}
<button type="submit" className="btn-login btn-game" disabled={loading}> <button type="submit" className="btn-login" disabled={loading}>
{loading ? '로그인 중...' : '로그인'} {loading ? '로그인 중...' : '로그인'}
</button> </button>
</form> </form>
<div className="login-divider"> <div className="login-divider">
<div className="login-divider-img"></div> <span>또는</span>
</div> </div>
<button <button