fix scrollbar

This commit is contained in:
Julian Freeman
2026-03-14 22:24:26 -04:00
parent 9803ec67ca
commit f83ccbe2da

View File

@@ -1,6 +1,5 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 启动屏专属过渡 -->
<transition name="layout-fade"> <transition name="layout-fade">
<SplashScreen v-if="!store.isInitialized" :status-text="store.initStatus" /> <SplashScreen v-if="!store.isInitialized" :status-text="store.initStatus" />
</transition> </transition>
@@ -9,7 +8,6 @@
<Sidebar /> <Sidebar />
<div class="main-content"> <div class="main-content">
<router-view v-slot="{ Component }"> <router-view v-slot="{ Component }">
<!-- 页面切换专属过渡极简快速 -->
<transition name="page-fade" mode="out-in"> <transition name="page-fade" mode="out-in">
<component :is="Component" /> <component :is="Component" />
</transition> </transition>
@@ -72,11 +70,13 @@ body {
.main-content { .main-content {
flex: 1; flex: 1;
height: 100vh; height: 100vh;
overflow-y: auto; display: flex; /* 让子元素(页面)能撑满高度 */
flex-direction: column;
overflow: hidden; /* 禁用全局容器滚动 */
position: relative; position: relative;
} }
/* 1. 布局级别过渡 (Splash -> App): 优雅、大气 */ /* 1. 布局级别过渡 (Splash -> App) */
.layout-fade-enter-active, .layout-fade-enter-active,
.layout-fade-leave-active { .layout-fade-leave-active {
transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
@@ -87,7 +87,7 @@ body {
transform: scale(1.05); transform: scale(1.05);
} }
/* 2. 页面级别过渡 (Essentials <-> Updates): 快速、响应灵敏 */ /* 2. 页面级别过渡 */
.page-fade-enter-active, .page-fade-enter-active,
.page-fade-leave-active { .page-fade-leave-active {
transition: opacity 0.15s ease; transition: opacity 0.15s ease;