zenn/tier-maker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

릴리스: v1.2.70 관리자 게임 관리 레이아웃 정리

Browse Source
This commit is contained in:
zenn
2026-03-31 16:35:43 +09:00
parent 3227181c24
commit 6dce53db7a
2 changed files with 22 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
frontend/src/views/AdminView.vue
View File

@@ -1243,22 +1243,6 @@ async function saveFeaturedOrder() {
</template>
<template v-else-if="activeTab === 'game-admin'">
<div class="panel">
<div class="sectionHeader">
<div>
<div class="panel__title">게임 관리</div>
<div class="hint hint--tight">등록된 게임을 선택하면 아래에서 썸네일과 기본 아이템을 바로 수정할 수 있어요.</div>
</div>
<button class="btn btn--primary" @click="openGameCreateModal">새 게임 생성</button>
</div>
<div class="gameManagerGrid gameManagerGrid--single">
<section class="adminCard adminCard--muted">
<div class="section__title">아이템 관리 안내</div>
<div class="hint hint--tight">게임 선택과 썸네일 지정은 오른쪽 사이드에서 진행하고, 이 본문에서는 기본 아이템 추가와 현재 아이템 관리만 담당합니다.</div>
</section>
</div>
</div>
<div v-if="isGameLoading" class="panel panel--empty">
<div class="emptyState">
@@ -1344,10 +1328,7 @@ async function saveFeaturedOrder() {
</div>
<div v-else class="panel panel--empty">
<div class="emptyState">
<div class="emptyState__title">게임을 선택하면 상세 관리가 열려요.</div>
<div class="emptyState__desc">
위에서 기존 게임을 선택하거나 새 게임을 만든 뒤, 같은 화면에서 바로 썸네일과 기본 아이템을 정리할 수 있어요.
</div>
<div class="emptyState__title">게임을 선택해 주세요.</div>
<div v-if="selectedGameId" class="hint hint--tight">선택한 게임을 찾지 못했거나 로딩 중 오류가 발생했어요. 다시 선택해보세요.</div>
</div>
</div>
@@ -1750,11 +1731,11 @@ async function saveFeaturedOrder() {
<section v-if="activeTab === 'game-admin'" class="adminSidebar__panel">
<div class="adminSidebar__label">Game</div>
<div class="adminSidebar__group">
<button class="btn btn--primary" @click="openGameCreateModal">새 게임 생성</button>
<select :value="selectedGameId" class="select" @change="handleSelectedGameChange">
<option value="">게임을 선택해주세요</option>
<option v-for="game in games" :key="game.id" :value="game.id">{{ game.name }} ({{ game.id }})</option>
</select>
<div class="hint hint--tight">선택한 게임의 썸네일과 기본 아이템 관리가 본문과 연동됩니다.</div>
<div v-if="selectedGameId && !hasSelectedGame && !isGameLoading" class="hint hint--tight">선택된 게임 ID: {{ selectedGameId }}</div>
</div>
<div v-if="hasSelectedGame" class="adminSidebar__group">
@@ -1774,7 +1755,7 @@ async function saveFeaturedOrder() {
<img v-if="displayThumbnailUrl" class="selectedThumb selectedThumb--sidebar" :src="displayThumbnailUrl" :alt="selectedGame.game.name" />
<div v-else class="selectedThumb selectedThumb--empty selectedThumb--sidebar">대표 썸네일</div>
<div class="thumbDropZone__copy">
<div class="thumbDropZone__title">클릭하거나 드래그해서 썸네일 추가</div>
<div class="thumbDropZone__title">클릭 or 드래그</div>
</div>
</button>
<div class="adminSidebar__actions adminSidebar__actions--stack">
@@ -2398,33 +2379,35 @@ async function saveFeaturedOrder() {
word-break: break-all;
}
.thumbDropZone {
position: relative;
width: 100%;
display: grid;
gap: 14px;
justify-items: start;
padding: 16px;
display: block;
padding: 0;
overflow: hidden;
border-radius: 18px;
border: 1px dashed rgba(255, 255, 255, 0.18);
border: 1px solid rgba(255, 255, 255, 0.12);
background: rgba(255, 255, 255, 0.03);
text-align: left;
transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease;
transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}
.thumbDropZone--active {
border-color: rgba(96, 165, 250, 0.56);
background: rgba(96, 165, 250, 0.08);
box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.18);
transform: translateY(-1px);
}
.thumbDropZone__copy {
position: absolute;
inset: auto 0 0 0;
display: grid;
gap: 6px;
place-items: center;
min-height: 52px;
padding: 12px 16px;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(6, 9, 16, 0.86) 46%, rgba(6, 9, 16, 0.94) 100%);
}
.thumbDropZone__title {
font-weight: 900;
}
.thumbDropZone__desc {
color: rgba(255, 255, 255, 0.68);
font-size: 13px;
line-height: 1.5;
letter-spacing: 0.01em;
}
.itemComposer {
margin-top: 10px;