From 7b04a6a0c5d7df81ede15da1f7af5df53094fb3f Mon Sep 17 00:00:00 2001
From: ShanYi-Hui <shanyi.hui@qq.com>
Date: Thu, 12 Dec 2024 17:59:58 +0800
Subject: [PATCH] =?UTF-8?q?perf(ui):=20:zap:=20=E7=A7=BB=E9=99=A4scrollbar?=
 =?UTF-8?q?=5F=5Fview=E9=AB=98=E5=BA=A6=E9=99=90=E5=AE=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

scrollbar__view不应限制高度，这样会影响滑动，现在看不出来只是因为背景颜色一致,而且容器min-height是有简单计算方式的，不用各种判断。
---
 src/components/Footer/src/Footer.vue | 2 +-
 src/layout/Layout.vue                | 4 ----
 src/layout/components/AppView.vue    | 6 +++++-
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/Footer/src/Footer.vue b/src/components/Footer/src/Footer.vue
index 5c251f99..532cd732 100644
--- a/src/components/Footer/src/Footer.vue
+++ b/src/components/Footer/src/Footer.vue
@@ -9,7 +9,7 @@ const title = computed(() => appStore.getTitle)
 
 <template>
   <div
-    class="footer text-center text-[var(--el-text-color-placeholder)] bg-[var(--app-content-bg-color)] h-[var(--app-footer-height)] leading-[var(--app-footer-height)] dark:bg-[var(--el-bg-color)]"
+    class="text-center text-[var(--el-text-color-placeholder)] bg-[var(--app-content-bg-color)] h-[var(--app-footer-height)] leading-[var(--app-footer-height)] dark:bg-[var(--el-bg-color)] overflow-hidden"
   >
     Copyright ©2021-present {{ title }}
   </div>
diff --git a/src/layout/Layout.vue b/src/layout/Layout.vue
index 1dfad7b5..5cb62e14 100644
--- a/src/layout/Layout.vue
+++ b/src/layout/Layout.vue
@@ -70,9 +70,5 @@ export default defineComponent({
 <style lang="less" scoped>
 .layout {
   background-color: var(--app-content-bg-color);
-
-  :deep(.el-scrollbar__view) {
-    height: 100% !important;
-  }
 }
 </style>
diff --git a/src/layout/components/AppView.vue b/src/layout/components/AppView.vue
index d13bc887..8c00f7ef 100644
--- a/src/layout/components/AppView.vue
+++ b/src/layout/components/AppView.vue
@@ -20,7 +20,11 @@ const tagsView = computed(() => appStore.getTagsView)
 <template>
   <section
     :class="[
-      'flex-1 p-[var(--app-content-padding)] w-full bg-[var(--app-content-bg-color)] dark:bg-[var(--el-bg-color)]'
+      'box-border p-[var(--app-content-padding)] w-full bg-[var(--app-content-bg-color)] dark:bg-[var(--el-bg-color)]',
+      {
+        '!min-h-[calc(100vh-var(--top-tool-height)-var(--tags-view-height)-var(--app-footer-height))] pb-0':
+          footer
+      }
     ]"
   >
     <router-view>