Compare commits

...

2 Commits

Author SHA1 Message Date
da35351747 ui: add editor tips panel 2026-04-06 12:41:46 +09:00
305160663d ui: restore rail menu spacing 2026-04-06 12:32:28 +09:00
3 changed files with 45 additions and 0 deletions

View File

@@ -1,5 +1,11 @@
# 의사결정 이력
## 2026-04-06 v1.4.93
- 티어표 편집기의 아이템 풀 아래는 아이템 수가 적을 때 비어 보이기 쉬우므로, 이 공간에는 큰 기능보다 방해되지 않는 작은 작업 팁을 두는 편이 자연스럽다고 정리했다. 특히 우클릭 복제, 미사용 아이템 처리, 브라우저 확대/축소처럼 초반 시행착오를 줄여 주는 내용이 효과적이라고 판단했다.
## 2026-04-06 v1.4.92
- 모바일 왼쪽 레일은 사용자 카드, 검색, 메뉴가 세로로 붙는 구조라 기본 `gap`이 빠지면 브라우저별 렌더링 차이에 따라 훨씬 답답하게 보일 수 있으므로, 이 영역 간격은 명시적으로 주는 편이 안전하다고 정리했다.
## 2026-04-06 v1.4.91
- 관리자 화면 모달이 많아질수록 `Esc` 동작이 일부 모달에서만 먹으면 예측 가능성이 떨어지므로, 열려 있는 공통 모달은 모두 `Esc = 취소` 규칙으로 맞추는 편이 더 자연스럽다고 정리했다.
- 왼쪽 레일 사용자 카드의 두 번째 줄은 로그인된 상태에선 이메일이라 말줄임이 맞지만, 로그인 전/확인 중 메시지는 설명 성격이 강하므로 같은 `nowrap` 규칙을 쓰면 가로 스크롤을 유발할 수 있다. 그래서 이메일과 설명 문구의 줄 처리 정책을 분리하는 쪽이 맞다고 판단했다.

View File

@@ -1,5 +1,12 @@
# 업데이트 로그
## 2026-04-06 v1.4.93
- 티어표 편집 화면의 아이템 풀 아래 빈 공간에는 작은 `작업 팁` 안내를 추가했다. 복수 사용, 미사용 아이템 미리보기/저장 제외, 브라우저 확대/축소 활용 같은 자주 묻는 흐름을 바로 확인할 수 있다.
- 확인: `npm run build`
## 2026-04-06 v1.4.92
- 모바일 왼쪽 사이드 메뉴(`leftRail__mobileMenu`)에 `gap`이 빠져 일부 브라우저에서 사용자 카드와 검색창/메뉴가 더 붙어 보일 수 있던 간격을 다시 정리했다.
## 2026-04-06 v1.4.91
- 관리자 화면의 각종 모달은 이제 `Esc` 키를 누르면 현재 열려 있는 모달이 바로 닫히도록 정리했다. 브라우저 기본 동작 대신 공통 `취소` 흐름으로 맞췄다.
- 왼쪽 사이드에서 일부 브라우저 환경에 가로 스크롤이 생기던 문제를 보정했다. 사용자 카드와 검색창에 `min-width: 0`을 더 명확히 주고, 이메일은 계속 말줄임 처리하되 로그인 전 안내 문구처럼 긴 설명은 자연스럽게 줄바꿈되도록 분리했다.

View File

@@ -1746,6 +1746,14 @@ onUnmounted(() => {
<button class="btn btn--ghost btn--small dropzone__button" @click="openFile">파일 선택</button>
</div>
</div>
<div class="editorTips">
<div class="editorTips__title">작업 </div>
<ul class="editorTips__list">
<li>마우스 오른쪽 클릭으로 아이템을 복수 사용하거나 커스텀 이미지를 빠르게 정리할 있어요.</li>
<li>미사용 아이템은 미리보기와 이미지 저장 결과에 표시되지 않으니, 필요한 것만 골라 배치해도 괜찮아요.</li>
<li>아이템이 많아 번에 보기 어렵다면 브라우저 확대/축소(`Ctrl +`, `Ctrl -`) 화면 밀도를 조절해보세요.</li>
</ul>
</div>
</div>
<div class="sidebar">
@@ -3065,6 +3073,30 @@ onUnmounted(() => {
.pool--clickTarget {
cursor: copy;
}
.editorTips {
margin-top: 14px;
padding: 12px 14px;
border-radius: 16px;
border: 1px solid rgba(255, 255, 255, 0.1);
background: color-mix(in srgb, var(--theme-card-bg) 82%, transparent);
}
.editorTips__title {
font-size: 11px;
font-weight: 900;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--theme-text-soft);
}
.editorTips__list {
margin: 8px 0 0;
padding-left: 16px;
color: var(--theme-text-faint);
font-size: 12px;
line-height: 1.55;
}
.editorTips__list li + li {
margin-top: 6px;
}
.poolItem {
position: relative;
min-width: 0;