fix: remove expand/collapse for footer details, always show stats and endings

src/components/StoryGallery.vue

@@ -21,7 +21,6 @@ const emit = defineEmits<{
 }>()
 
 const showChapterPicker = ref(false)
-const showDetails = ref(false)
 
 function isOtherChapterStart(sceneId: string, ownChapterId: string): boolean {
   return props.chapters.some(c => c.id !== ownChapterId && c.startScene === sceneId)
@@ -229,8 +228,7 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))
             </div>
           </div>
 
-          <Transition name="footer-expand">
+          <div class="footer-details">
-            <div class="footer-details" v-if="showDetails">
             <div class="footer-stat">
               <span class="stat-value">{{ progress.count }}</span>
               <span class="stat-unit">/{{ progress.total }} 场景</span>
@@ -244,13 +242,9 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))
               >{{ endingStatus(end.id) ? '✓' : '🔒' }} {{ t(end.labelKey || end.label) }}</span>
             </div>
           </div>
-          </Transition>
         </div>
 
         <div class="footer-right">
-          <button class="footer-btn" @click="showDetails = !showDetails">
-            {{ showDetails ? '▲' : '▼' }}
-          </button>
           <button class="chapter-btn" @click="showChapterPicker = !showChapterPicker">
             {{ t('ui.chapters') }}
           </button>
@@ -373,7 +367,6 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))
 }
 
 .footer-left {
-  position: relative;
   flex: 1;
   display: flex;
   flex-direction: column;
@@ -400,13 +393,9 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))
 }
 
 .footer-details {
-  position: absolute;
-  bottom: 100%;
-  left: 20px;
   display: flex;
   align-items: center;
   gap: 16px;
-  margin-bottom: 8px;
 }
 
 .footer-stat {
@@ -453,22 +442,6 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))
   flex-shrink: 0;
 }
 
-.footer-btn {
-  padding: 4px 10px;
-  font-size: 11px;
-  color: #666;
-  background: rgba(255,255,255,0.04);
-  border: 1px solid rgba(255,255,255,0.08);
-  border-radius: 4px;
-  cursor: pointer;
-  transition: all 0.15s;
-}
-
-.footer-btn:hover {
-  color: #aaa;
-  border-color: rgba(255,255,255,0.15);
-}
-
 .chapter-btn {
   padding: 6px 16px;
   font-size: 12px;
@@ -485,16 +458,6 @@ const tree = computed(() => buildTreeForChapter(currentChapterId.value))
   background: rgba(255,255,255,0.08);
 }
 
-.footer-expand-enter-active,
-.footer-expand-leave-active {
-  transition: all 0.2s ease;
-}
-.footer-expand-enter-from,
-.footer-expand-leave-to {
-  opacity: 0;
-  transform: translateY(8px);
-}
-
 .chapter-picker {
   position: absolute;
   inset: 0;