|
|
@@ -91,8 +91,6 @@
|
|
|
class="p-2 rounded-full mt-1 hover:bg-gray-500/60 transition-colors cursor-pointer"
|
|
|
title="切换主题"
|
|
|
>
|
|
|
- <!-- 简单图标切换,也可以使用 Icon 组件 -->
|
|
|
- <!-- <span v-if="themeStore.theme === 'light'">🌙</span> -->
|
|
|
<Icon v-if="themeStore.theme === 'light'" icon="ri:moon-fill" />
|
|
|
<Icon v-else icon="ri:sun-fill" />
|
|
|
</button>
|
|
|
@@ -228,11 +226,9 @@
|
|
|
class="w-8 h-8 rounded-full avatar-image"
|
|
|
/>
|
|
|
</div>
|
|
|
- <span
|
|
|
- class="text-sm text-[#c5cfd7]"
|
|
|
- style="text-wrap-mode: nowrap"
|
|
|
- >{{ userName }}</span
|
|
|
- >
|
|
|
+ <span class="text-sm user-name" style="text-wrap-mode: nowrap">{{
|
|
|
+ userName
|
|
|
+ }}</span>
|
|
|
</span>
|
|
|
<template #dropdown>
|
|
|
<el-dropdown-menu>
|
|
|
@@ -838,24 +834,26 @@ const onUserCommand = async (command: string) => {
|
|
|
|
|
|
.nav-item-default {
|
|
|
background-color: #eeeeef; /* 浅灰色背景 */
|
|
|
- color: #5f6f83; /* Slate 500 灰色文字 */
|
|
|
+ color: var(--text-secondary);
|
|
|
border-radius: 100px;
|
|
|
}
|
|
|
|
|
|
.nav-item-default:hover {
|
|
|
- background-color: #e2e8f0; /* 悬停时稍深一点的灰色 */
|
|
|
- color: #02409b; /* 品牌蓝文字 */
|
|
|
+ /* background-color: #e2e8f0; */
|
|
|
+ color: #02409b !important; /* 品牌蓝文字 */
|
|
|
}
|
|
|
|
|
|
/* 激活状态:深蓝色背景,白色文字 */
|
|
|
.nav-item-active {
|
|
|
background-color: #063e8d !important; /* 指定的深蓝色背景 */
|
|
|
- color: #ffffff !important; /* 白色文字 */
|
|
|
+ color: var(--text-primary);
|
|
|
font-weight: 500; /* 稍微加粗 */
|
|
|
box-shadow: 0 2px 4px rgba(6, 62, 141, 0.2); /* 可选:轻微阴影 */
|
|
|
border-radius: 100px;
|
|
|
}
|
|
|
-
|
|
|
+.user-name {
|
|
|
+ color: var(--text-secondary);
|
|
|
+}
|
|
|
/* 确保移动端也生效,因为上面用了 block,可能需要调整一下内边距或显示方式 */
|
|
|
@media (max-width: 1024px) {
|
|
|
.nav-item-active,
|
|
|
@@ -867,7 +865,7 @@ const onUserCommand = async (command: string) => {
|
|
|
}
|
|
|
|
|
|
.nav-item-default {
|
|
|
- color: rgba(230, 237, 255, 0.8);
|
|
|
+ /* color: rgba(230, 237, 255, 0.8); */
|
|
|
border-radius: 0;
|
|
|
position: relative;
|
|
|
background-color: transparent;
|
|
|
@@ -879,7 +877,7 @@ const onUserCommand = async (command: string) => {
|
|
|
}
|
|
|
|
|
|
.nav-item-active {
|
|
|
- color: #fff !important;
|
|
|
+ /* color: #fff !important; */
|
|
|
background: linear-gradient(
|
|
|
180deg,
|
|
|
rgba(92, 103, 238, 0.32),
|