refactor:优化移动端页面

This commit is contained in:
jiangrui
2025-03-05 12:29:47 +08:00
parent 680108f499
commit 604ba2eec6
12 changed files with 793 additions and 309 deletions

View File

@@ -31,7 +31,7 @@
<!-- 底部导航栏 -->
<van-tabbar class="home__tabbar" route>
<van-tabbar-item to="/resource" icon="search">搜索</van-tabbar-item>
<van-tabbar-item to="/douban" icon="video">影视</van-tabbar-item>
<van-tabbar-item to="/douban" icon="video">热门</van-tabbar-item>
<van-tabbar-item to="/setting" icon="setting-o">设置</van-tabbar-item>
</van-tabbar>
@@ -118,6 +118,8 @@ const handleLogout = () => {
// 布局
min-height: 100vh;
background: var(--theme-background);
display: flex;
flex-direction: column;
// 头部搜索
&__header {
@@ -159,9 +161,11 @@ const handleLogout = () => {
// 主内容区 - 调整顶部间距
&__content {
padding-top: 64px; // 搜索框高度(48px) + 上下padding(8px * 2)
padding-bottom: calc(50px + var(--safe-area-bottom)); // tabbar高度 + 底部安全区域
min-height: 100vh;
padding-bottom: 100px; // tabbar高度 + 底部安全区域
box-sizing: border-box;
flex: 1;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
// 加载状态