fix: PC 레이아웃 — 사이드바를 좌측 상단까지 확장, 헤더는 우측 영역만
- App.vue 그리드 'top top' → 'left top' (사이드바가 헤더 행까지 차지) - 사이드바 브랜드 영역 높이 56px 로 헤더와 정렬(보더 일치) - 모바일은 기존 드로어 구조 유지 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
+1
-1
@@ -68,7 +68,7 @@ watch(() => route.fullPath, () => ui.closeSidebar())
|
|||||||
.layout {
|
.layout {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-areas:
|
grid-template-areas:
|
||||||
'top top'
|
'left top'
|
||||||
'left body'
|
'left body'
|
||||||
'bottom bottom';
|
'bottom bottom';
|
||||||
grid-template-columns: 220px 1fr;
|
grid-template-columns: 220px 1fr;
|
||||||
|
|||||||
@@ -100,13 +100,14 @@ const icons = {
|
|||||||
.app-sidebar {
|
.app-sidebar {
|
||||||
background: var(--color-background-soft);
|
background: var(--color-background-soft);
|
||||||
border-right: 1px solid var(--color-border);
|
border-right: 1px solid var(--color-border);
|
||||||
padding: 1rem 0;
|
padding: 0 0 1rem;
|
||||||
}
|
}
|
||||||
.drawer-head {
|
.drawer-head {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
padding: 0.5rem 1.1rem 0.75rem;
|
height: 56px; /* 헤더 높이와 맞춰 상단 정렬 (하단 보더 일치) */
|
||||||
|
padding: 0 1.1rem;
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: 0.5rem;
|
||||||
border-bottom: 1px solid var(--color-border);
|
border-bottom: 1px solid var(--color-border);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user