릴리스: v1.3.76 왼쪽 레일 검색/축소 정리

docs/history.md

@@ -1,5 +1,9 @@
 # 의사결정 이력
 
+## 2026-04-02 v1.3.76
+- 왼쪽 사이드 레일을 접었을 때는 텍스트가 사라진 뒤에도 행 높이가 제각각이면 아이콘 전용 탐색기로 읽히지 않으므로, 아바타/검색/내비 항목의 높이를 같은 규격으로 통일하는 편이 맞다고 정리했다.
+- 왼쪽 레일 검색은 화면에 따라 티어표 검색으로 바뀌면 사용자가 사이드 검색과 메인 검색 역할을 구분하기 어려우므로, 사이드는 게임 검색으로 고정하고 티어표 검색은 메인 화면 문맥에 맡기는 편이 더 자연스럽다고 판단했다.
+
 ## 2026-04-02 v1.3.75
 - 관리자 공용 모달은 기본 카드 여백을 계속 쓰되, 내부에 자체 셸을 가진 대형 상세 모달까지 같은 패딩을 강제로 받으면 오히려 레이아웃이 무너지므로 예외 클래스로 분리하는 편이 맞다고 정리했다.
 - 관리자 표기 링크는 텍스트만 두기보다, 추후 주소 변경이 쉬운 한 곳짜리 상수와 새 창 링크로 관리하는 편이 운영 측면에서 더 낫다고 판단했다.

docs/todo.md

@@ -1,6 +1,8 @@
 # 할 일 및 이슈
 
 ## 단기 확인
+- 왼쪽 레일 축소 상태는 아이콘 줄 높이를 50px 기준으로 통일했으므로, 실제 데스크톱에서 아바타/검색/메뉴 아이콘이 시각적으로 같은 리듬으로 보이는지 한 번 더 QA한다.
+- 왼쪽 레일 검색은 이제 항상 게임 검색으로 홈으로 이동하므로, 홈이 아닌 화면에서 사이드 검색 후 게임 목록 결과로 자연스럽게 이동하는지 한 번 더 QA한다.
 - 앱 왼쪽 사이드 레일은 접힘 상태 레이아웃을 다시 손봤으므로, 데스크톱에서 접기/펼치기 반복 시 아바타 영역 높이, 아이콘 중앙 정렬, 검색 버튼 간격, 네비게이션 히트 영역이 모두 자연스러운지 한 번 더 QA한다.
 - 관리자 우측 사이드바 하단 카피라이트 링크는 새 창 외부 링크로 바꿨으므로, 실제 클릭 시 `zenn.town` 연결과 hover 대비가 자연스러운지 한 번 더 QA한다.
 - 관리자 아이템 상세 모달은 공통 패딩 예외 처리를 다시 넣었으므로, 대형 상세 모달과 일반 게임 선택 모달이 각각 기대한 크기로 보이는지 한 번 더 QA한다.
@@ -40,16 +42,10 @@
 - production에서 SESSION_SECRET 누락 시 서버가 부팅되지 않도록 강제한다.
 - helmet 기반 보안 헤더와 업로드 정적 응답 헤더를 정리한다.
 - 책 아이콘 기반 사용법 모달은 제작 흐름뿐 아니라 복사, 템플릿 업데이트 요청, 새 템플릿 요청까지 확장했으므로, 실제 16:9 스크린샷 자산과 단계별 문구를 운영 톤에 맞게 채운다.
-
 - 관리자 아이템 라이브러리에서 동일 이미지(src)를 여러 템플릿이 공유하는 경우, 필요하면 묶어서 보거나 대표 카드로 합쳐 보는 후속 정리 옵션을 검토한다.
-
 - 라이트모드 최종 QA 시 홈/설정/관리자/에디터를 실제 사용 흐름으로 돌리며, 남아 있는 하드코딩 텍스트 색과 플레이스홀더 배경을 한 번 더 점검한다.
-
 - 관리자 아이템 라이브러리는 보관 자산까지 노출되므로, 이후에는 `활성 템플릿 / 보관 자산` 분리 필터나 그룹 보기까지 검토한다.
-
 - 가이드 모달과 관리자 아이템 모달은 현재 같은 톤의 큰 셸을 쓰므로, 이후 공통 모달 레이아웃 컴포넌트로 분리할지 검토한다.
-
 - 관리자 아이템 라이브러리 이름 변경은 템플릿·사용자 업로드·보관 자산까지 모두 가능하므로, 이후에는 일괄 이름 정리나 중복 이름 감지 보조 기능까지 검토한다.
 - 관리자 템플릿 요청 카드와 전체 티어표 카드가 같은 문법으로 맞춰졌으므로, 이후에는 라이트모드까지 포함해 두 카드의 썸네일 높이·입력창 밀도·아이템 그리드를 한 번 더 비교 QA한다.
-
 - 템플릿 요청 저장 흐름은 저장된 티어표 기준으로 바뀌었으므로, 이후 실제 데이터로 빈 제목 저장 시 자동 생성 제목·요청 버튼 노출 시점·관리자 요청 미리보기 밀도를 한 번 더 비교 QA한다.

docs/update.md

@@ -1,5 +1,9 @@
 # 업데이트 로그
 
+## 2026-04-02 v1.3.76
+- 앱 왼쪽 사이드 레일은 축소 상태에서 아바타, 검색 버튼, 네비게이션 아이콘 버튼 높이를 모두 50px 기준으로 맞추고 검색 아래 여백도 정리해, 아이콘만 보이는 상태에서도 각 줄 높이가 제각각처럼 보이지 않게 정리함.
+- 왼쪽 사이드 검색은 라우트에 따라 의미가 바뀌지 않도록 `게임 템플릿 검색`으로 고정하고, 축소 검색 모달 역시 같은 플레이스홀더와 같은 동작으로 홈 게임 목록 검색을 수행하도록 통일함.
+
 ## 2026-04-02 v1.3.75
 - 관리자 공용 모달 카드의 기본 `padding: 20px`는 그대로 두되, 아이템 상세처럼 내부 레이아웃이 이미 큰 셸을 가진 모달은 `modalCard--customItem`에서 다시 덮어쓰지 않도록 분리해 상세 모달 크기와 내부 배치가 무너지지 않게 정리함.
 - 관리자 우측 사이드바 최하단의 카피라이트 문구는 이제 별도 상수 URL을 참조하는 외부 링크로 바꿔 새 창에서 열리게 했고, 추후 주소를 바꿔야 할 때 한 곳만 수정하면 되도록 정리함.

frontend/src/App.vue

@@ -23,7 +23,7 @@ const { toasts, dismissToast } = useToast()
 const leftRailCollapsed = ref(false)
 const rightRailOpen = ref(true)
 const searchQuery = ref('')
-const searchPlaceholder = computed(() => (route.name === 'home' ? '게임 템플릿 검색' : '전체 티어표 검색'))
+const leftRailSearchPlaceholder = '게임 템플릿 검색'
 const isCollapsedSearchOpen = ref(false)
 const isGuideModalOpen = ref(false)
 const themeMode = ref('dark')
@@ -391,11 +391,7 @@ function handleLeftRailSearch() {
 function submitGlobalSearch() {
   const query = (searchQuery.value || '').trim()
   isCollapsedSearchOpen.value = false
-  if (route.name === 'home') {
+  router.push(query ? `/?q=${encodeURIComponent(query)}` : '/')
-    router.push(query ? `/?q=${encodeURIComponent(query)}` : '/')
-    return
-  }
-  router.push(query ? `/search?q=${encodeURIComponent(query)}` : '/search')
 }
 
 
@@ -444,7 +440,7 @@ function submitGlobalSearch() {
               <SvgIcon :src="iconSearch" :size="24" />
             </span>
           </button>
-          <input v-model="searchQuery" class="searchStub__input" type="search" :placeholder="leftRailCollapsed ? '' : searchPlaceholder" />
+          <input v-model="searchQuery" class="searchStub__input" type="search" :placeholder="leftRailCollapsed ? '' : leftRailSearchPlaceholder" />
         </form>
 
         <nav class="leftNav">
@@ -513,12 +509,12 @@ function submitGlobalSearch() {
         </section>
       </main>
 
-      <div v-if="isCollapsedSearchOpen" class="collapsedSearchModal" role="dialog" aria-modal="true" :aria-label="searchPlaceholder" @click.self="closeCollapsedSearch">
+      <div v-if="isCollapsedSearchOpen" class="collapsedSearchModal" role="dialog" aria-modal="true" :aria-label="leftRailSearchPlaceholder" @click.self="closeCollapsedSearch">
         <form class="collapsedSearchBar" @submit.prevent="submitGlobalSearch">
           <span class="collapsedSearchBar__icon">
             <SvgIcon :src="iconSearch" :size="24" />
           </span>
-          <input v-model="searchQuery" class="collapsedSearchBar__input" type="search" :placeholder="searchPlaceholder" autofocus />
+          <input v-model="searchQuery" class="collapsedSearchBar__input" type="search" :placeholder="leftRailSearchPlaceholder" autofocus />
         </form>
       </div>
 
@@ -953,12 +949,14 @@ function submitGlobalSearch() {
 }
 
 .appShell--leftCollapsed .appUserCard {
-  min-height: auto;
+  min-height: 50px;
-  margin-bottom: 10px;
+  margin-bottom: 0;
 }
 
 .appShell--leftCollapsed .appUserCard__button,
 .appShell--leftCollapsed .appUserCard__guest {
+  width: 100%;
+  height: 50px;
   min-height: 44px;
   padding: 0;
   gap: 0;
@@ -977,6 +975,8 @@ function submitGlobalSearch() {
 }
 
 .appShell--leftCollapsed .searchStub {
+  height: 50px;
+  margin-bottom: 0;
   padding: 11px 0;
   gap: 0;
   justify-content: center;
@@ -984,6 +984,7 @@ function submitGlobalSearch() {
 
 .appShell--leftCollapsed .searchStub__iconButton {
   width: 100%;
+  height: 100%;
 }
 
 .appShell--leftCollapsed .leftNav {
@@ -991,6 +992,9 @@ function submitGlobalSearch() {
 }
 
 .appShell--leftCollapsed .leftNav__item {
+  width: 100%;
+  min-height: 50px;
+  height: 50px;
   padding: 11px 0;
   gap: 0;
   justify-content: center;
@@ -1009,7 +1013,7 @@ function submitGlobalSearch() {
   display: grid;
   align-content: start;
   justify-items: stretch;
-  gap: 12px;
+  gap: 10px;
   overflow: hidden;
 }