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

v0.0.56: lg 구간 헤더 간격·검색창 반응형 폭

Browse Source 
약 1024~1280px에서 검색창 고정 폭과 lg:px-0 때문에 헤더 요소가 밀집되던 문제를 패딩·gap·max-w 조정으로 완화하고, 본문 그리드 패딩을 헤더와 맞췄다.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
zenn
2026-05-11 11:42:42 +09:00
parent 94a37f451d
commit e769595c5d
8 changed files with 24 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
layouts/default.vue
View File

@@ -45,7 +45,7 @@ onBeforeUnmount(() => {
/>
</Transition>
<div
class="public-layout__grid mx-auto flex w-full max-w-[1294px] flex-1 flex-col bg-[var(--site-bg)] px-4 lg:grid lg:grid-cols-[287px_minmax(0,720px)_287px] lg:items-start lg:px-0 lg:transition-[grid-template-columns,max-width] lg:duration-300 lg:ease-out"
class="public-layout__grid mx-auto flex w-full max-w-[1294px] flex-1 flex-col bg-[var(--site-bg)] px-4 lg:grid lg:grid-cols-[287px_minmax(0,720px)_287px] lg:items-start lg:px-5 lg:transition-[grid-template-columns,max-width] lg:duration-300 lg:ease-out xl:px-6 2xl:px-0"
:class="menuOpen ? '' : 'lg:max-w-[1007px] lg:[grid-template-columns:0_minmax(0,720px)_287px]'"
>
<main

2
layouts/post.vue
View File

@@ -45,7 +45,7 @@ onBeforeUnmount(() => {
/>
</Transition>
<div
class="post-layout__grid mx-auto flex w-full max-w-[1294px] flex-1 flex-col bg-[var(--site-bg)] px-4 lg:grid lg:grid-cols-[287px_minmax(0,720px)_287px] lg:items-start lg:px-0 lg:transition-[grid-template-columns,max-width] lg:duration-300 lg:ease-out"
class="post-layout__grid mx-auto flex w-full max-w-[1294px] flex-1 flex-col bg-[var(--site-bg)] px-4 lg:grid lg:grid-cols-[287px_minmax(0,720px)_287px] lg:items-start lg:px-5 lg:transition-[grid-template-columns,max-width] lg:duration-300 lg:ease-out xl:px-6 2xl:px-0"
:class="menuOpen ? '' : 'lg:max-w-[1007px] lg:[grid-template-columns:0_minmax(0,720px)_287px]'"
>
<main