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

16
partials/site/topbar.hbs
View File

@@ -23,7 +23,7 @@
</i>
</span>
</button>
<a class="brand brand--topbar inline-flex items-center gap-2.5 whitespace-nowrap" href="{{@site.url}}">
<a class="brand brand--topbar inline-flex min-w-0 max-w-full items-center gap-2.5" href="{{@site.url}}">
{{#if @site.logo}}
<img class="max-h-8 w-auto object-contain" src="{{@site.logo}}" alt="{{@site.title}}">
{{else}}
@@ -31,17 +31,17 @@
{{/if}}
</a>
</div>
<div class="topbar__search flex h-full items-center justify-center px-4">
<button class="search-trigger flex w-full max-w-xs items-center gap-2.5 rounded-xl border border-brd bg-bgr px-3.5 py-2 text-sm text-typ-tone transition-colors hover:bg-bgr-tone hover:text-typ" type="button" data-search-open aria-label="Open search">
<i class="icon icon-search size-5 md:size-4 stroke-2 md:stroke-[2.25] fill-bgr-tone [&amp;&gt;svg]:fill-inherit" role="presentation">
<div class="topbar-search topbar__search flex h-full min-w-0 items-center justify-center px-4">
<button class="search-trigger flex w-full min-w-0 max-w-xs items-center gap-2.5 rounded-xl border border-brd bg-bgr px-3.5 py-2 text-sm text-typ-tone transition-colors hover:bg-bgr-tone hover:text-typ" type="button" data-search-open aria-label="Open search">
<i class="icon icon-search shrink-0 size-5 md:size-4 stroke-2 md:stroke-[2.25] fill-bgr-tone [&amp;&gt;svg]:fill-inherit" role="presentation">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-search" width="16" height="16" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<circle cx="10" cy="10" r="7"></circle>
<line x1="21" y1="21" x2="15" y2="15"></line>
</svg>
</i>
<span>Search</span>
<span class="search-shortcut">/</span>
<span class="search-trigger__label">Search</span>
<span class="search-shortcut shrink-0">/</span>
</button>
</div>
<div class="topbar__actions relative flex h-full items-center justify-end gap-2 px-4 lg:px-0">
@@ -102,7 +102,7 @@
<path d="M15 15v-6h-6"></path>
</svg>
</i>
<span>Sign up</span>
<span>회원 가입</span>
</a>
<a href="#/portal/signin" class="flex items-center gap-1.5 px-2.5 py-1.5 rounded-theme hover:bg-bgr-tone">
<i class="icon icon-login size-5 stroke-2" role="presentation">
@@ -113,7 +113,7 @@
<path d="M11 15l-3 -3"></path>
</svg>
</i>
<span>Sign in</span>
<span>로그인</span>
</a>
{{/if}}
<div class="flex flex-col gap-0.5 items-center justify-between border-t border-brd mt-2 pt-2">