This commit is contained in:
2025-03-04 11:39:37 +08:00
parent 90c0c9002a
commit ebff70fea3
13 changed files with 47 additions and 60 deletions

View File

@ -1,34 +1,14 @@
<script setup> <script setup>
import NavBar from "./components/NavBar.vue";
import AppFooter from "./components/AppFooter.vue";
</script> </script>
<template> <template>
<div> <div>
<!-- 全局导航栏 --> <NavBar />
<nav>
<router-link to="/">首页</router-link> |
<router-link to="/about">关于</router-link>
</nav>
<!-- 路由匹配的组件会渲染在这里 -->
<router-view /> <router-view />
<AppFooter />
</div> </div>
</template> </template>
<style scoped> <style scoped></style>
/* 全局样式 */
nav {
padding: 10px;
background-color: #f0f0f0;
}
nav a {
margin-right: 10px;
text-decoration: none;
color: #333;
}
nav a.router-link-active {
color: #42b983;
font-weight: bold;
}
</style>

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -0,0 +1,12 @@
@font-face {
font-family: "jx";
src: url("@/assets/fonts/jx.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
body {
font-family: "jx", sans-serif;
margin: 0;
padding: 0;
}

View File

@ -1,30 +1,24 @@
<template> <template>
<el-footer class="app-footer"> <el-footer>
<div class="social-links"> <div class="footer-content">
<a <p>© 2023 Kisechan</p>
v-for="item in socialLinks" <p>还在做还在做还在做还在做</p>
:key="item.name"
:href="item.url"
target="_blank"
>
<el-icon :size="24">
<component :is="item.icon" />
</el-icon>
<span class="link-name">{{ item.name }}</span>
</a>
</div>
<div class="copyright">
<p>2024 - 2025 Kisechan</p>
</div> </div>
</el-footer> </el-footer>
</template> </template>
<script setup> <script setup>
const socialLinks = [ // 可以在这里定义一些逻辑
{ name: "github", icon: "Github", url: "https://github.com" },
{ name: "email", icon: "Message", url: "mailto:your@email.com" },
];
</script> </script>
<style scoped></style> <style scoped>
.el-footer {
text-align: center;
padding: 20px 0;
}
.footer-content {
max-width: 1200px;
margin: 0 auto;
}
</style>

View File

@ -1,16 +1,22 @@
<template> <template>
<el-menu <el-menu
mode="horizontal" mode="horizontal"
:router="true" router
class="nav-menu"
:default-active="$route.path"
> >
<el-menu-item index="/"></el-menu-item> <el-menu-item index="/"></el-menu-item>
<el-menu-item> <el-menu-item >
<a href="https://blog.kisechan.space/" target="_blank">博客</a> <a href="blog.kisechan.space" target="_blank">博客</a>
</el-menu-item> </el-menu-item>
<el-menu-item index="/about">关于</el-menu-item> <el-menu-item index="/about">关于</el-menu-item>
</el-menu> </el-menu>
</template> </template>
<style scoped></style> <script setup>
</script>
<style scoped>
.el-menu {
display: flex;
justify-content: center;
}
</style>

View File

@ -4,6 +4,7 @@ import router from './router'
import ElementPlus from 'element-plus' import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css' import 'element-plus/dist/index.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue' import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import './assets/styles/global.css'
const app = createApp(App) const app = createApp(App)

View File

@ -21,7 +21,6 @@
</el-col> </el-col>
</el-row> </el-row>
</el-main> </el-main>
<AppFooter />
</div> </div>
</template> </template>
@ -29,6 +28,4 @@
</style> </style>
<script setup> <script setup>
import NavBar from '@/components/NavBar.vue'
import AppFooter from '@/components/AppFooter.vue'
</script> </script>

View File

@ -8,13 +8,10 @@
<p>Building...</p> <p>Building...</p>
</div> </div>
</el-main> </el-main>
<AppFooter />
</div> </div>
</template> </template>
<script setup> <script setup>
import NavBar from "@/components/NavBar.vue";
import AppFooter from "@/components/AppFooter.vue";
</script> </script>
<style scoped></style> <style scoped></style>