kjh2064/taxbaik
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Reduce admin title density
TaxBaik CI/CD / build-and-deploy (push) Successful in 58s
Details

Browse Source
This commit is contained in:
김재현
2026-07-09 16:58:55 +09:00
parent dfbc077679
commit bbb5d8dc55
3 changed files with 49 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/TaxBaik.Web/Pages/Admin/Dashboard.cshtml
+13 -13
View File
@@ -21,14 +21,14 @@
</div> </div>
</div> </div>
<div class="row row-deck row-cards g-2 mb-3 admin-dashboard-metrics"> <div class="row row-deck row-cards g-2 mb-2 admin-dashboard-metrics">
<div class="col-md-6 col-xl-3"> <div class="col-md-6 col-xl-3">
<div class="card card-sm admin-metric-card"> <div class="card card-sm admin-metric-card admin-metric-card--compact">
<div class="card-body"> <div class="card-body">
<div class="text-muted small text-uppercase mb-1">고객 관리</div> <div class="text-muted small text-uppercase mb-1">고객 관리</div>
<div class="d-flex align-items-center justify-content-between gap-3"> <div class="d-flex align-items-center justify-content-between gap-3">
<div> <div>
<h2 class="h4 mb-1">고객 목록</h2> <h3 class="h6 mb-1">고객 목록</h3>
<p class="text-muted mb-0">검색/상세/수정/삭제</p> <p class="text-muted mb-0">검색/상세/수정/삭제</p>
</div> </div>
<span class="avatar avatar-rounded bg-primary-lt text-primary">01</span> <span class="avatar avatar-rounded bg-primary-lt text-primary">01</span>
@@ -37,12 +37,12 @@
</div> </div>
</div> </div>
<div class="col-md-6 col-xl-3"> <div class="col-md-6 col-xl-3">
<div class="card card-sm admin-metric-card"> <div class="card card-sm admin-metric-card admin-metric-card--compact">
<div class="card-body"> <div class="card-body">
<div class="text-muted small text-uppercase mb-1">DB 관리</div> <div class="text-muted small text-uppercase mb-1">DB 관리</div>
<div class="d-flex align-items-center justify-content-between gap-3"> <div class="d-flex align-items-center justify-content-between gap-3">
<div> <div>
<h2 class="h4 mb-1">Flyway</h2> <h3 class="h6 mb-1">Flyway</h3>
<p class="text-muted mb-0">SQL migration 추적</p> <p class="text-muted mb-0">SQL migration 추적</p>
</div> </div>
<span class="avatar avatar-rounded bg-indigo-lt text-indigo">02</span> <span class="avatar avatar-rounded bg-indigo-lt text-indigo">02</span>
@@ -51,12 +51,12 @@
</div> </div>
</div> </div>
<div class="col-md-6 col-xl-3"> <div class="col-md-6 col-xl-3">
<div class="card card-sm admin-metric-card"> <div class="card card-sm admin-metric-card admin-metric-card--compact">
<div class="card-body"> <div class="card-body">
<div class="text-muted small text-uppercase mb-1">인증</div> <div class="text-muted small text-uppercase mb-1">인증</div>
<div class="d-flex align-items-center justify-content-between gap-3"> <div class="d-flex align-items-center justify-content-between gap-3">
<div> <div>
<h2 class="h4 mb-1">Cookie Auth</h2> <h3 class="h6 mb-1">Cookie Auth</h3>
<p class="text-muted mb-0">서버 세션 유지</p> <p class="text-muted mb-0">서버 세션 유지</p>
</div> </div>
<span class="avatar avatar-rounded bg-green-lt text-green">03</span> <span class="avatar avatar-rounded bg-green-lt text-green">03</span>
@@ -65,12 +65,12 @@
</div> </div>
</div> </div>
<div class="col-md-6 col-xl-3"> <div class="col-md-6 col-xl-3">
<div class="card card-sm admin-metric-card"> <div class="card card-sm admin-metric-card admin-metric-card--compact">
<div class="card-body"> <div class="card-body">
<div class="text-muted small text-uppercase mb-1">콘텐츠</div> <div class="text-muted small text-uppercase mb-1">콘텐츠</div>
<div class="d-flex align-items-center justify-content-between gap-3"> <div class="d-flex align-items-center justify-content-between gap-3">
<div> <div>
<h2 class="h4 mb-1">블로그 편집</h2> <h3 class="h6 mb-1">블로그 편집</h3>
<p class="text-muted mb-0">에디터 + 미리보기</p> <p class="text-muted mb-0">에디터 + 미리보기</p>
</div> </div>
<span class="avatar avatar-rounded bg-yellow-lt text-yellow">04</span> <span class="avatar avatar-rounded bg-yellow-lt text-yellow">04</span>
@@ -84,9 +84,9 @@
<div class="col-12 col-xl-8"> <div class="col-12 col-xl-8">
<div class="card"> <div class="card">
<div class="card-header"> <div class="card-header">
<h3 class="card-title mb-0">빠른 작업</h3> <h3 class="card-title mb-0 h6">빠른 작업</h3>
</div> </div>
<div class="card-body"> <div class="card-body py-2">
<div class="list-group list-group-flush"> <div class="list-group list-group-flush">
<a class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" href="/admin/customers"> <a class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" href="/admin/customers">
<span>고객 목록으로 이동</span> <span>고객 목록으로 이동</span>
@@ -107,9 +107,9 @@
<div class="col-12 col-xl-4"> <div class="col-12 col-xl-4">
<div class="card"> <div class="card">
<div class="card-header"> <div class="card-header">
<h3 class="card-title mb-0">운영 노트</h3> <h3 class="card-title mb-0 h6">운영 노트</h3>
</div> </div>
<div class="card-body"> <div class="card-body py-2">
<div class="alert alert-info mb-0"> <div class="alert alert-info mb-0">
Razor Pages, Dapper, Flyway, Cookie Auth, Tabler 기준으로 서버 렌더링 중심의 어드민을 유지합니다. Razor Pages, Dapper, Flyway, Cookie Auth, Tabler 기준으로 서버 렌더링 중심의 어드민을 유지합니다.
</div> </div>
src/TaxBaik.Web/Pages/Admin/_AdminLayout.cshtml
+3 -6
View File
@@ -43,13 +43,10 @@
<div class="page-wrapper"> <div class="page-wrapper">
<div class="container-fluid"> <div class="container-fluid">
<div class="row g-2"> <div class="row g-2">
<aside class="col-12 col-lg-3 col-xxl-2"> <aside class="col-12 col-lg-2 col-xxl-2">
<div class="card shadow-sm border-0 admin-sidebar-card sticky-top"> <div class="card shadow-sm border-0 admin-sidebar-card sticky-top">
<div class="card-header admin-sidebar-header"> <div class="card-header admin-sidebar-header">
<div> <h3 class="card-title mb-0 admin-sidebar-title">관리 메뉴</h3>
<div class="text-uppercase text-muted small">Navigation</div>
<h3 class="card-title mb-0">관리 메뉴</h3>
</div>
</div> </div>
<div class="card-body p-0 admin-sidebar-body"> <div class="card-body p-0 admin-sidebar-body">
<div class="accordion accordion-flush" id="adminSidebarAccordion"> <div class="accordion accordion-flush" id="adminSidebarAccordion">
@@ -115,7 +112,7 @@
</div> </div>
</div> </div>
</aside> </aside>
<main class="col-12 col-lg-9 col-xxl-10"> <main class="col-12 col-lg-10 col-xxl-10">
<div class="card shadow-sm border-0 admin-content-card admin-main-surface"> <div class="card shadow-sm border-0 admin-content-card admin-main-surface">
<div class="card-body p-3 p-md-4 p-xl-4"> <div class="card-body p-3 p-md-4 p-xl-4">
@RenderBody() @RenderBody()
src/TaxBaik.Web/wwwroot/css/admin.css
+33 -16
View File
@@ -368,8 +368,8 @@ html, body {
.admin-sidebar-header { .admin-sidebar-header {
background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%); background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
border-bottom: 1px solid var(--border-color-light); border-bottom: 1px solid var(--border-color-light);
padding-top: 0.75rem; padding-top: 0.5rem;
padding-bottom: 0.75rem; padding-bottom: 0.5rem;
} }
.admin-sidebar-body { .admin-sidebar-body {
@@ -378,11 +378,11 @@ html, body {
.admin-sidebar-card .accordion-button { .admin-sidebar-card .accordion-button {
font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold);
font-size: 0.82rem; font-size: 0.75rem;
color: var(--text-primary); color: var(--text-primary);
background: #fff; background: #fff;
padding-top: 0.7rem; padding-top: 0.55rem;
padding-bottom: 0.7rem; padding-bottom: 0.55rem;
} }
.admin-sidebar-card .accordion-button:not(.collapsed) { .admin-sidebar-card .accordion-button:not(.collapsed) {
@@ -394,10 +394,10 @@ html, body {
.admin-sidebar-card .list-group-item { .admin-sidebar-card .list-group-item {
border: 0; border: 0;
border-radius: 0; border-radius: 0;
padding: 0.65rem 0.9rem; padding: 0.55rem 0.75rem;
color: var(--text-primary); color: var(--text-primary);
background: transparent; background: transparent;
font-size: 0.8rem; font-size: 0.74rem;
} }
.admin-sidebar-card .list-group-item:hover { .admin-sidebar-card .list-group-item:hover {
@@ -982,7 +982,7 @@ textarea:focus-visible {
.admin-nav .mud-nav-link { .admin-nav .mud-nav-link {
min-height: 28px; min-height: 28px;
font-size: 0.75rem; font-size: 0.72rem;
} }
.admin-nav .mud-nav-link .mud-stack { .admin-nav .mud-nav-link .mud-stack {
@@ -1004,7 +1004,11 @@ textarea:focus-visible {
.admin-nav .mud-nav-group-header { .admin-nav .mud-nav-group-header {
min-height: 28px; min-height: 28px;
font-size: 0.75rem; font-size: 0.72rem;
}
.admin-sidebar-title {
font-size: 0.82rem;
} }
.admin-nav .mud-nav-link:hover { .admin-nav .mud-nav-link:hover {
@@ -1256,7 +1260,7 @@ textarea:focus-visible {
} }
.admin-page-header-title { .admin-page-header-title {
font-size: 1.25rem; font-size: 1.08rem;
line-height: 1.15; line-height: 1.15;
} }
@@ -1274,21 +1278,34 @@ textarea:focus-visible {
} }
.admin-dashboard-metrics .card-body { .admin-dashboard-metrics .card-body {
padding: 0.95rem; padding: 0.8rem;
}
.admin-metric-card--compact .card-body {
padding: 0.8rem 0.85rem;
} }
.admin-metric-card .h4 { .admin-metric-card .h4 {
font-size: 1rem; font-size: 0.88rem;
}
.admin-metric-card .h6 {
font-size: 0.88rem;
margin-bottom: 0.25rem !important;
} }
.admin-metric-card p { .admin-metric-card p {
font-size: 0.78rem; font-size: 0.73rem;
} }
.admin-metric-card .avatar { .admin-metric-card .avatar {
width: 2rem; width: 1.75rem;
height: 2rem; height: 1.75rem;
font-size: 0.75rem; font-size: 0.7rem;
}
.admin-dashboard-metrics .card {
min-height: 100%;
} }
.blog-editor-header .badge-sm { .blog-editor-header .badge-sm {