hyunho/MH-DashBoard-organization
1
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases Wiki Activity

헤더 슬림 화이트 스타일 적용

Browse Source
This commit is contained in:
hyunho
2026-03-25 12:36:34 +09:00
parent fef83b6036
commit e8db9fb3e7
1 changed files with 53 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
frontend/public/styles.css
View File

@@ -149,30 +149,37 @@
} }
.dashboard-header { .dashboard-header {
min-height: 88px; min-height: 68px;
background: rgba(30, 41, 59, 0.96); background: rgba(255, 255, 255, 0.94);
color: #fff; color: var(--color-text);
border-bottom: 1px solid rgba(148, 163, 184, 0.2); border-bottom: 1px solid #d7dee8;
display: grid; display: grid;
grid-template-columns: auto 1fr auto; grid-template-columns: auto 1fr auto;
align-items: center; align-items: center;
gap: 20px; gap: 16px;
padding: 18px 26px; padding: 10px 22px;
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 50; z-index: 50;
backdrop-filter: blur(16px); backdrop-filter: blur(12px);
} }
.dashboard-header .eyebrow { .dashboard-header .eyebrow {
color: #a5b4fc; color: var(--color-accent);
margin-bottom: 6px; margin-bottom: 2px;
}
.dashboard-header h2 {
font-size: 28px;
line-height: 1;
letter-spacing: -0.04em;
color: var(--color-text);
} }
.header-center { .header-center {
display: flex; display: flex;
justify-content: center; justify-content: center;
gap: 10px; gap: 8px;
flex-wrap: wrap; flex-wrap: wrap;
} }
@@ -180,13 +187,13 @@
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
min-height: 40px; min-height: 34px;
padding: 0 16px; padding: 0 14px;
border-radius: 999px; border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid #dbe2ea;
background: rgba(255, 255, 255, 0.08); background: #f8fafc;
color: #e2e8f0; color: var(--color-text-muted);
font-size: 13px; font-size: 12px;
font-weight: 800; font-weight: 800;
} }
@@ -194,55 +201,61 @@
background: var(--color-accent); background: var(--color-accent);
border-color: transparent; border-color: transparent;
color: #fff; color: #fff;
box-shadow: 0 10px 24px rgba(79, 70, 229, 0.3); box-shadow: 0 10px 20px rgba(79, 70, 229, 0.2);
} }
.nav-pill.muted { .nav-pill.muted {
color: #94a3b8; color: #64748b;
} }
.header-actions { .header-actions {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 8px;
} }
.status-badge, .status-badge,
.user-badge { .user-badge {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
min-height: 40px; min-height: 34px;
padding: 0 12px;
border-radius: 999px;
font-size: 11px;
font-weight: 800;
}
.status-badge {
background: #eef2ff;
color: var(--color-accent-strong);
border: 1px solid #dfe5ff;
}
.user-badge {
background: #f8fafc;
color: var(--color-text);
border: 1px solid #dbe2ea;
}
.ghost-button {
min-height: 34px;
border: 1px solid #dbe2ea;
background: #fff;
color: var(--color-text);
padding: 0 14px; padding: 0 14px;
border-radius: 999px; border-radius: 999px;
font-size: 12px; font-size: 12px;
font-weight: 800; font-weight: 800;
} }
.status-badge {
background: rgba(79, 70, 229, 0.18);
color: #c7d2fe;
}
.user-badge {
background: rgba(255, 255, 255, 0.1);
color: #fff;
}
.ghost-button {
border: 1px solid rgba(255, 255, 255, 0.16);
background: transparent;
color: #fff;
padding: 0 16px;
}
.dashboard-main { .dashboard-main {
flex: 1; flex: 1;
min-height: calc(100vh - 88px); min-height: calc(100vh - 68px);
padding: 0; padding: 0;
} }
.main-stage { .main-stage {
height: calc(100vh - 88px); height: calc(100vh - 68px);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
@@ -305,6 +318,6 @@
} }
.main-stage { .main-stage {
height: calc(100vh - 88px); height: calc(100vh - 68px);
} }
} }