From 9403e3698dbdc8b9c624c27d9e1cafd16220bea9 Mon Sep 17 00:00:00 2001 From: zenn Date: Fri, 3 Apr 2026 17:54:37 +0900 Subject: [PATCH] =?UTF-8?q?=EC=A1=B0=EC=A0=95:=20=EB=AA=A8=EB=B0=94?= =?UTF-8?q?=EC=9D=BC=20=EB=A0=88=EC=9D=BC=20=ED=97=A4=EB=8D=94=20=EC=97=AC?= =?UTF-8?q?=EB=B0=B1=EA=B3=BC=20=ED=86=A0=EA=B8=80=20=EB=B2=84=ED=8A=BC=20?= =?UTF-8?q?=EC=8A=A4=ED=83=80=EC=9D=BC=20=ED=86=B5=EC=9D=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/history.md | 4 ++++ docs/update.md | 5 +++++ frontend/src/App.vue | 15 +++++++++++++++ 3 files changed, 24 insertions(+) diff --git a/docs/history.md b/docs/history.md index 3de9509..85acec1 100644 --- a/docs/history.md +++ b/docs/history.md @@ -1,5 +1,9 @@ # 의사결정 이력 +## 2026-04-03 v1.4.72 +- 모바일 상단 레일은 왼쪽 유저 카드 영역과 오른쪽 패널 토글 버튼이 같은 시각적 간격 체계를 가져야 전체 셸이 덜 비뚤어져 보이므로, 모바일에서만 `railHeader` 좌우 패딩을 본문 카드 여백보다 조금 넓은 `20px`로 맞추는 편이 낫다고 판단했다. +- 오른쪽 레일 토글 아이콘이 모바일에서 테두리 없는 아이콘만 보이면 왼쪽 네비 토글 버튼과 컴포넌트 문법이 달라 보이므로, 모바일 한정으로 같은 버튼형 배경/테두리/라운드를 적용해 조작 가능한 컨트롤처럼 통일하는 쪽으로 정리했다. + ## 2026-04-03 v1.4.71 - 모바일에서 공통 본문 하단이 딱 붙어 보이는 문제는 로그인 화면 하나만 고치는 것보다 `workspaceBody` 공통 하단 여백을 safe-area까지 포함해 보강하는 편이 이후 모든 본문 화면에 일괄 적용되어 유지보수상 낫다고 판단했다. - 모바일 왼쪽 네비게이션은 데스크톱의 폭 축소형 접기와 목적이 다르므로, 기존 `leftRailCollapsed`를 억지로 재사용하기보다 `mobileLeftNavOpen` 상태를 분리하고 유저 카드 우측 버튼으로 검색/메뉴 묶음만 접는 방식이 더 자연스럽다고 정리했다. diff --git a/docs/update.md b/docs/update.md index ba3996d..1ecc724 100644 --- a/docs/update.md +++ b/docs/update.md @@ -1,5 +1,10 @@ # 업데이트 로그 +## 2026-04-03 v1.4.72 +- 모바일 공통 상단 헤더(`railHeader`) 좌우 패딩을 `20px`로 넓혀, 오른쪽 레일 토글 버튼과 화면 가장자리 간격이 왼쪽 유저 카드 쪽과 더 자연스럽게 맞도록 조정했다. +- 모바일에서 오른쪽 레일 열기/닫기 아이콘도 왼쪽 네비게이션 토글과 같은 버튼형 카드 스타일로 보이도록 `42px` 크기, 테두리, 배경, 둥근 모서리를 맞췄다. +- 프런트 프로덕션 빌드(`npm run build`) 통과를 확인했다. + ## 2026-04-03 v1.4.71 - 모바일에서 본문 페이지나 로그인 화면 하단이 카드/버튼 바로 아래에서 끊겨 보여 답답했던 부분을 줄이기 위해, 공통 워크스페이스 본문 하단에 모바일 safe-area 기반 여백을 추가했다. - 모바일 왼쪽 네비게이션은 유저 프로필 카드 오른쪽 토글 버튼으로 접고 펼칠 수 있게 바꾸고, 닫힘/열림 전환 시 검색창과 메뉴가 위아래로 부드럽게 스르륵 접히는 애니메이션을 추가했다. diff --git a/frontend/src/App.vue b/frontend/src/App.vue index 11fe690..039a31b 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -2034,6 +2034,10 @@ function reloadApp() { min-height: 100dvh; } + .railHeader { + padding: 0 20px; + } + .leftRail { min-height: auto; height: auto; @@ -2066,6 +2070,17 @@ function reloadApp() { display: inline-flex; } + .workspaceHead .ghostIcon--iconOnly, + .rightRail__top .ghostIcon--iconOnly { + width: 42px; + height: 42px; + min-width: 42px; + border: 1px solid var(--theme-border); + border-radius: 14px; + background: var(--theme-surface-soft); + color: var(--theme-text-soft); + } + .appMain { min-height: auto; border-left: 0;