fix(layout): 공개 페이지 2중 패딩 제거

- 레이아웃 그리드의 px만 남기고 메인/섹션의 중복 px를 제거.

Co-authored-by: Cursor <cursoragent@cursor.com>

docs/spec.md

@@ -24,7 +24,7 @@
 | 그리드(모바일 `lg` 미만) | 단일 세로 흐름: **본문 → 오른쪽 사이드** 순. 왼쪽 사이드는 레이아웃 흐름에서 분리된 고정 슬라이드 패널로 표시 |
 | Left Aside | 너비 287px, `sticky top-[57px]`, `h-[calc(100vh-57px)]`와 `max-h` 동일(뷰포트 기준 고정 높이), 내부 상단은 `.site-sidebar-scroll`(스크롤바 숨김), 하단 푸터 `shrink-0`·상단 보더로 스크롤 영역과 구분, 푸터 좌우는 `px-4`~`sm:px-5`로 본문 블록과 유사한 여백 |
 | Left Aside(모바일) | `fixed` 좌측 패널, 열림 시 `translate-x-0`, 닫힘 시 화면 밖으로 이동. 열린 동안 백드롭과 `html.site-mobile-nav-open`으로 문서 스크롤 잠금 |
-| Main | 중앙 열 안에서 `max-width: 720px`·`justify-self: start`, 별도 `overflow-y` 없음. 좌측 메뉴 닫힘 시 `gap` 제거에 맞춰 `padding-right`로 우측만 여백 유지 — 뷰포트와 동일한 문서 스크롤에 포함 |
+| Main | 중앙 열 안에서 `max-width: 720px`·`justify-self: start`, 별도 `overflow-y` 없음. 공개 페이지의 가로 패딩은 레이아웃 그리드(`public-layout__grid`)의 `px-*` 한 번만 사용하고, 본문 섹션의 `px-*`는 두지 않는다. |
 | Right Aside | Left와 동일 패턴(스티키·고정 높이·내부 무스크롤바 스크롤·하단 카피라이트) |
 | Right Aside(모바일) | 본문 아래에 전체 너비로 배치, 상단 보더로 본문과 구분, 좌우 안전 여백(`px-4`) 적용 |
 

docs/update.md

@@ -15,6 +15,11 @@
 - 게시물 상세(`pages/post/[slug].vue`) 섹션 패딩을 내부 래퍼로 이동해 레이아웃 그리드 패딩과 중복되던 2중 패딩을 제거.
 - 댓글 섹션 구분선(`border-y`)은 패딩 없이 전체 폭으로 표시하고, 내용만 내부 래퍼에 패딩을 적용.
 
+## v0.0.69
+
+- 공개 레이아웃(`layouts/default.vue`, `layouts/post.vue`)에서 메뉴 닫힘 시 추가로 주던 메인 우측 패딩을 제거해 가로 패딩이 1회만 적용되도록 정리.
+- 홈/태그 목록/태그 상세 공개 페이지 섹션의 `px-*`를 제거하고 레이아웃 그리드 패딩만 사용하도록 통일해 2중 패딩을 해소.
+
 ## v0.0.65
 
 - 헤더 `/` 단축키·검색 영역 클릭으로 통합 검색 모달(`SiteSearchModal`)을 연다. `INPUT`·`TEXTAREA`·`SELECT`·`contenteditable` 포커스일 때는 `/`를 가로채지 않는다.

layouts/default.vue

@@ -50,7 +50,7 @@ onBeforeUnmount(() => {
     >
       <main
         class="site-main min-w-0 w-full max-w-full overflow-x-hidden lg:col-start-2 lg:row-start-1 lg:max-w-[720px] lg:justify-self-start"
-        :class="[{ 'site-main--menu-closed': !menuOpen }, !menuOpen ? 'lg:pr-4 xl:pr-5' : '']"
+        :class="[{ 'site-main--menu-closed': !menuOpen }]"
       >
         <slot />
       </main>

layouts/post.vue

@@ -50,7 +50,7 @@ onBeforeUnmount(() => {
     >
       <main
         class="site-main min-w-0 w-full max-w-full overflow-x-hidden lg:col-start-2 lg:row-start-1 lg:max-w-[720px] lg:justify-self-start"
-        :class="[{ 'site-main--menu-closed': !menuOpen }, !menuOpen ? 'lg:pr-4 xl:pr-5' : '']"
+        :class="[{ 'site-main--menu-closed': !menuOpen }]"
       >
         <slot />
       </main>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sori.studio",
-  "version": "0.0.68",
+  "version": "0.0.69",
   "private": true,
   "type": "module",
   "imports": {

pages/index.vue

@@ -204,7 +204,7 @@ const scrollFeatured = (direction) => {
 
 <template>
   <MainColumn>
-    <section class="px-5 py-6 sm:px-6 md:py-8">
+    <section class="py-6 md:py-8">
       <div class="mx-auto flex max-w-[720px] flex-col-reverse gap-6">
         <div class="z-[2] flex flex-col items-center justify-center gap-2 text-center">
           <h1 class="text-xl font-semibold leading-[1.125] md:text-2xl">
@@ -226,7 +226,7 @@ const scrollFeatured = (direction) => {
       </div>
     </section>
 
-    <section class="px-5 py-4 sm:px-6">
+    <section class="py-4">
       <div class="mx-auto max-w-[720px]">
         <div class="flex items-end justify-between gap-2 border-b border-[var(--site-line)] pb-2">
           <h2 class="text-sm font-medium uppercase site-muted">Featured</h2>
@@ -281,7 +281,7 @@ const scrollFeatured = (direction) => {
       </div>
     </section>
 
-    <section class="px-5 py-4 sm:px-6">
+    <section class="py-4">
       <div class="mx-auto max-w-[720px]">
         <div class="flex items-end justify-between gap-2 border-b border-[var(--site-line)] pb-2">
           <h2 class="text-sm font-medium uppercase site-muted">Latest</h2>

pages/tag/[slug].vue

@@ -29,7 +29,7 @@ const tagPosts = computed(() => posts.value
 
 <template>
   <MainColumn>
-    <section class="px-5 pt-4 sm:px-6 sm:pt-5">
+    <section class="pt-4 sm:pt-5">
       <div class="mx-auto flex max-w-[720px] flex-col gap-4 border-b border-[var(--site-line)] pb-4 sm:pb-5">
         <div class="flex flex-col gap-1">
           <h1 class="text-lg font-medium leading-tight sm:text-xl">
@@ -42,7 +42,7 @@ const tagPosts = computed(() => posts.value
       </div>
     </section>
 
-    <section class="px-5 sm:px-6">
+    <section>
       <div class="mx-auto flex max-w-[720px] flex-col gap-8">
         <div class="flex flex-col divide-y divide-[var(--site-line)]" data-post-feed="latest">
           <article
@@ -127,7 +127,7 @@ const tagPosts = computed(() => posts.value
       </div>
     </section>
 
-    <section v-if="tagPosts.length === 0" class="px-5 py-4 sm:px-6">
+    <section v-if="tagPosts.length === 0" class="py-4">
       <div class="mx-auto max-w-[720px] text-sm site-muted">
         이 태그에 연결된 글이 없습니다.
       </div>

pages/tags/index.vue

@@ -17,7 +17,7 @@ const getPostCount = (slug) => posts.value.filter((post) => post.tags.includes(s
 
 <template>
   <MainColumn>
-    <section class="tags-page-hero px-5 sm:px-6">
+    <section class="tags-page-hero">
       <div class="mx-auto flex max-w-[720px] flex-col gap-6 py-6 text-center md:py-8">
         <div class="mx-auto flex max-w-xl flex-1 flex-col items-center justify-center gap-2">
           <h1 class="text-xl font-semibold leading-[1.125] md:text-2xl lg:text-3xl">
@@ -30,7 +30,7 @@ const getPostCount = (slug) => posts.value.filter((post) => post.tags.includes(s
       </div>
     </section>
 
-    <section class="tags-page-list mb-8 px-5 sm:px-6">
+    <section class="tags-page-list mb-8">
       <ul class="mx-auto grid max-w-[720px] gap-4 sm:gap-5 lg:grid-cols-3">
         <li
           v-for="tag in tags"