fix: remove duplicate close button from StoryGallery header, left-align title

This commit is contained in:
2026-06-12 11:51:05 +08:00
parent d680da11c8
commit 8fc4199354

View File

@@ -198,7 +198,6 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))
<div class="story-header">
<button class="back-btn" @click="emit('close')"> {{ t('ui.back') }}</button>
<h2 class="story-title">{{ ch ? t(ch.labelKey || ch.label) : t('ui.story') }}</h2>
<button class="icon-btn" @click="emit('close')" title="关闭"></button>
</div>
<div class="story-body">
@@ -310,142 +309,11 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))
}
.story-title {
flex: 1;
text-align: center;
font-size: 18px;
font-weight: 500;
color: #c9a84c;
letter-spacing: 4px;
}
.icon-btn {
width: 32px;
height: 32px;
font-size: 14px;
color: #666;
background: none;
border: 1px solid rgba(255,255,255,0.08);
border-radius: 4px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.15s;
}
.icon-btn:hover {
color: #ccc;
border-color: rgba(255,255,255,0.2);
}
.story-body {
flex: 1;
min-height: 0;
position: relative;
overflow: hidden;
}
.story-body :deep(.tree-flow) {
width: 100%;
height: 100%;
max-height: none;
}
.story-empty {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
color: #444;
font-size: 14px;
}
.story-footer {
display: flex;
align-items: center;
padding: 12px 20px;
flex-shrink: 0;
background: rgba(0,0,0,0.5);
border-top: 1px solid rgba(255,255,255,0.05);
}
.footer-left {
flex: 1;
display: flex;
align-items: center;
gap: 16px;
}
.footer-stat {
display: flex;
align-items: baseline;
gap: 4px;
}
.stat-value {
font-size: 18px;
font-weight: 600;
color: #c9a84c;
}
.stat-unit {
font-size: 12px;
color: #666;
}
.footer-endings {
display: flex;
gap: 6px;
}
.ending-chip {
padding: 3px 10px;
font-size: 11px;
color: #555;
background: rgba(255,255,255,0.03);
border: 1px solid rgba(255,255,255,0.06);
border-radius: 12px;
}
.ending-chip.unlocked {
color: #c9a84c;
border-color: rgba(201,168,76,0.25);
background: rgba(201,168,76,0.06);
}
.chapter-btn {
padding: 8px 20px;
font-size: 13px;
color: #888;
background: rgba(255,255,255,0.04);
border: 1px solid rgba(255,255,255,0.1);
border-radius: 4px;
cursor: pointer;
transition: all 0.15s;
}
.chapter-btn:hover {
color: #ccc;
background: rgba(255,255,255,0.08);
}
.chapter-picker {
position: fixed;
inset: 0;
background: rgba(0,0,0,0.9);
display: flex;
align-items: center;
justify-content: center;
z-index: 300;
}
.picker-panel {
background: #12121a;
border: 1px solid rgba(255,255,255,0.08);
border-radius: 12px;
padding: 32px 36px;
max-width: 700px;
width: 90%;
margin-left: 16px;
}
.picker-title {