31 lines
743 B
Vue
31 lines
743 B
Vue
<template>
|
|
<div :class="['min-h-screen transition-colors duration-300', themeClasses]">
|
|
<!-- 头部导航 -->
|
|
<Header />
|
|
|
|
<!-- 主要内容区域 -->
|
|
<main class="pt-16">
|
|
<router-view />
|
|
</main>
|
|
|
|
<!-- 底部 -->
|
|
<Footer />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed } from 'vue'
|
|
import { useThemeStore } from '@/stores/theme'
|
|
import Header from './Header.vue'
|
|
import Footer from './Footer.vue'
|
|
|
|
const themeStore = useThemeStore()
|
|
|
|
const themeClasses = computed(() => {
|
|
if (themeStore.isDark) {
|
|
return 'bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900 text-white'
|
|
} else {
|
|
return 'bg-gradient-to-br from-gray-50 via-blue-50 to-purple-50 text-gray-900'
|
|
}
|
|
})
|
|
</script> |