♻️ Update palette

剩下的图片之后选吧，好难选。

assets/styles/global-colors.scss

@@ -3,19 +3,17 @@
 @use "theme/internal" as *;
 @use "theme/functions" as *;
 
-// 下面的内容是根据 Sass 映射自动转换为 CSS 属性的逻辑代码，不用动。
-
 // 将所有预设颜色放在根元素下以便调用，不与下方 class 合并是为了输出时只包含一个 :root。
 :root {
-	@each $palette, $color in $secondary-colors {
+	@each $palette, $color in $palette {
 		--#{"" + $palette}: #{$color};
 	}
 }
 
 // 使预设颜色可以直接通过 class 使用。
-@each $palette, $color in $secondary-colors {
+@each $palette, $color in $palette {
 	.#{"" + $palette} {
-		--accent-50: #{$color};
+		--accent-50: var(--#{$palette});
 	}
 }
 

assets/styles/theme/_colors.scss

@@ -53,18 +53,16 @@ $mixed-colors: (
 	neutral-50: (#666 93%, #eee 93%), // icon-color
 );
 
-// 次要主题色
+// 预设颜色
 // 此处的颜色各主题色均保持固定不变。
-$secondary-colors: (
+$palette: (
 	pink: #f06e8e,
-	rose: #f06e7e,
-	sky: #45b3e1,
 	blue: #4581e1,
+	purple: #b044b0,
+	yellow: #f98d00,
 	green: #4bb530,
-	orange: #f9a400,
-	purple: #bb35ea,
+	cyan: #199bb6,
 	red: #dd1818,
-	yellow: #f98d00,
 );
 
 // 各状态所用颜色值

assets/styles/theme/_variables.scss

@@ -13,7 +13,7 @@ $fallback-transitions: all $ease-out-expo 250ms, color $ease-out-expo 100ms, fil
 $pan-unicode-fonts: TH-Times, "TH-Tshyn-P0", "TH-Tshyn-P1", "TH-Tshyn-P2", "TH-Tshyn-P16", "Arial Unicode MS", Unifont, "Unifont Upper";
 $emoji-fonts: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", emoji;
 $fallback-fonts: "Microsoft YaHei", "Microsoft JhengHei", SimHei, sans-serif, $emoji-fonts, $pan-unicode-fonts;
-$english-fonts: "Inter Variable", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", "Roboto Flex", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", Tahoma, Geneva, Verdana, "Helvetica Neue", Helvetica, Arial/* , Monu */;
+$english-fonts: -apple-system, BlinkMacSystemFont, "Inter Variable", "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", "Roboto Flex", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", Tahoma, Geneva, Verdana, "Helvetica Neue", Helvetica, Arial/* , Monu */;
 $schinese-fonts: $english-fonts, "PingFang SC", "HarmonyOS Sans SC", MiSans, "Noto Sans CJK SC", "Source Han Sans SC", $fallback-fonts;
 $tchinese-fonts: $english-fonts, "PingFang TC", "Noto Sans CJK TC", "Source Han Sans TC", "Microsoft JhengHei", $fallback-fonts;
 $japanese-fonts: $english-fonts, "Yu Gothic UI", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro W3", "Meiryo UI", "MS UI Gothic", "Noto Sans CJK JP", "Source Han Sans", $fallback-fonts;

components/User/UserAvatar.vue

@@ -57,6 +57,18 @@
 		background-color: c(gray-20);
 		cursor: pointer;
 
+		.colored-sidebar & {
+			background-color: c(main-bg, 20%);
+
+			&:any-hover {
+				background-color: c(main-bg, 40%);
+			}
+
+			.icon {
+				color: white;
+			}
+		}
+
 		> img {
 			@include square(100%);
 			z-index: 1;

locales/Chinese Simplified.ts

@@ -24,15 +24,13 @@ export default {
 	},
 	palette: {
 		_: "个性色",
-		pink: "萌妹粉",
-		rose: "玫瑰红",
-		sky: "天空蓝",
+		pink: "心爱粉",
 		blue: "智乃蓝",
-		green: "千夜绿",
-		orange: "心爱橙",
 		purple: "理世紫",
-		yellow: "黄色",
-		red: "红色",
+		yellow: "纱路黄",
+		green: "千夜绿",
+		cyan: "麻耶青",
+		red: "小惠红",
 	},
 	language: {
 		_: "语言",

locales/English.ts

@@ -26,15 +26,13 @@ const English: LocaleIdentifiers = {
 	},
 	palette: {
 		_: "Palette",
-		pink: "Kawaii Pink",
-		rose: "Rose Red",
-		sky: "Sky Blue",
+		pink: "Cocoa Pink",
 		blue: "Chino Blue",
-		green: "Chiya Green",
-		orange: "Cocoa Orange",
 		purple: "Rize Purple",
-		yellow: "Yellow",
-		red: "Red",
+		yellow: "Sharo Yellow",
+		green: "Chiya Green",
+		cyan: "Maya Cyan",
+		red: "Megumi Red",
 	},
 	language: {
 		_: "Language",

locales/Japanese.ts

@@ -26,12 +26,13 @@ const Japanese: LocaleIdentifiers = {
 	},
 	palette: {
 		_: "色",
-		pink: "カワイイ ピンク",
-		sky: "空色",
+		pink: "ココア ピンク",
 		blue: "チノ 青",
-		green: "千夜 緑",
-		orange: "ココア オレンジ",
 		purple: "リゼ 紫",
+		yellow: "シャロ 黄",
+		green: "千夜 緑",
+		cyan: "マヤ シアン",
+		red: "メグ 赤",
 	},
 	language: {
 		_: "言語",

modules/theme/types.ts

@@ -1,5 +1,5 @@
 export const THEME_SET_LIST = ["light", "dark", "system"] as const;
-export const PALETTE_LIST = ["pink", "cyan", "blue", "green", "orange", "purple", "red", "yellow", "sky", "custom"] as const;
+export const PALETTE_LIST = ["pink", "blue", "purple", "yellow", "green", "cyan", "red", "custom"] as const;
 
 export type ThemeSetType = typeof THEME_SET_LIST[number];
 export type ThemeType = Exclude<ThemeSetType, "system">; // 想加高对比色、红绿色盲配色吗？

pages/settings/appearance.vue

@@ -3,15 +3,13 @@
 
 	const themeList = ["light", "dark", "system"] as const;
 	const paletteList = [
-		{ color: "pink", subtitle: "Kawaii Forever" },
-		{ color: "rose", subtitle: "" },
-		{ color: "sky", subtitle: "Jouga Maya" },
+		{ color: "pink", subtitle: "Hoto Kokoa" },
 		{ color: "blue", subtitle: "Kafuu Chino" },
-		{ color: "orange", subtitle: "Hoto Kokoa" },
 		{ color: "purple", subtitle: "Tedeza Rize" },
+		{ color: "yellow", subtitle: "Kirima Sharo" },
 		{ color: "green", subtitle: "Ujimatsu Chiya" },
-		{ color: "yellow", subtitle: "" },
-		{ color: "red", subtitle: "" },
+		{ color: "cyan", subtitle: "Joga Maya" },
+		{ color: "red", subtitle: "Natsu Megumi" },
 	] as const;
 	const paletteSection = ref<HTMLElement>();