zenn/ghost.sori.studio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

헤더: 검색 트리거 최소 폭 및 브랜드 말줄임 (v0.2.10)

Browse Source 
Made-with: Cursor
This commit is contained in:
zenn
2026-04-17 13:57:17 +09:00
parent a08d053742
commit 93ce051343
8 changed files with 48 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
assets/built/screen.css
View File

@@ -22,6 +22,7 @@
--content-header: 720px;
--topbar-height: 62px;
--shell-width: calc(var(--sidebar-left) + var(--content-column) + var(--sidebar-right));
--topbar-search-min: 260px;
--font-sans: "Pretendard", "Apple SD Gothic Neo", "Noto Sans KR", "Segoe UI", sans-serif;
}
@@ -222,6 +223,14 @@ body.left-sidebar-collapsed .sidebar--left .sidebar__inner {
.brand--topbar {
margin-bottom: 0;
min-width: 0;
max-width: 100%;
}
.brand--topbar .brand__name {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.menu-groups {
@@ -656,7 +665,7 @@ body.left-sidebar-collapsed .sidebar--left .sidebar__inner {
.topbar__inner {
display: grid;
grid-template-columns: var(--sidebar-left) minmax(0, var(--content-column)) var(--sidebar-right);
grid-template-columns: var(--sidebar-left) minmax(var(--topbar-search-min), min(var(--content-column), 1fr)) var(--sidebar-right);
gap: 0;
align-items: center;
height: 100%;
@@ -665,7 +674,6 @@ body.left-sidebar-collapsed .sidebar--left .sidebar__inner {
}
.topbar__brand,
.topbar__search,
.topbar__actions {
min-width: 0;
}
@@ -676,6 +684,7 @@ body.left-sidebar-collapsed .sidebar--left .sidebar__inner {
display: flex;
align-items: center;
gap: 12px;
overflow: hidden;
}
.topbar__sidebar-toggle {
@@ -745,6 +754,8 @@ body:not(.left-sidebar-collapsed) .topbar__sidebar-toggle:hover .topbar__sidebar
padding: 0 18px;
height: 100%;
align-items: center;
min-width: 0;
box-sizing: border-box;
}
.search-trigger,
@@ -753,16 +764,28 @@ body:not(.left-sidebar-collapsed) .topbar__sidebar-toggle:hover .topbar__sidebar
align-items: center;
gap: 10px;
width: min(100%, 320px);
max-width: 100%;
padding: 10px 14px;
background: var(--surface);
color: var(--text-soft);
box-sizing: border-box;
}
.search-trigger {
min-width: min(var(--topbar-search-min), 100%);
cursor: pointer;
box-shadow: none;
}
.search-trigger__label {
min-width: 0;
flex: 1 1 auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: start;
}
.search-trigger__icon {
width: 16px;
height: 16px;
@@ -771,6 +794,7 @@ body:not(.left-sidebar-collapsed) .topbar__sidebar-toggle:hover .topbar__sidebar
.search-shortcut {
margin-left: auto;
flex-shrink: 0;
padding: 1px 7px;
border: 1px solid var(--border);
border-radius: 4px;