로그인 박스 축소 조정
This commit is contained in:
@@ -14,7 +14,7 @@
|
||||
<div class="login-backdrop">
|
||||
<form id="login-form" class="login-card">
|
||||
<div class="login-brand">
|
||||
<p class="eyebrow">MH Dash Board</p>
|
||||
<p class="eyebrow">GPD/TDC</p>
|
||||
<h1>MH Dash Board</h1>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -72,23 +72,23 @@ a {
|
||||
}
|
||||
|
||||
.login-card {
|
||||
width: min(1240px, 100%);
|
||||
min-height: 360px;
|
||||
width: min(640px, 100%);
|
||||
min-height: 210px;
|
||||
display: grid;
|
||||
grid-template-columns: 1.45fr 0.55fr;
|
||||
grid-template-columns: 1.3fr 0.7fr;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(255, 255, 255, 0.14);
|
||||
border-radius: 28px;
|
||||
border-radius: 22px;
|
||||
background: rgba(71, 85, 105, 0.34);
|
||||
box-shadow: 0 28px 80px rgba(15, 23, 42, 0.28);
|
||||
backdrop-filter: blur(18px);
|
||||
box-shadow: 0 24px 60px rgba(15, 23, 42, 0.24);
|
||||
backdrop-filter: blur(14px);
|
||||
}
|
||||
|
||||
.login-brand {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 56px 52px;
|
||||
padding: 30px 30px;
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.08);
|
||||
background:
|
||||
linear-gradient(90deg, rgba(15, 23, 42, 0.08), rgba(255, 255, 255, 0.02)),
|
||||
@@ -96,43 +96,44 @@ a {
|
||||
}
|
||||
|
||||
.login-brand .eyebrow {
|
||||
margin-bottom: 14px;
|
||||
margin-bottom: 10px;
|
||||
color: rgba(255, 255, 255, 0.72);
|
||||
letter-spacing: 0.22em;
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.18em;
|
||||
}
|
||||
|
||||
.login-brand h1 {
|
||||
font-size: clamp(2.4rem, 4.2vw, 3.9rem);
|
||||
line-height: 0.95;
|
||||
letter-spacing: -0.05em;
|
||||
font-size: clamp(1.7rem, 3.2vw, 2.5rem);
|
||||
line-height: 0.96;
|
||||
letter-spacing: -0.04em;
|
||||
color: #f8fafc;
|
||||
}
|
||||
|
||||
.login-form-wrap {
|
||||
padding: 46px 30px;
|
||||
padding: 24px 20px;
|
||||
display: grid;
|
||||
align-content: center;
|
||||
gap: 14px;
|
||||
gap: 10px;
|
||||
background: rgba(15, 23, 42, 0.12);
|
||||
}
|
||||
|
||||
.login-card label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
font-size: 13px;
|
||||
gap: 4px;
|
||||
font-size: 11px;
|
||||
font-weight: 800;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.login-card input {
|
||||
min-height: 46px;
|
||||
min-height: 34px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
border-radius: 999px;
|
||||
padding: 11px 18px;
|
||||
padding: 8px 14px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
color: #f8fafc;
|
||||
font-size: 13px;
|
||||
font-size: 11px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
@@ -159,19 +160,20 @@ a {
|
||||
}
|
||||
|
||||
.login-card button {
|
||||
margin-top: 4px;
|
||||
margin-top: 2px;
|
||||
border: none;
|
||||
color: #fff;
|
||||
background: rgba(31, 41, 55, 0.82);
|
||||
box-shadow: 0 14px 30px rgba(15, 23, 42, 0.22);
|
||||
min-height: 42px;
|
||||
font-size: 13px;
|
||||
min-height: 34px;
|
||||
border-radius: 999px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.helper-text {
|
||||
margin: 0;
|
||||
min-height: 20px;
|
||||
font-size: 12px;
|
||||
min-height: 16px;
|
||||
font-size: 10px;
|
||||
color: rgba(248, 250, 252, 0.8);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user