fix(frontend): 修复 Markdown 代码块折叠空白,收起滚回块顶

避免客户端覆盖 SSR 高亮;空行撑高;收起后 scrollIntoView 到代码块头部。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-09-16 05:50:40 +08:00
parent 2056d6a3f9
commit be47b38370
3 changed files with 99 additions and 27 deletions

View File

@@ -1723,6 +1723,14 @@ a.j13-mention-token:hover {
border-radius: 0;
font-size: inherit;
color: inherit;
min-width: 100%;
}
/* rehype-pretty-code grid 行:保证每行有高度,避免折叠/展开后大片空白 */
.prose-content pre code[style*="grid"] > [data-line],
.prose-content .md-code-shiki-host code > .line,
.prose-content .md-code-shiki-host code > [data-line] {
min-height: 1.65em;
line-height: 1.65;
}
.prose-content blockquote {
border-left: 3px solid var(--accent);
@@ -1807,6 +1815,8 @@ a.j13-mention-token:hover {
border-radius: var(--r-sm);
background: var(--panel-2);
overflow: hidden;
/* 收起后 scrollIntoView(start) 时避开 sticky 顶栏 */
scroll-margin-top: 5.5rem;
}
.prose-content .md-code-toolbar {
display: flex;
@@ -1881,10 +1891,10 @@ a.j13-mention-token:hover {
background: var(--accent-soft);
}
/* Shiki 双主题:跟随 html.dark */
/* Shiki 双主题:跟随 html.dark;变量缺省时回退到正文色,避免整块「隐形」 */
.prose-content .shiki,
.prose-content .shiki span {
color: var(--shiki-light);
color: var(--shiki-light, var(--ink));
background-color: transparent !important;
}
.prose-content .shiki {
@@ -1892,7 +1902,7 @@ a.j13-mention-token:hover {
}
html.dark .prose-content .shiki,
html.dark .prose-content .shiki span {
color: var(--shiki-dark) !important;
color: var(--shiki-dark, var(--ink)) !important;
font-style: var(--shiki-dark-font-style) !important;
font-weight: var(--shiki-dark-font-weight) !important;
text-decoration: var(--shiki-dark-text-decoration) !important;