Files
AIEC-new/AIEC-server/css/compact-mode.css
2025-10-17 09:31:28 +08:00

266 lines
5.7 KiB
CSS

/* ===== 超紧凑模式 - 彻底移除所有多余空白 ===== */
/* 1. 全局移除所有br标签 - 最高优先级 */
br {
display: none !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
line-height: 0 !important;
visibility: hidden !important;
font-size: 0 !important;
}
/* 2. 针对消息内容中的br标签 - 额外确保 */
.message br,
.message-item br,
.ai-message br,
.user-message br,
#chatMessages br,
[class*="message"] br {
display: none !important;
}
/* 3. 列表间距 - 列表块上下有适当间距 */
.message ul,
.message ol,
.message-item ul,
.message-item ol,
.ai-message ul,
.ai-message ol,
.user-message ul,
.user-message ol,
#chatMessages ul,
#chatMessages ol {
margin: 0.8em 0 !important;
padding: 0 !important;
padding-left: 1.2em !important;
list-style-position: outside !important;
}
/* 4. 列表项内部紧凑但有适当行高 */
.message li,
.message-item li,
.ai-message li,
.user-message li,
#chatMessages li,
[class*="message"] li {
margin: 0.2em 0 !important;
padding: 0 !important;
line-height: 1.5 !important;
display: list-item !important;
}
/* 5. 列表项之间的适当间距 */
.message li + li,
.ai-message li + li,
.user-message li + li,
#chatMessages li + li {
margin-top: 0.3em !important;
padding-top: 0 !important;
}
/* 6. 列表项内的所有内容紧凑 */
.message li *,
.ai-message li *,
.user-message li *,
#chatMessages li * {
margin: 0 !important;
padding: 0 !important;
line-height: inherit !important;
}
/* 7. 列表项内的段落内联显示 */
.message li p,
.ai-message li p,
.user-message li p,
#chatMessages li p {
display: inline !important;
margin: 0 !important;
padding: 0 !important;
}
/* 8. 处理strong标签 */
.message li strong,
.ai-message li strong,
.user-message li strong,
#chatMessages li strong {
display: inline !important;
margin: 0 !important;
padding: 0 !important;
font-weight: 600;
}
/* 9. 标题间距 - 增加标题上下间距 */
.message h1, .message h2, .message h3, .message h4, .message h5, .message h6,
.ai-message h1, .ai-message h2, .ai-message h3, .ai-message h4, .ai-message h5, .ai-message h6,
.user-message h1, .user-message h2, .user-message h3, .user-message h4, .user-message h5, .user-message h6,
#chatMessages h1, #chatMessages h2, #chatMessages h3, #chatMessages h4, #chatMessages h5, #chatMessages h6 {
margin: 1em 0 0.5em !important;
line-height: 1.3 !important;
font-weight: 600;
}
/* 10. 段落间距 - 增加段落之间的间距 */
.message p,
.ai-message p,
.user-message p,
#chatMessages p {
margin: 0.8em 0 !important;
line-height: 1.5 !important;
}
/* 11. 连续段落适当间距 */
.message p + p,
.ai-message p + p,
.user-message p + p,
#chatMessages p + p {
margin-top: 0.5em !important;
}
/* 12. 移除空元素 */
.message p:empty,
.message div:empty,
.ai-message p:empty,
.ai-message div:empty,
.user-message p:empty,
.user-message div:empty,
#chatMessages p:empty,
#chatMessages div:empty {
display: none !important;
}
/* 13. 移除所有默认的块级间距 */
.message *,
.ai-message *,
.user-message *,
#chatMessages * {
margin-block-start: 0 !important;
margin-block-end: 0 !important;
}
/* 14. 处理嵌套列表 */
.message li ul,
.message li ol,
.ai-message li ul,
.ai-message li ol,
.user-message li ul,
.user-message li ol,
#chatMessages li ul,
#chatMessages li ol {
margin: 0 !important;
padding-left: 1em !important;
}
/* 15. 代码块紧凑 */
.message pre,
.ai-message pre,
.user-message pre,
#chatMessages pre {
margin: 0.3em 0 !important;
}
.message code,
.ai-message code,
.user-message code,
#chatMessages code {
padding: 0.1em 0.2em !important;
margin: 0 !important;
}
/* 16. 引用块紧凑 */
.message blockquote,
.ai-message blockquote,
.user-message blockquote,
#chatMessages blockquote {
margin: 0.3em 0 !important;
padding-left: 0.8em !important;
}
/* 17. 最高优先级覆盖 - 使用body选择器增加权重 */
body .message br,
body .ai-message br,
body .user-message br,
body #chatMessages br {
display: none !important;
height: 0 !important;
line-height: 0 !important;
}
body .message li,
body .ai-message li,
body .user-message li,
body #chatMessages li {
margin: 0.2em 0 !important;
padding: 0 !important;
line-height: 1.5 !important;
}
body .message ul,
body .message ol,
body .ai-message ul,
body .user-message ul,
body .ai-message ol,
body .user-message ol,
body #chatMessages ul,
body #chatMessages ol {
margin: 0.8em 0 !important;
padding-left: 1.2em !important;
}
/* 18. 使用ID选择器增加权重 */
#chatMessages .message li,
#chatMessages .ai-message li,
#chatMessages .user-message li {
margin: 0.2em 0 !important;
padding: 0 !important;
line-height: 1.5 !important;
}
/* 19. 处理可能的伪元素 */
.message li::before,
.ai-message li::before,
.user-message li::before,
#chatMessages li::before {
margin-right: 0.3em !important;
}
.message li::after,
.ai-message li::after,
.user-message li::after,
#chatMessages li::after {
content: none !important;
}
/* 20. 内联元素确保无换行 */
.message span,
.message em,
.message strong,
.message code,
.ai-message span,
.ai-message em,
.ai-message strong,
.ai-message code,
.user-message span,
.user-message em,
.user-message strong,
.user-message code {
display: inline !important;
margin: 0 !important;
padding: 0 0.1em !important;
}
/* 21. 调试模式 - 可临时启用查看实际渲染 */
/*
.message li,
.ai-message li,
.user-message li {
border: 1px solid red !important;
}
.message li *,
.ai-message li *,
.user-message li * {
border: 1px solid blue !important;
}
*/