Compare commits

...

2 Commits

5 changed files with 93 additions and 7 deletions

View File

@@ -1,5 +1,14 @@
# 의사결정 이력
## 2026-04-02 v1.3.75
- 관리자 공용 모달은 기본 카드 여백을 계속 쓰되, 내부에 자체 셸을 가진 대형 상세 모달까지 같은 패딩을 강제로 받으면 오히려 레이아웃이 무너지므로 예외 클래스로 분리하는 편이 맞다고 정리했다.
- 관리자 표기 링크는 텍스트만 두기보다, 추후 주소 변경이 쉬운 한 곳짜리 상수와 새 창 링크로 관리하는 편이 운영 측면에서 더 낫다고 판단했다.
- 왼쪽 사이드 레일 접힘 상태는 요소를 좁히는 것만으로는 높이와 정렬 문제가 계속 남으므로, 메타 텍스트는 실제로 숨기고 아이콘 중심 문법으로 따로 정리하는 편이 맞다고 판단했다.
## 2026-04-02 v1.3.74
- 관리자 공용 게임 선택 모달은 단순 검색만 제공하기보다, 현재 문맥에서 이미 선택 불가능한 대상을 `이미 추가됨`으로 명시하고 막아 주는 편이 운영 실수를 줄이는 데 더 효과적이라고 정리했다.
- 프로젝트 표기는 관리자 헤더 상단보다 사이드바 최하단의 작은 카피라이트 문구로 빼는 편이 정보 밀도를 덜 방해한다고 판단했다.
## 2026-04-02 v1.3.73
- 게임 선택이 여러 관리자 화면에 퍼지기 시작한 시점에서는 일부 화면만 셀렉트나 내부 리스트를 유지하기보다, 공용 검색 모달 하나로 통일하는 편이 장기적으로 더 일관되고 확장에 강하다고 정리했다.
- 검색 입력과 실행 버튼은 세로로 같은 문법으로 쌓기보다, 입력은 입력끼리 실행은 액션으로 읽히게 한 줄 배치로 적당히 구분해주는 편이 운영 화면에서 덜 답답하다고 판단했다.

View File

@@ -1,6 +1,10 @@
# 할 일 및 이슈
## 단기 확인
- 앱 왼쪽 사이드 레일은 접힘 상태 레이아웃을 다시 손봤으므로, 데스크톱에서 접기/펼치기 반복 시 아바타 영역 높이, 아이콘 중앙 정렬, 검색 버튼 간격, 네비게이션 히트 영역이 모두 자연스러운지 한 번 더 QA한다.
- 관리자 우측 사이드바 하단 카피라이트 링크는 새 창 외부 링크로 바꿨으므로, 실제 클릭 시 `zenn.town` 연결과 hover 대비가 자연스러운지 한 번 더 QA한다.
- 관리자 아이템 상세 모달은 공통 패딩 예외 처리를 다시 넣었으므로, 대형 상세 모달과 일반 게임 선택 모달이 각각 기대한 크기로 보이는지 한 번 더 QA한다.
- 아이템 관리 모달의 공용 게임 선택기에서는 이미 연결된 게임이 비활성화되므로, 실제 운영 데이터에서 중복 연결 방지와 `이미 추가됨` 표시가 기대대로 읽히는지 한 번 더 QA한다.
- 공용 게임 선택 모달을 아이템 관리 모달에도 붙였으므로, 관리자 `게임 관리 / 전체 티어표 관리 / 아이템 관리` 세 흐름에서 같은 검색/선택 UX가 자연스럽게 느껴지는지 한 번 더 QA한다.
- 관리자 `/admin/games?gameId=...` 직접 진입과 새로고침에서 선택 게임이 정상 복원되고 콘솔 오류가 없는지 한 번 더 QA한다.
- 공용 `게임 선택` 검색 모달은 새로 붙였으므로, 게임 관리 선택/전체 티어표 관리 필터 양쪽에서 검색어 입력, 선택, 해제, 뒤로가기 흐름을 한 번 더 QA한다.

View File

@@ -1,5 +1,14 @@
# 업데이트 로그
## 2026-04-02 v1.3.75
- 관리자 공용 모달 카드의 기본 `padding: 20px`는 그대로 두되, 아이템 상세처럼 내부 레이아웃이 이미 큰 셸을 가진 모달은 `modalCard--customItem`에서 다시 덮어쓰지 않도록 분리해 상세 모달 크기와 내부 배치가 무너지지 않게 정리함.
- 관리자 우측 사이드바 최하단의 카피라이트 문구는 이제 별도 상수 URL을 참조하는 외부 링크로 바꿔 새 창에서 열리게 했고, 추후 주소를 바꿔야 할 때 한 곳만 수정하면 되도록 정리함.
- 앱 왼쪽 사이드 레일의 접힘 상태는 메타 텍스트를 단순히 투명하게 남겨두는 대신 실제로 숨기고, 아바타/검색/내비 아이콘을 다시 중앙 정렬해 접었을 때 높이가 비정상적으로 늘어나거나 간격이 남아 보이던 레이아웃을 정리함.
## 2026-04-02 v1.3.74
- 아이템 관리 상세에서 템플릿 추가 대상 게임을 고를 때, 이미 해당 이미지가 연결된 게임은 공용 게임 선택 모달에서 `이미 추가됨`으로 표시하고 비활성화해 중복 추가 실수를 미리 막도록 정리함.
- 관리자 우측 사이드바 최하단에는 작은 카피라이트 문구를 추가해, 헤더에 관리 정보만 남기고 프로젝트 표기는 하단에서 조용히 보이도록 정리함.
## 2026-04-02 v1.3.73
- 전체 티어표 관리 카드 썸네일은 `draggable="false"`로 바꿔, 미리보기 진입 시 브라우저 기본 이미지 드래그가 클릭을 방해하지 않도록 정리함.
- 관리자 사이드바의 검색 입력과 검색 버튼은 한 줄로 묶어, 입력/선택/실행 버튼이 모두 같은 크기의 세로 스택처럼 보이던 답답함을 조금 줄이고 역할 구분을 더 분명하게 함.

View File

@@ -953,21 +953,22 @@ function submitGlobalSearch() {
}
.appShell--leftCollapsed .appUserCard {
min-height: auto;
margin-bottom: 10px;
}
.appShell--leftCollapsed .appUserCard__button,
.appShell--leftCollapsed .appUserCard__guest {
min-height: 44px;
padding: 0;
gap: 0;
justify-content: center;
}
.appShell--leftCollapsed .appUserCard__meta,
.appShell--leftCollapsed .leftNav__label,
.appShell--leftCollapsed .searchStub__input {
opacity: 0;
max-width: 0;
transform: translateX(-4px);
pointer-events: none;
display: none;
}
.appShell--leftCollapsed .appUserCard__avatar {
@@ -976,11 +977,13 @@ function submitGlobalSearch() {
}
.appShell--leftCollapsed .searchStub {
padding: 11px 0;
gap: 0;
justify-content: center;
}
.appShell--leftCollapsed .searchStub__iconButton {
width: auto;
width: 100%;
}
.appShell--leftCollapsed .leftNav {
@@ -988,14 +991,25 @@ function submitGlobalSearch() {
}
.appShell--leftCollapsed .leftNav__item {
padding: 11px 0;
gap: 0;
justify-content: center;
}
.appShell--leftCollapsed .leftNav__glyph {
width: 28px;
height: 28px;
}
.appShell--leftCollapsed .leftRail__bottom {
display: none;
}
.appShell--leftCollapsed .leftRail__content {
display: grid;
align-content: start;
justify-items: stretch;
gap: 12px;
overflow: hidden;
}

View File

@@ -26,6 +26,7 @@ const router = useRouter()
const globalRightRailOpen = inject('rightRailOpen', ref(true))
const localRightRailTarget = inject('localRightRailTarget', '#local-right-rail-root')
const isAdmin = computed(() => !!auth.user?.isAdmin)
const ADMIN_COPYRIGHT_URL = 'https://zenn.town/@murabito'
const activeTab = ref('featured')
const tierlistsMode = ref('requests')
@@ -620,6 +621,7 @@ const imageDiagnosticsCards = computed(() => {
const visibleLinkedGames = computed(() =>
(modalTargetCustomItem.value?.linkedGames || []).filter((game) => game?.id && game.id !== 'freeform')
)
const linkedCustomItemGameIds = computed(() => new Set(visibleLinkedGames.value.map((game) => game.id).filter(Boolean)))
const imageStatsPeriodLabel = computed(() => (imageStatsMonth.value ? `${imageStatsMonth.value} 기준` : '전체 기간'))
const imageStatsYearOptions = computed(() => {
@@ -1309,6 +1311,7 @@ async function chooseGameFromPicker(gameId) {
return
}
if (gamePickerMode.value === 'custom-item-target') {
if (linkedCustomItemGameIds.value.has(gameId)) return
customItemModalTargetGameId.value = gameId
closeGamePickerModal()
return
@@ -2035,12 +2038,21 @@ function userAvatarFallback(user) {
v-for="game in filteredGamePickerGames"
:key="game.id"
class="adminGamePicker__item"
:class="{ 'adminGamePicker__item--active': gamePickerMode === 'tierlists-filter' ? adminTierListGameId === game.id : selectedGameId === game.id }"
:class="{
'adminGamePicker__item--active': gamePickerMode === 'tierlists-filter'
? adminTierListGameId === game.id
: gamePickerMode === 'custom-item-target'
? customItemModalTargetGameId === game.id
: selectedGameId === game.id,
'adminGamePicker__item--disabled': gamePickerMode === 'custom-item-target' && linkedCustomItemGameIds.has(game.id),
}"
type="button"
:disabled="gamePickerMode === 'custom-item-target' && linkedCustomItemGameIds.has(game.id)"
@click="chooseGameFromPicker(game.id)"
>
<span class="adminGamePicker__name">{{ game.name }}</span>
<span class="adminGamePicker__meta">{{ game.id }}</span>
<span v-if="gamePickerMode === 'custom-item-target' && linkedCustomItemGameIds.has(game.id)" class="adminGamePicker__state">이미 추가됨</span>
</button>
<div v-if="!filteredGamePickerGames.length" class="hint hint--tight">검색 결과가 없어요.</div>
</div>
@@ -2378,6 +2390,11 @@ function userAvatarFallback(user) {
</div>
</section>
</aside>
<div v-show="globalRightRailOpen" class="adminSidebarFooter adminUiScope">
<span>Copyright © 2026 </span>
<a :href="ADMIN_COPYRIGHT_URL" target="_blank" rel="noreferrer">zenn</a>
<span>. All rights reserved.</span>
</div>
</Teleport>
</template>
@@ -2456,6 +2473,23 @@ function userAvatarFallback(user) {
display: grid;
gap: 12px;
}
.adminUiScope.adminSidebarFooter {
margin-top: 6px;
padding: 0 4px 2px;
font-size: 9px;
line-height: 1.4;
text-align: center;
color: var(--theme-text-faint);
opacity: 0.72;
}
.adminUiScope.adminSidebarFooter a {
color: #00ffff;
text-decoration: none;
}
.adminUiScope.adminSidebarFooter a:hover {
color: #00ffff;
text-decoration: underline;
}
.adminUiScope .adminSidebar__panel {
display: grid;
gap: 12px;
@@ -2572,6 +2606,11 @@ function userAvatarFallback(user) {
border-color: rgba(77, 127, 233, 0.58);
background: rgba(77, 127, 233, 0.12);
}
.adminUiScope .adminGamePicker__item--disabled {
cursor: not-allowed;
opacity: 0.58;
border-style: dashed;
}
.adminUiScope .adminGamePicker__name {
font-size: 13px;
font-weight: 800;
@@ -2583,6 +2622,11 @@ function userAvatarFallback(user) {
overflow: hidden;
text-overflow: ellipsis;
}
.adminUiScope .adminGamePicker__state {
margin-top: 4px;
font-size: 11px;
color: var(--theme-text-faint);
}
.adminUiScope .gamePickerModalList {
margin-top: 14px;
display: grid;
@@ -4270,11 +4314,17 @@ function userAvatarFallback(user) {
width: min(560px, 100%);
display: grid;
gap: 14px;
padding: 20px;
border-radius: 24px;
border: 1px solid rgba(255, 255, 255, 0.12);
background: color-mix(in srgb, var(--theme-main-bg) 96%, transparent);
}
.adminUiScope .modalCard:not(.modalCard--customItem) {
padding: 20px;
}
.adminUiScope .modalCard.modalCard--customItem {
gap: 0;
padding: 0;
}
.adminUiScope .modalCard--preview {
width: min(1200px, 100%);
max-height: calc(100dvh - 40px);