style: 调整聊天组件和消息组件的样式,优化视觉效果

- 在 AgentMessageComponent.vue 中更新了 Markdown 预览的颜色和字体大小,增强了文本的可读性。
- 在 ChatSidebarComponent.vue 中修改了对话列表的内边距和按钮样式,提升了整体界面的美观性和一致性。
This commit is contained in:
Wenjie Zhang 2025-06-25 02:12:29 +08:00
parent 5000afc3ca
commit 5aebc248c3
2 changed files with 18 additions and 14 deletions

View File

@ -479,34 +479,38 @@ const toggleToolCall = (toolCallId) => {
}
.message-md .md-editor-preview-wrapper {
color: var(--gray-900);
max-width: 100%;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Noto Sans SC', 'PingFang SC', 'Noto Sans SC', 'Microsoft YaHei', 'Hiragino Sans GB', 'Source Han Sans CN', 'Courier New', monospace;
#preview-only-preview {
font-size: 15px;
color: var(--gray-900);
}
h1, h2 {
font-size: 1.2rem;
font-size: 16px;
}
h3, h4 {
font-size: 1.1rem;
font-size: 16px;
}
h5, h6 {
font-size: 1rem;
font-size: 15px;
}
// li > p, ol > p, ul > p {
// margin: 0.25rem 0;
// }
strong {
font-weight: 600;
}
// ol, ul {
// padding-left: 1rem;
// }
li > p, ol > p, ul > p {
margin: 0.25rem 0;
}
ol, ul {
padding-left: 1rem;
}
cite {
font-size: 12px;

View File

@ -205,14 +205,14 @@ const toggleCollapse = () => {
}
.conversation-list-top {
padding: 16px;
padding: 10px;
.new-chat-btn {
width: 100%;
padding: 8px 16px;
height: fit-content;
border-radius: 16px;
background-color: var(--gray-300);
border-radius: 8px;
background-color: var(--gray-200);
color: var(--main-color);
border: none;
transition: all 0.2s ease;
@ -233,7 +233,7 @@ const toggleCollapse = () => {
display: flex;
align-items: center;
justify-content: space-between;
padding: 4px 16px;
padding: 4px 0px 4px 12px;
border-radius: 8px;
margin-bottom: 8px;
cursor: pointer;