ViperEkura
/
Luxx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修复样式问题

This commit is contained in:
ViperEkura 2026-04-15 20:00:05 +08:00
parent 7a6ab26379
commit d18508c760
2 changed files with 6 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
dashboard/src/style.css
View File

@ -336,14 +336,14 @@ body {
.message-bubble.user .message-container { .message-bubble.user .message-container {
align-items: flex-end; align-items: flex-end;
width: fit-content; width: fit-content;
max-width: 70%; max-width: 80%;
} }
.message-bubble.assistant .message-container { .message-bubble.assistant .message-container {
align-items: flex-start; align-items: flex-start;
flex: 1 1 auto; flex: 1 1 auto;
width: 90%; width: 80%;
max-width: 90%; max-width: 80%;
min-width: 0; min-width: 0;
} }
@ -354,7 +354,7 @@ body {
.avatar { .avatar {
width: 32px; width: 32px;
height: 32px; height: 32px;
border-radius: 8px; border-radius: 50%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;

5
dashboard/src/views/ConversationView.vue
View File

@ -80,7 +80,7 @@
/> />
<!-- 流式消息 - 使用 store 中的状态 --> <!-- 流式消息 - 使用 store 中的状态 -->
<div v-if="currentStreamState" class="chat-message assistant streaming"> <div v-if="currentStreamState" class="chat-message assistant streaming">
<div class="message-avatar">Luxx</div> <div class="avatar">Luxx</div>
<div class="message-content"> <div class="message-content">
<ProcessBlock <ProcessBlock
:process-steps="currentStreamState.process_steps" :process-steps="currentStreamState.process_steps"
@ -392,9 +392,8 @@ onUnmounted(() => {
.chat-message { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; } .chat-message { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; }
.chat-message.user { flex-direction: row-reverse; } .chat-message.user { flex-direction: row-reverse; }
.chat-message.streaming { opacity: 0.9; } .chat-message.streaming { opacity: 0.9; }
.chat-message.streaming .message-avatar { animation: pulse 1.5s ease-in-out infinite; } .chat-message.streaming .avatar { animation: pulse 1.5s ease-in-out infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }
.message-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--bg-secondary); display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }
.message-content { max-width: 80%; width: 80%; } .message-content { max-width: 80%; width: 80%; }
.chat-message.user .message-content { max-width: 80%; width: auto; } .chat-message.user .message-content { max-width: 80%; width: auto; }
.message-text { padding: 0.65rem 0.9rem; border-radius: 12px; font-size: 0.9rem; line-height: 1.5; background: var(--bg-secondary); color: var(--text-primary); word-break: break-word; } .message-text { padding: 0.65rem 0.9rem; border-radius: 12px; font-size: 0.9rem; line-height: 1.5; background: var(--bg-secondary); color: var(--text-primary); word-break: break-word; }