v0.1.13 상단 토글 및 좌측 패널 구조 수정
This commit is contained in:
@@ -125,72 +125,15 @@ input {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.sidebar-left__toolbar {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding-top: 12px;
|
||||
body.left-sidebar-collapsed .site-shell {
|
||||
width: calc(var(--content-column) + var(--sidebar-right));
|
||||
grid-template-columns: minmax(0, var(--content-column)) var(--sidebar-right);
|
||||
}
|
||||
|
||||
.sidebar-left__toggle {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: var(--text-dim);
|
||||
cursor: pointer;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.sidebar-left__toggle:hover {
|
||||
background: var(--surface-muted);
|
||||
}
|
||||
|
||||
.sidebar-left__toggle-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.sidebar-left__toggle-icon--close {
|
||||
body.left-sidebar-collapsed .sidebar--left {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .site-shell,
|
||||
body.left-sidebar-collapsed .topbar {
|
||||
grid-template-columns: 56px minmax(0, var(--content-column)) var(--sidebar-right);
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .sidebar-left__toggle-icon--open {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .sidebar-left__toggle-icon--close {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .sidebar--left .menu-link__label,
|
||||
body.left-sidebar-collapsed .sidebar--left .menu-group__content,
|
||||
body.left-sidebar-collapsed .sidebar--left .sidebar-card,
|
||||
body.left-sidebar-collapsed .sidebar--left .sidebar-footer {
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .sidebar--left .menu-group__trigger {
|
||||
justify-content: center;
|
||||
padding-inline: 0;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .sidebar--left .menu-group__chevron {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .sidebar--left .menu-link {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.sidebar__inner--right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -525,6 +468,51 @@ body.left-sidebar-collapsed .sidebar--left .menu-link {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.topbar__sidebar-toggle {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: var(--text-dim);
|
||||
cursor: pointer;
|
||||
border-radius: 8px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.topbar__sidebar-toggle:hover {
|
||||
background: var(--surface-muted);
|
||||
}
|
||||
|
||||
.topbar__sidebar-toggle-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.topbar__sidebar-toggle-icon--close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .topbar__sidebar-toggle-icon--open {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .topbar__sidebar-toggle-icon--close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body:not(.left-sidebar-collapsed) .topbar__sidebar-toggle-icon--open {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body:not(.left-sidebar-collapsed) .topbar__sidebar-toggle-icon--close {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.topbar__search {
|
||||
@@ -1377,9 +1365,9 @@ body.left-sidebar-collapsed .sidebar--left .menu-link {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
body.left-sidebar-collapsed .site-shell,
|
||||
body.left-sidebar-collapsed .topbar {
|
||||
grid-template-columns: 56px minmax(0, 1fr);
|
||||
body.left-sidebar-collapsed .site-shell {
|
||||
width: min(100%, var(--content-column));
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
}
|
||||
|
||||
.sidebar--right {
|
||||
|
||||
Reference in New Issue
Block a user