diff --git a/dashboard/src/theme/DarkTheme.ts b/dashboard/src/theme/DarkTheme.ts index 9276c8f98..5906eca32 100644 --- a/dashboard/src/theme/DarkTheme.ts +++ b/dashboard/src/theme/DarkTheme.ts @@ -39,7 +39,8 @@ const PurpleThemeDark: ThemeTypes = { background: '#111111', overlay: '#111111aa', codeBg: '#282833', - code: '#ffffffdd' + code: '#ffffffdd', + chatMessageBubble: '#2d2e30', } }; diff --git a/dashboard/src/theme/LightTheme.ts b/dashboard/src/theme/LightTheme.ts index 35aa1339a..a555fddd7 100644 --- a/dashboard/src/theme/LightTheme.ts +++ b/dashboard/src/theme/LightTheme.ts @@ -39,7 +39,8 @@ const PurpleTheme: ThemeTypes = { background: '#f9fafcf4', overlay: '#ffffffaa', codeBg: '#f5f0ff', - code: '#673ab7' + code: '#673ab7', + chatMessageBubble: '#e7ebf4', } }; diff --git a/dashboard/src/types/themeTypes/ThemeType.ts b/dashboard/src/types/themeTypes/ThemeType.ts index 69b00a1ab..f5e2e5491 100644 --- a/dashboard/src/types/themeTypes/ThemeType.ts +++ b/dashboard/src/types/themeTypes/ThemeType.ts @@ -35,5 +35,6 @@ export type ThemeTypes = { secondary200?: string; codeBg?: string; code?: string; + chatMessageBubble?: string; }; }; diff --git a/dashboard/src/views/ChatPage.vue b/dashboard/src/views/ChatPage.vue index fadba8aac..c47509ab5 100644 --- a/dashboard/src/views/ChatPage.vue +++ b/dashboard/src/views/ChatPage.vue @@ -175,7 +175,7 @@
-
+
{{ msg.message }} @@ -195,15 +195,12 @@
- - -
- - + +
@@ -1574,28 +1571,25 @@ export default { } .message-bubble { - padding: 12px 16px; - border-radius: 18px; + padding: 8px 16px; + border-radius: 12px; max-width: 80%; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } .user-bubble { - background-color: var(--v-theme-background); + background-color: var(--v-theme-chatMessageBubble); color: var(--v-theme-primaryText); - border-top-right-radius: 4px; } .bot-bubble { - background-color: var(--v-theme-surface); border: 1px solid var(--v-theme-border); color: var(--v-theme-primaryText); - border-top-left-radius: 4px; } .user-avatar, .bot-avatar { - align-self: flex-end; + align-self: flex-start; + margin-top: 12px; } /* 附件样式 */