diff --git a/src/components/StoryGallery.vue b/src/components/StoryGallery.vue index 720dc56..acf46c6 100644 --- a/src/components/StoryGallery.vue +++ b/src/components/StoryGallery.vue @@ -198,7 +198,6 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))

{{ ch ? t(ch.labelKey || ch.label) : t('ui.story') }}

-
@@ -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 {