From 6ef99e1553e9f354d4dc6f8fc27664c105fee85f Mon Sep 17 00:00:00 2001
From: Soulter <905617992@qq.com>
Date: Sun, 21 Dec 2025 21:19:54 +0800
Subject: [PATCH] feat: enhance ChatInput and ConversationSidebar dark theme

---
 dashboard/src/components/chat/ChatInput.vue        | 14 ++++++++++++--
 .../src/components/chat/ConversationSidebar.vue    |  3 ++-
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/dashboard/src/components/chat/ChatInput.vue b/dashboard/src/components/chat/ChatInput.vue
index 402a9e3a9..4bc2c1a38 100644
--- a/dashboard/src/components/chat/ChatInput.vue
+++ b/dashboard/src/components/chat/ChatInput.vue
@@ -1,7 +1,15 @@
 <template>
     <div class="input-area fade-in">
         <div class="input-container"
-            style="width: 85%; max-width: 900px; margin: 0 auto; border: 1px solid #e0e0e0; border-radius: 24px; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);">
+            :style="{
+                width: '85%',
+                maxWidth: '900px',
+                margin: '0 auto',
+                border: isDark ? 'none' : '1px solid #e0e0e0',
+                borderRadius: '24px',
+                boxShadow: isDark ? 'none' : '0px 2px 2px rgba(0, 0, 0, 0.1)',
+                backgroundColor: isDark ? '#2d2d2d' : 'transparent'
+            }">
             <!-- 引用预览区 -->
             <div class="reply-preview" v-if="props.replyTo">
                 <div class="reply-content">
@@ -86,6 +94,7 @@
 <script setup lang="ts">
 import { ref, computed, onMounted, onBeforeUnmount } from 'vue';
 import { useModuleI18n } from '@/i18n/composables';
+import { useCustomizerStore } from '@/stores/customizer';
 import ConfigSelector from './ConfigSelector.vue';
 import ProviderModelMenu from './ProviderModelMenu.vue';
 import type { Session } from '@/composables/useSessions';
@@ -140,6 +149,7 @@ const emit = defineEmits<{
 }>();
 
 const { tm } = useModuleI18n('features/chat');
+const isDark = computed(() => useCustomizerStore().uiTheme === 'PurpleThemeDark');
 
 const inputField = ref<HTMLTextAreaElement | null>(null);
 const imageInputRef = ref<HTMLInputElement | null>(null);
@@ -261,7 +271,7 @@ defineExpose({
 <style scoped>
 .input-area {
     padding: 16px;
-    background-color: var(--v-theme-surface);
+    background-color: transparent;
     position: relative;
     border-top: 1px solid var(--v-theme-border);
     flex-shrink: 0;
diff --git a/dashboard/src/components/chat/ConversationSidebar.vue b/dashboard/src/components/chat/ConversationSidebar.vue
index c7e948ae5..1d7ce7fe5 100644
--- a/dashboard/src/components/chat/ConversationSidebar.vue
+++ b/dashboard/src/components/chat/ConversationSidebar.vue
@@ -35,7 +35,8 @@
                     @update:selected="$emit('selectConversation', $event)">
                     <v-list-item v-for="item in sessions" :key="item.session_id" :value="item.session_id"
                         rounded="lg" class="conversation-item" active-color="secondary">
-                        <v-list-item-title v-if="!sidebarCollapsed || isMobile" class="conversation-title">
+                        <v-list-item-title v-if="!sidebarCollapsed || isMobile" class="conversation-title"
+                            :style="{ color: isDark ? '#ffffff' : '#000000' }">
                             {{ item.display_name || tm('conversation.newConversation') }}
                         </v-list-item-title>
                         <!-- <v-list-item-subtitle v-if="!sidebarCollapsed || isMobile" class="timestamp">