refactor(theme): move dark mode toggle to RightDock alongside profile button

- RightDock: add ☀/☽ theme toggle button next to 个人信息
- WidgetsDrawer: revert to original (no theme toggle)
- blog.css: remove unused .widgets-theme-btn styles

Co-Authored-By: Claude <noreply@anthropic.com>

Author: yyyCode

vue/src/assets/blog.css

@@ -2499,38 +2499,6 @@ body {
   gap: 16px;
 }
 
-/* 挂件抽屉：主题切换按钮 */
-.widgets-theme-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 8px;
-  width: 100%;
-  padding: 10px 14px;
-  border: 1px solid var(--border);
-  border-radius: 10px;
-  background: transparent;
-  color: var(--text);
-  font-size: 13px;
-  font-weight: 650;
-  cursor: pointer;
-  transition: background 0.15s ease, border-color 0.15s ease;
-}
-
-.widgets-theme-btn:hover {
-  background: rgba(74, 163, 255, 0.08);
-  border-color: rgba(74, 163, 255, 0.3);
-}
-
-[data-theme='dark'] .widgets-theme-btn {
-  background: rgba(255, 255, 255, 0.04);
-}
-
-[data-theme='dark'] .widgets-theme-btn:hover {
-  background: rgba(255, 255, 255, 0.08);
-  border-color: rgba(255, 255, 255, 0.15);
-}
-
 /* 兼容旧样式：
    早期版本用 .site-top-actions / .top-action-btn / .theme-toggle 组织顶栏。
    现在顶栏已切换到 .site-brand / .site-nav，但仍可能有页面引用旧 class。

vue/src/components/RightDock.vue

@@ -9,16 +9,36 @@
       </span>
       <span class="right-dock-text">个人信息</span>
     </button>
+
+    <button type="button" class="right-dock-btn" @click="onToggle" :aria-label="isDark ? '切换到浅色模式' : '切换到深色模式'">
+      <span class="right-dock-ico" aria-hidden="true">{{ isDark ? '☀' : '☽' }}</span>
+      <span class="right-dock-text">{{ isDark ? '浅色' : '深色' }}</span>
+    </button>
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { onMounted, ref } from 'vue'
+import { toggleTheme as applyToggle } from '../theme'
 
 const emit = defineEmits(['toggle-profile'])
 const expanded = ref(false)
+const isDark = ref(false)
+
+function sync() {
+  isDark.value = document.documentElement.getAttribute('data-theme') === 'dark'
+}
+
+function onToggle() {
+  applyToggle()
+  sync()
+}
 
 function onLeave() {
   expanded.value = false
 }
+
+onMounted(() => {
+  sync()
+})
 </script>

vue/src/components/WidgetsDrawer.vue

@@ -7,20 +7,12 @@
     </div>
     <div class="widgets-drawer-body">
       <ProfileCard :profile="profile" />
-
-      <button type="button" class="widgets-theme-btn" @click="onToggle">
-        <span aria-hidden="true">{{ isDark ? '☀' : '☽' }}</span>
-        {{ isDark ? '浅色模式' : '深色模式' }}
-      </button>
-
       <BlogInfoCard />
     </div>
   </aside>
 </template>
 
 <script setup>
-import { onMounted, ref } from 'vue'
-import { toggleTheme as applyToggle } from '../theme'
 import ProfileCard from './ProfileCard.vue'
 import BlogInfoCard from './BlogInfoCard.vue'
 
@@ -30,18 +22,4 @@ defineProps({
 })
 
 const emit = defineEmits(['close'])
-const isDark = ref(false)
-
-function sync() {
-  isDark.value = document.documentElement.getAttribute('data-theme') === 'dark'
-}
-
-function onToggle() {
-  applyToggle()
-  sync()
-}
-
-onMounted(() => {
-  sync()
-})
 </script>