Merge pull request #184 from LostElkByte/master
fix: 修复并优化根据主题和侧边栏配色方案选择 navbar 右侧的样式类方法
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="navbar__right" :class="navbarRightClass">
|
<div :class="['navbar__right', navbarRightClass]">
|
||||||
<!-- 桌面端显示 -->
|
<!-- 桌面端显示 -->
|
||||||
<template v-if="isDesktop">
|
<template v-if="isDesktop">
|
||||||
<!-- 搜索 -->
|
<!-- 搜索 -->
|
||||||
@@ -48,7 +48,7 @@ import { DeviceEnum } from "@/enums/DeviceEnum";
|
|||||||
import { useAppStore, useSettingsStore, useUserStore, useTagsViewStore } from "@/store";
|
import { useAppStore, useSettingsStore, useUserStore, useTagsViewStore } from "@/store";
|
||||||
|
|
||||||
import Notification from "./Notification.vue";
|
import Notification from "./Notification.vue";
|
||||||
import { SidebarLightThemeEnum } from "@/enums/ThemeEnum";
|
import { SidebarLightThemeEnum, ThemeEnum } from "@/enums/ThemeEnum";
|
||||||
|
|
||||||
const appStore = useAppStore();
|
const appStore = useAppStore();
|
||||||
const settingStore = useSettingsStore();
|
const settingStore = useSettingsStore();
|
||||||
@@ -66,11 +66,13 @@ function handleProfileClick() {
|
|||||||
router.push({ name: "Profile" });
|
router.push({ name: "Profile" });
|
||||||
}
|
}
|
||||||
|
|
||||||
// 根据浅色模式-侧边栏颜色配置选择navbar右侧的样式类
|
// 根据主题和侧边栏配色方案选择 navbar 右侧的样式类
|
||||||
const navbarRightClass = computed(() => {
|
const navbarRightClass = computed(() => {
|
||||||
return settingStore.sidebarColorScheme === SidebarLightThemeEnum.DARKBLUE
|
const isDarkTheme = settingStore.theme === ThemeEnum.DARK;
|
||||||
? "navbar__right--darkBlue"
|
const isDarkBlueSidebar = settingStore.sidebarColorScheme === SidebarLightThemeEnum.DARKBLUE;
|
||||||
: "navbar__right--white";
|
|
||||||
|
// 如果是暗黑主题,或者是浅色主题中的深蓝色侧边栏配色
|
||||||
|
return isDarkTheme || isDarkBlueSidebar ? "navbar__right--darkBlue" : "navbar__right--white";
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -138,7 +140,6 @@ function logout() {
|
|||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.layout-top .navbar__right--white > *,
|
.layout-top .navbar__right--white > *,
|
||||||
.layout-mix .navbar__right--white > * {
|
.layout-mix .navbar__right--white > * {
|
||||||
color: #000;
|
color: #000;
|
||||||
|
|||||||
@@ -25,8 +25,9 @@ body {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
|
font-family:
|
||||||
"微软雅黑", Arial, sans-serif;
|
"Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑",
|
||||||
|
Arial, sans-serif;
|
||||||
line-height: inherit;
|
line-height: inherit;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
|
|||||||
Reference in New Issue
Block a user