mirror of
https://github.com/m-xlsea/ruoyi-plus-soybean.git
synced 2025-09-24 07:49:47 +08:00
refactor(components): blankLayout引入GlobalContent
This commit is contained in:
@ -58,7 +58,11 @@ const modules: LoginModule[] = [
|
||||
{ key: 'bind-wechat', label: EnumLoginModule['bind-wechat'], component: BindWechat }
|
||||
];
|
||||
|
||||
const bgColor = computed(() => mixColor('#ffffff', theme.themeColor, 0.3));
|
||||
const bgColor = computed(() => {
|
||||
const COLOR_WHITE = '#ffffff';
|
||||
const ratio = theme.darkMode ? 0.6 : 0.3;
|
||||
return mixColor(COLOR_WHITE, theme.themeColor, ratio);
|
||||
});
|
||||
</script>
|
||||
<style scoped>
|
||||
.login-bg {
|
||||
|
19
src/views/website/components/WebsiteHeader.vue
Normal file
19
src/views/website/components/WebsiteHeader.vue
Normal file
@ -0,0 +1,19 @@
|
||||
<template>
|
||||
<header class="flex-y-center justify-between h-78px px-24px bg-light dark:bg-dark shadow-sm">
|
||||
<div class="flex-y-center h-full">
|
||||
<system-logo class="w-48px h-48px mr-12px" :color="theme.themeColor" />
|
||||
<n-gradient-text size="32">Soybean 网址导航</n-gradient-text>
|
||||
</div>
|
||||
<theme-switch :dark="theme.darkMode" @update="handleDarkMode" />
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { NGradientText } from 'naive-ui';
|
||||
import { SystemLogo, ThemeSwitch } from '@/components';
|
||||
import { useThemeStore } from '@/store';
|
||||
|
||||
const theme = useThemeStore();
|
||||
const { handleDarkMode } = useThemeStore();
|
||||
</script>
|
||||
<style scoped></style>
|
3
src/views/website/components/index.ts
Normal file
3
src/views/website/components/index.ts
Normal file
@ -0,0 +1,3 @@
|
||||
import WebsiteHeader from './WebsiteHeader.vue';
|
||||
|
||||
export { WebsiteHeader };
|
@ -1,22 +1,12 @@
|
||||
<template>
|
||||
<div>
|
||||
<header class="flex-y-center justify-between h-78px px-24px bg-light dark:bg-dark shadow-sm">
|
||||
<div class="flex-y-center">
|
||||
<system-logo class="w-48px h-48px mr-12px" :color="theme.themeColor" />
|
||||
<n-gradient-text size="32">Soybean 网址导航</n-gradient-text>
|
||||
</div>
|
||||
<theme-switch :dark="theme.darkMode" @update="handleDarkMode" />
|
||||
</header>
|
||||
<website-header />
|
||||
<n-space :vertical="true"></n-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { NSpace, NGradientText } from 'naive-ui';
|
||||
import { SystemLogo, ThemeSwitch } from '@/components';
|
||||
import { useThemeStore } from '@/store';
|
||||
|
||||
const theme = useThemeStore();
|
||||
const { handleDarkMode } = useThemeStore();
|
||||
import { NSpace } from 'naive-ui';
|
||||
import { WebsiteHeader } from './components';
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
Reference in New Issue
Block a user