fix: 抽离底部组件

src/layout/components/Footer/index.ts

@@ -0,0 +1,3 @@
+import Footer from './index.vue'
+
+export { Footer }

src/layout/components/Footer/index.vue

@@ -0,0 +1,23 @@
+<template>
+  <div class="go-footer">
+    <slot>
+      <n-a>{{ $t('global.doc_addr') }}: </n-a>
+      <n-a italic href="http://www.mtruning.club/">
+        http://www.mtruning.club/
+      </n-a>
+    </slot>
+  </div>
+</template>
+
+<script setup lang="ts"></script>
+
+<style lang="scss" scoped>
+@include go(footer) {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  padding: 0 40px;
+  height: $--footer-height;
+}
+</style>

src/styles/common/var.scss

@@ -30,6 +30,8 @@ $--color-dark-border: #333335;
 $--max-width: 1920px;
 // 顶部距离
 $--header-height: 60px;
+// 底部距离
+$--footer-height: 50px;
 // 模糊
 $--filter-blur-base: blur(20px);
 // 毛玻璃

src/views/login/index.vue

@@ -105,10 +105,7 @@
     </div>
 
     <div class="go-login-box-footer">
-      <n-a>{{ $t('global.doc_addr') }}: </n-a>
-      <n-a italic href="http://www.mtruning.club/">
-        http://www.mtruning.club/
-      </n-a>
+      <Footer />
     </div>
   </div>
 </template>
@@ -126,6 +123,7 @@ import { useDesignStore } from '@/store/modules/designStore/designStore'
 import { ThemeSelect } from '@/components/ThemeSelect'
 import { LangSelect } from '@/components/LangSelect'
 import { Header } from '@/layout/components/Header'
+import { Footer } from '@/layout/components/Footer'
 import { PageEnum } from '@/enums/pageEnum'
 import {
   PersonOutline as PersonOutlineIcon,
@@ -292,12 +290,8 @@ $carousel-image-height: 60vh;
   &-footer {
     z-index: 2;
     position: fixed;
-    bottom: 0;
     width: 100%;
-    height: $footer-height;
-    text-align: center;
-    line-height: $footer-height;
-    color: $--color-text-2;
+    bottom: 0;
   }
 
   &-bg {