前端提交
This commit is contained in:
@@ -0,0 +1,20 @@
|
||||
.auth-page { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 5fr) minmax(420px, 4fr); background: var(--surface); }
|
||||
.auth-page__context { padding: var(--space-8); display: flex; flex-direction: column; justify-content: space-between; color: var(--surface); background: var(--brand-dark); }
|
||||
.auth-page__brand { display: flex; align-items: center; gap: var(--space-3); }
|
||||
.auth-page__mark { width: 40px; height: 40px; border-radius: var(--radius-md); }
|
||||
.auth-page__brand-name { font-size: var(--fs-title); }
|
||||
.auth-page__statement { max-width: 620px; }
|
||||
.auth-page__statement h1 { margin: 0; max-width: 620px; font-size: var(--fs-display); line-height: 1.55; }
|
||||
.auth-page__statement p { margin: var(--space-4) 0 0; max-width: 560px; color: var(--line); line-height: 1.85; }
|
||||
.auth-page__legal { color: var(--line); font-size: var(--fs-small); line-height: 1.7; }
|
||||
.auth-page__form-area { padding: var(--space-8); display: grid; place-items: center; background: var(--canvas); }
|
||||
.login-panel { width: min(100%, 420px); padding: var(--space-6); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-card); }
|
||||
.login-panel__header { margin-bottom: var(--space-6); }
|
||||
.login-panel__header h2 { margin: 0; font-size: var(--fs-display); }
|
||||
.login-panel__header p { margin: var(--space-2) 0 0; color: var(--muted); line-height: 1.7; }
|
||||
.login-panel__form { display: grid; gap: var(--space-4); }
|
||||
.login-panel__submit { width: 100%; }
|
||||
.login-panel__footer { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--line); color: var(--muted); font-size: var(--fs-small); line-height: 1.7; }
|
||||
.login-panel__footer a { color: var(--brand-dark); }
|
||||
@media (max-width: 900px) { .auth-page { grid-template-columns: 1fr; } .auth-page__context { min-height: 260px; padding: var(--space-6); } .auth-page__legal { margin-top: var(--space-5); } .auth-page__form-area { padding: var(--space-6); } }
|
||||
@media (max-width: 620px) { .auth-page__context, .auth-page__form-area { padding: var(--space-5) var(--space-4); } .login-panel { padding: var(--space-5); } }
|
||||
Reference in New Issue
Block a user