fix(theme): distinguish Luna swatches and visible borders

Author: ZhaoJiSen

ui/components/SideBar/profile.vue

@@ -219,7 +219,10 @@ const menuShortcutButtonUi = {
   label: "min-w-0 flex-1 truncate text-left"
 };
 
-const currentThemeAccent = computed(() => getThemePreset(currentThemePresetId.value)?.accent || "var(--theme-accent)");
+const currentThemeAccent = computed(() => {
+  const preset = getThemePreset(currentThemePresetId.value);
+  return preset?.baseColor || preset?.accent || "var(--theme-accent)";
+});
 const themePaletteOpen = ref(false);
 const previewedThemePresetId = ref<ThemePresetId | null>(null);
 const palettePreviewArmed = ref(false);
@@ -1132,7 +1135,7 @@ onBeforeUnmount(() => {
                   >
                     <span
                       class="size-2.5 shrink-0 rounded-full ring-1 ring-(--app-border)"
-                      :style="{ backgroundColor: item.accent }"
+                      :style="{ backgroundColor: item.baseColor || item.accent }"
                     />
                     <span class="min-w-0 flex-1 truncate text-left text-xs">{{ themePresetLabel(item) }}</span>
                     <UIcon

ui/shared/theme/color.check.mts

@@ -53,4 +53,9 @@ for (const preset of [...LIGHT_THEME_PRESETS, ...DARK_THEME_PRESETS]) {
   assert.ok(contrastRatio(preset.accent, foreground) >= 4.5, `${preset.id} checkbox foreground has sufficient contrast`);
 }
 
+const lunaSwatches = DARK_THEME_PRESETS.flatMap((preset) =>
+  preset.family === "luna" ? [preset.baseColor || preset.accent] : []
+);
+assert.equal(new Set(lunaSwatches).size, lunaSwatches.length, "Luna theme swatches must be distinct");
+
 console.log("color.check: ok");

ui/shared/theme/themes/luna-darkgray.css

@@ -2,7 +2,7 @@
   --theme-bg: #111113;
   --theme-fg: #efeff0;
   --theme-muted: #878c97;
-  --theme-border: rgba(0, 0, 0, 0.3);
+  --theme-border: #3a3e45;
   --theme-accent: #1ab394;
   --theme-folder-icon: var(--sidebar-icon-color);
   --theme-surface: #1c1e21;

ui/shared/theme/themes/luna-deepblue.css

@@ -2,7 +2,7 @@
   --theme-bg: #020203;
   --theme-fg: #efeff0;
   --theme-muted: #6b82a8;
-  --theme-border: rgba(0, 0, 0, 0.3);
+  --theme-border: #2a3548;
   --theme-accent: #1ab394;
   --theme-folder-icon: var(--sidebar-icon-color);
   --theme-surface: #0b0e13;

ui/shared/theme/themes/luna-default.css

@@ -2,7 +2,7 @@
   --theme-bg: #241e1e;
   --theme-fg: #efeff0;
   --theme-muted: #a69696;
-  --theme-border: rgba(0, 0, 0, 0.3);
+  --theme-border: #4a4040;
   --theme-accent: #1ab394;
   --theme-folder-icon: var(--sidebar-icon-color);
   --theme-folder-icon-filled: 1;