style: 統一後台品牌視覺
This commit is contained in:
@@ -23,8 +23,8 @@ button, input, select, textarea { font: inherit; }
|
||||
button, .button { min-height: 42px; }
|
||||
|
||||
.admin-topbar { position: sticky; z-index: 20; top: 0; min-height: 68px; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; color: var(--color-text-inverse); background: var(--color-bg); border-bottom: 1px solid rgba(255, 204, 0, .3); }
|
||||
.admin-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 900; letter-spacing: .06em; }
|
||||
.admin-brand i { color: var(--color-brand); }
|
||||
.admin-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
|
||||
.admin-brand__logo { display: block; width: clamp(190px, 20vw, 250px); max-height: 46px; height: auto; object-fit: contain; }
|
||||
.admin-brand small { padding-left: 10px; color: var(--color-brand-light); border-left: 1px solid rgba(255, 255, 255, .25); font-weight: 500; }
|
||||
.admin-topbar__actions { display: flex; align-items: center; gap: 18px; font-size: .9rem; }
|
||||
.admin-topbar__actions a { color: var(--color-brand-light); text-decoration: none; }
|
||||
@@ -109,11 +109,14 @@ tbody tr:hover { background: rgba(255, 204, 0, .06); }
|
||||
.inline-form label { display: flex; flex-direction: column; gap: 6px; color: var(--color-text-muted); font-size: .82rem; font-weight: 700; }
|
||||
|
||||
.auth-page { display: grid; place-items: center; padding: 24px; color: var(--color-text-inverse); background: var(--color-bg); background-image: radial-gradient(circle at 20% 10%, rgba(255, 204, 0, .16), transparent 32%), radial-gradient(circle at 80% 90%, rgba(252, 238, 167, .1), transparent 34%); }
|
||||
.auth-card { width: min(460px, 100%); padding: clamp(28px, 6vw, 48px); border: 1px solid rgba(255, 204, 0, .35); border-radius: 20px; background: var(--color-bg-raised); box-shadow: 0 26px 80px rgba(0, 0, 0, .45); }
|
||||
.auth-card { position: relative; width: min(500px, 100%); padding: clamp(28px, 6vw, 48px); overflow: hidden; border: 1px solid rgba(255, 204, 0, .35); border-radius: 20px; background: var(--color-bg-raised); box-shadow: 0 26px 80px rgba(0, 0, 0, .45); }
|
||||
.auth-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, transparent, var(--color-brand), transparent); }
|
||||
.auth-brand { display: flex; flex-direction: column; align-items: center; gap: 9px; width: 100%; margin: 0 auto 24px; color: var(--color-brand-light); text-decoration: none; }
|
||||
.auth-brand img { display: block; width: min(340px, 92%); height: auto; object-fit: contain; }
|
||||
.auth-brand span { font-size: .68rem; font-weight: 800; letter-spacing: .2em; text-align: center; }
|
||||
.auth-card h1 { margin: 7px 0 10px; color: var(--color-text-inverse); text-align: center; }
|
||||
.auth-card > p { color: var(--color-brand-light); text-align: center; }
|
||||
.auth-card .eyebrow { color: var(--color-brand); }
|
||||
.auth-gem { color: var(--color-brand); font-size: 2.5rem; text-align: center; }
|
||||
.auth-card form { display: flex; flex-direction: column; gap: 17px; margin-top: 28px; }
|
||||
.auth-card label { display: flex; flex-direction: column; gap: 7px; color: var(--color-text-inverse); font-size: .9rem; }
|
||||
.auth-card input { color: var(--color-text-inverse); background: var(--color-bg); border-color: rgba(255, 204, 0, .36); }
|
||||
@@ -128,6 +131,7 @@ tbody tr:hover { background: rgba(255, 204, 0, .06); }
|
||||
@media (max-width: 760px) {
|
||||
.admin-topbar { padding-inline: 16px; }
|
||||
.admin-brand small, .admin-topbar__actions span { display: none; }
|
||||
.admin-brand__logo { width: min(190px, 48vw); }
|
||||
.admin-shell { display: block; }
|
||||
.admin-sidebar { position: fixed; z-index: 30; inset: 68px auto 0 0; width: min(290px, 86vw); transform: translateX(-105%); transition: transform .2s ease; overflow-y: auto; }
|
||||
.admin-sidebar.is-open { transform: translateX(0); }
|
||||
|
||||
Reference in New Issue
Block a user