From c2b949919f00b34d2aacc46400245778d25ff32c Mon Sep 17 00:00:00 2001
From: aaron <>
Date: Fri, 9 May 2025 12:13:20 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E4=B8=BB=E9=A2=98=E8=89=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue               | 44 ++++++++++++++++---------------
 src/views/AIAgentView.vue | 54 +++++++++++----------------------------
 2 files changed, 38 insertions(+), 60 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 046841e..e088fbe 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -93,23 +93,23 @@ onUnmounted(() => {
 
 <style>
 :root {
-  --color-bg-primary: #343541;
-  --color-bg-secondary: #202123;
-  --color-bg-elevated: #2a2b32;
-  --color-bg-card: #444654;
+  --color-bg-primary: #ffffff;
+  --color-bg-secondary: #f8f9fa;
+  --color-bg-elevated: #ffffff;
+  --color-bg-card: #f8f9fa;
 
-  --color-text-primary: #ececf1;
-  --color-text-secondary: #9fa6b1;
-  --color-text-tertiary: #565869;
-  --color-text-disabled: #6b7280;
+  --color-text-primary: #2c3e50;
+  --color-text-secondary: #6c757d;
+  --color-text-tertiary: #8c98a4;
+  --color-text-disabled: #adb5bd;
 
-  --color-divider: rgba(255, 255, 255, 0.1);
-  --color-border: rgba(255, 255, 255, 0.1);
-  --color-border-hover: rgba(255, 255, 255, 0.2);
+  --color-divider: rgba(0, 0, 0, 0.1);
+  --color-border: rgba(0, 0, 0, 0.1);
+  --color-border-hover: rgba(0, 0, 0, 0.2);
 
-  --color-accent: #66a3ff;
-  --color-accent-hover: #4d8fff;
-  --color-accent-light: rgba(102, 163, 255, 0.1);
+  --color-accent: #3355ff;
+  --color-accent-hover: #2244ee;
+  --color-accent-light: rgba(51, 85, 255, 0.1);
 
   --font-weight-light: 300;
   --font-weight-regular: 400;
@@ -156,8 +156,8 @@ body {
 .sidebar {
   width: var(--sidebar-width);
   height: 100vh;
-  background-color: var(--color-bg-secondary);
-  border-right: 1px solid var(--color-divider);
+  background-color: var(--color-bg-elevated);
+  border-right: 1px solid var(--color-border);
   display: flex;
   flex-direction: column;
 }
@@ -179,7 +179,7 @@ body {
 .title-text {
   font-size: 1.8rem;
   font-weight: 800;
-  background: linear-gradient(135deg, #66a3ff 0%, #3355ff 100%);
+  background: linear-gradient(135deg, var(--color-accent) 0%, #2244ee 100%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
@@ -233,11 +233,12 @@ body {
 }
 
 .agent-item:hover {
-  background-color: var(--color-bg-elevated);
+  background-color: var(--color-bg-secondary);
 }
 
 .agent-item.router-link-active {
-  background-color: var(--color-bg-elevated);
+  background-color: var(--color-accent-light);
+  color: var(--color-accent);
 }
 
 .agent-icon {
@@ -262,6 +263,7 @@ body {
   cursor: pointer;
   transition: all 0.2s ease;
   border-top: 1px solid var(--color-divider);
+  border: 1px solid var(--color-border);
 }
 
 .user-section:hover {
@@ -278,12 +280,12 @@ body {
   width: 2.5rem;
   height: 2.5rem;
   border-radius: 50%;
-  background: #3355ff33;
+  background: var(--color-accent-light);
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 1rem;
-  color: #3355ff;
+  color: var(--color-accent);
   font-weight: bold;
 }
 
diff --git a/src/views/AIAgentView.vue b/src/views/AIAgentView.vue
index c0091ce..f06975c 100644
--- a/src/views/AIAgentView.vue
+++ b/src/views/AIAgentView.vue
@@ -437,7 +437,7 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
-  background-color: #343541;
+  background-color: var(--color-bg-primary);
 }
 
 /* 访问限制提示样式 */
@@ -507,7 +507,7 @@ onUnmounted(() => {
 }
 
 .login-prompt-content {
-  background-color: var(--color-bg-card);
+  background-color: var(--color-bg-elevated);
   border-radius: var(--border-radius);
   padding: 2rem;
   text-align: center;
@@ -568,7 +568,7 @@ onUnmounted(() => {
   width: 100%;
   height: 100%;
   min-height: 0;
-  background-color: #343541;
+  background-color: var(--color-bg-primary);
   overflow: hidden;
   position: relative;
 }
@@ -579,7 +579,7 @@ onUnmounted(() => {
   flex-direction: column;
   min-width: 0;
   min-height: 0;
-  background-color: #343541;
+  background-color: var(--color-bg-primary);
 }
 
 .chat-window {
@@ -641,13 +641,13 @@ onUnmounted(() => {
 }
 
 .user-message .message-content {
-  background-color: #2563eb;
+  background-color: var(--color-accent);
   color: white;
   border-radius: 1rem 1rem 0 1rem;
 }
 
 .ai-message .message-content {
-  background-color: #1f2937;
+  background-color: var(--color-bg-secondary);
   color: var(--color-text-primary);
   border-radius: 1rem 1rem 1rem 0;
 }
@@ -683,7 +683,7 @@ onUnmounted(() => {
 .input-container {
   padding: 1.5rem 2rem;
   background-color: var(--color-bg-primary);
-  border-top: 1px solid var(--color-divider);
+  border-top: 1px solid var(--color-border);
 }
 
 .input-wrapper {
@@ -702,7 +702,7 @@ onUnmounted(() => {
   max-height: 8rem;
   padding: 0.75rem 1rem;
   padding-right: 3rem;
-  background-color: var(--color-bg-elevated);
+  background-color: var(--color-bg-secondary);
   border: 1px solid var(--color-border);
   border-radius: var(--border-radius);
   color: var(--color-text-primary);
@@ -711,15 +711,10 @@ onUnmounted(() => {
   resize: none;
   outline: none;
   transition: border-color 0.2s ease;
-  text-align: left;
-  overflow-y: auto;
 }
 
 .message-input::placeholder {
   color: var(--color-text-secondary);
-  opacity: 1;
-  line-height: 1rem;
-  text-align: left;
 }
 
 .message-input:focus {
@@ -763,33 +758,17 @@ onUnmounted(() => {
 }
 
 :deep(.markdown-body) {
-  color: inherit;
-  font-size: 1rem;
-  line-height: 1.6;
-  width: 100%;
-  overflow-wrap: break-word;
-  word-break: break-word;
+  color: var(--color-text-primary);
 }
 
 :deep(.markdown-body pre) {
-  background-color: rgba(0, 0, 0, 0.2);
-  border-radius: 0.5rem;
-  padding: 1rem;
-  margin: 1rem 0;
-  overflow-x: auto;
+  background-color: var(--color-bg-secondary);
+  border: 1px solid var(--color-border);
 }
 
 :deep(.markdown-body code) {
-  background-color: rgba(0, 0, 0, 0.2);
-  padding: 0.2em 0.4em;
-  border-radius: 0.25rem;
-  font-family: monospace;
-  font-size: 0.9em;
-}
-
-:deep(.markdown-body pre code) {
-  background-color: transparent;
-  padding: 0;
+  background-color: var(--color-bg-secondary);
+  color: var(--color-text-primary);
 }
 
 :deep(.markdown-body p) {
@@ -801,11 +780,8 @@ onUnmounted(() => {
 }
 
 :deep(.markdown-body blockquote) {
+  background-color: var(--color-bg-secondary);
   border-left: 4px solid var(--color-accent);
-  margin: 0.5rem 0;
-  padding: 0.5rem 1rem;
-  background-color: rgba(0, 0, 0, 0.2);
-  border-radius: 0 0.25rem 0.25rem 0;
 }
 
 :deep(.markdown-body table) {
@@ -822,7 +798,7 @@ onUnmounted(() => {
 }
 
 :deep(.markdown-body th) {
-  background-color: rgba(0, 0, 0, 0.2);
+  background-color: var(--color-bg-secondary);
 }
 
 :deep(.markdown-body img) {