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

릴리스: v1.2.14 에디터 우측 패널 셸 컬럼 이관

Browse Source
This commit is contained in:
zenn
2026-03-30 16:58:38 +09:00
parent 69a8cd3600
commit 5d7797925e
6 changed files with 65 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
frontend/src/App.vue
View File

@@ -17,10 +17,12 @@ const { toasts, dismissToast } = useToast()
const menuOpen = ref(false)
const rightRailOpen = ref(true)
provide('rightRailOpen', rightRailOpen)
provide('localRightRailTarget', '#local-right-rail-root')
const isAdmin = computed(() => !!auth.user?.isAdmin)
const isPreviewMode = computed(() => route.query.preview === '1')
const usesLocalRightRail = computed(() => ['editEditor', 'newEditor', 'admin'].includes(String(route.name || '')))
const usesShellRightRail = computed(() => ['editEditor', 'newEditor'].includes(String(route.name || '')))
const avatarUrl = computed(() => (auth.user?.avatarSrc ? toApiUrl(auth.user.avatarSrc) : ''))
const accountName = computed(() => {
const nickname = (auth.user?.nickname || '').trim()
@@ -293,46 +295,51 @@ async function logout() {
</main>
<aside
v-if="!usesLocalRightRail"
v-if="!usesLocalRightRail || usesShellRightRail"
class="rightRail"
:class="{ 'rightRail--closed': !rightRailOpen }"
:aria-hidden="!rightRailOpen"
>
<div class="rightRail__top">
<button class="ghostIcon ghostIcon--iconOnly" type="button" aria-label="상태">
<img :src="iconGridView" alt="" />
</button>
</div>
<section class="contextCard">
<div class="contextCard__label">Context</div>
<h2 class="contextCard__title">{{ routeMeta.contextTitle }}</h2>
<p class="contextCard__text">{{ routeMeta.contextText }}</p>
<button class="contextCard__action" type="button" @click="routeMeta.action">
{{ routeMeta.actionLabel }}
</button>
</section>
<section class="contextCard">
<div class="contextCard__label">Account</div>
<div class="contextStat">
<span class="contextStat__name">현재 사용자</span>
<span class="contextStat__value">{{ accountName }}</span>
<template v-if="usesShellRightRail">
<div id="local-right-rail-root" class="localRightRailRoot"></div>
</template>
<template v-else>
<div class="rightRail__top">
<button class="ghostIcon ghostIcon--iconOnly" type="button" aria-label="상태">
<img :src="iconGridView" alt="" />
</button>
</div>
<div class="contextStat">
<span class="contextStat__name">권한</span>
<span class="contextStat__value">{{ isAdmin ? 'Admin' : auth.user ? 'Member' : 'Guest' }}</span>
</div>
</section>
<section class="contextCard contextCard--links">
<div class="contextCard__label">Jump</div>
<button class="contextLink" type="button" @click="$router.push('/')">
<svg viewBox="0 0 24 24" aria-hidden="true"><path :d="railGlyph('link')" /></svg>
<span>게임 목록으로</span>
</button>
<button v-if="auth.user" class="contextLink" type="button" @click="$router.push('/me')">
<svg viewBox="0 0 24 24" aria-hidden="true"><path :d="railGlyph('link')" /></svg>
<span>내 티어표 열기</span>
</button>
</section>
<section class="contextCard">
<div class="contextCard__label">Context</div>
<h2 class="contextCard__title">{{ routeMeta.contextTitle }}</h2>
<p class="contextCard__text">{{ routeMeta.contextText }}</p>
<button class="contextCard__action" type="button" @click="routeMeta.action">
{{ routeMeta.actionLabel }}
</button>
</section>
<section class="contextCard">
<div class="contextCard__label">Account</div>
<div class="contextStat">
<span class="contextStat__name">현재 사용자</span>
<span class="contextStat__value">{{ accountName }}</span>
</div>
<div class="contextStat">
<span class="contextStat__name">권한</span>
<span class="contextStat__value">{{ isAdmin ? 'Admin' : auth.user ? 'Member' : 'Guest' }}</span>
</div>
</section>
<section class="contextCard contextCard--links">
<div class="contextCard__label">Jump</div>
<button class="contextLink" type="button" @click="$router.push('/')">
<svg viewBox="0 0 24 24" aria-hidden="true"><path :d="railGlyph('link')" /></svg>
<span>게임 목록으로</span>
</button>
<button v-if="auth.user" class="contextLink" type="button" @click="$router.push('/me')">
<svg viewBox="0 0 24 24" aria-hidden="true"><path :d="railGlyph('link')" /></svg>
<span>내 티어표 열기</span>
</button>
</section>
</template>
</aside>
</template>
@@ -743,6 +750,10 @@ async function logout() {
gap: 18px;
}
.localRightRailRoot {
min-height: calc(100vh - 40px);
}
.contextCard {
display: grid;
gap: 12px;