From 956b2d73748ff690718721d2e2e32303e75d5f91 Mon Sep 17 00:00:00 2001 From: xfy Date: Tue, 26 May 2026 18:02:52 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E7=BC=96=E8=BE=91=E5=99=A8?= =?UTF-8?q?=E6=9A=97=E8=89=B2=E4=B8=BB=E9=A2=98=E5=92=8C=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - CSS 暗色主题选择器从 [data-theme="dark"] 改为 .dark - 恢复无序列表圆点（覆盖 Tailwind preflight 重置） - placeholder 改用 :has() 选择器适配 Tiptap v3 Co-Authored-By: Claude Opus 4.7 (1M context) --- libs/tiptap-editor/src/style.css | 40 ++++++++++++++++++-------------- public/tiptap/editor.css | 2 +- 2 files changed, 24 insertions(+), 18 deletions(-) diff --git a/libs/tiptap-editor/src/style.css b/libs/tiptap-editor/src/style.css index fa33b33..954f2f7 100644 --- a/libs/tiptap-editor/src/style.css +++ b/libs/tiptap-editor/src/style.css @@ -23,9 +23,9 @@ outline: none; } -/* Placeholder */ -.tiptap-editor .ProseMirror p.is-editor-empty:first-child::before { - content: attr(data-placeholder); +/* Placeholder - shown when document has only one empty paragraph */ +.tiptap-editor .ProseMirror p:first-child:last-child:has(br.ProseMirror-trailingBreak:only-child)::before { + content: '在此输入内容...'; float: left; color: #999; pointer-events: none; @@ -111,8 +111,14 @@ font-style: italic; } -.tiptap-editor ul, +.tiptap-editor ul { + list-style-type: disc; + margin: 0.6em 0; + padding-left: 2em; +} + .tiptap-editor ol { + list-style-type: decimal; margin: 0.6em 0; padding-left: 2em; } @@ -173,47 +179,47 @@ /* ========== Dark Theme ========== */ -[data-theme="dark"] .tiptap-editor { +.dark .tiptap-editor { color: #dadadb; } -[data-theme="dark"] .tiptap-editor h1, -[data-theme="dark"] .tiptap-editor h2, -[data-theme="dark"] .tiptap-editor h3, -[data-theme="dark"] .tiptap-editor strong { +.dark .tiptap-editor h1, +.dark .tiptap-editor h2, +.dark .tiptap-editor h3, +.dark .tiptap-editor strong { color: #f0f0f0; } -[data-theme="dark"] .tiptap-editor .ProseMirror p.is-editor-empty:first-child::before { +.dark .tiptap-editor .ProseMirror p.is-editor-empty:first-child::before { color: #666; } -[data-theme="dark"] .tiptap-editor code { +.dark .tiptap-editor code { background: #2e2e33; color: #ff7b72; } -[data-theme="dark"] .tiptap-editor pre { +.dark .tiptap-editor pre { background: #2e2e33; } -[data-theme="dark"] .tiptap-editor pre code { +.dark .tiptap-editor pre code { color: #dadadb; } -[data-theme="dark"] .tiptap-editor blockquote { +.dark .tiptap-editor blockquote { border-left-color: #444; color: #9b9c9d; } -[data-theme="dark"] .tiptap-editor hr { +.dark .tiptap-editor hr { border-top-color: #333; } -[data-theme="dark"] .tiptap-editor a { +.dark .tiptap-editor a { color: #58a6ff; } -[data-theme="dark"] .tiptap-editor .ProseMirror ::selection { +.dark .tiptap-editor .ProseMirror ::selection { background: #1c4e80; } diff --git a/public/tiptap/editor.css b/public/tiptap/editor.css index 3290c53..6ee9565 100644 --- a/public/tiptap/editor.css +++ b/public/tiptap/editor.css @@ -1 +1 @@ -.tiptap-editor{position:relative;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.75;color:#2c2c2c;outline:none}.tiptap-editor .ProseMirror{width:100%;height:100%;padding:24px 32px;outline:none;overflow-y:auto}.tiptap-editor .ProseMirror-focused{outline:none}.tiptap-editor .ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);float:left;color:#999;pointer-events:none;height:0}.tiptap-editor h1{font-size:2em;font-weight:700;margin:1.2em 0 .6em;line-height:1.3;color:#1a1a1a}.tiptap-editor h2{font-size:1.5em;font-weight:600;margin:1em 0 .5em;line-height:1.35;color:#1a1a1a}.tiptap-editor h3{font-size:1.25em;font-weight:600;margin:.8em 0 .4em;color:#1a1a1a}.tiptap-editor p{margin:.6em 0}.tiptap-editor p:first-child{margin-top:0}.tiptap-editor strong{font-weight:700;color:#1a1a1a}.tiptap-editor em{font-style:italic}.tiptap-editor s{text-decoration:line-through;opacity:.7}.tiptap-editor code{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,Consolas,monospace;font-size:.875em;background:#f3f3f3;padding:.15em .4em;border-radius:3px;color:#d73a49}.tiptap-editor pre{background:#f6f8fa;border-radius:6px;padding:16px;overflow-x:auto;margin:1em 0}.tiptap-editor pre code{background:none;padding:0;color:#24292e;font-size:.85em;line-height:1.6}.tiptap-editor blockquote{border-left:4px solid #dfe2e5;padding-left:16px;margin:1em 0;color:#6a737d;font-style:italic}.tiptap-editor ul,.tiptap-editor ol{margin:.6em 0;padding-left:2em}.tiptap-editor li{margin:.2em 0}.tiptap-editor li>p{margin:.2em 0}.tiptap-editor hr{border:none;border-top:1px solid #e1e4e8;margin:1.5em 0}.tiptap-editor a{color:#0366d6;text-decoration:none}.tiptap-editor a:hover{text-decoration:underline}.tiptap-editor ul[data-type=taskList]{list-style:none;padding-left:0}.tiptap-editor ul[data-type=taskList] li{display:flex;align-items:flex-start;gap:.5em}.tiptap-editor ul[data-type=taskList] li>label{flex-shrink:0;margin-top:.3em}.tiptap-editor ul[data-type=taskList] li>div{flex:1}.tiptap-editor .ProseMirror ::selection{background:#b4d7ff}.tiptap-editor .ProseMirror-focused .ProseMirror-gapcursor{display:none}[data-theme=dark] .tiptap-editor{color:#dadadb}[data-theme=dark] .tiptap-editor h1,[data-theme=dark] .tiptap-editor h2,[data-theme=dark] .tiptap-editor h3,[data-theme=dark] .tiptap-editor strong{color:#f0f0f0}[data-theme=dark] .tiptap-editor .ProseMirror p.is-editor-empty:first-child:before{color:#666}[data-theme=dark] .tiptap-editor code{background:#2e2e33;color:#ff7b72}[data-theme=dark] .tiptap-editor pre{background:#2e2e33}[data-theme=dark] .tiptap-editor pre code{color:#dadadb}[data-theme=dark] .tiptap-editor blockquote{border-left-color:#444;color:#9b9c9d}[data-theme=dark] .tiptap-editor hr{border-top-color:#333}[data-theme=dark] .tiptap-editor a{color:#58a6ff}[data-theme=dark] .tiptap-editor .ProseMirror ::selection{background:#1c4e80} +.tiptap-editor{position:relative;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.75;color:#2c2c2c;outline:none}.tiptap-editor .ProseMirror{width:100%;height:100%;padding:24px 32px;outline:none;overflow-y:auto}.tiptap-editor .ProseMirror-focused{outline:none}.tiptap-editor .ProseMirror p:first-child:last-child:has(br.ProseMirror-trailingBreak:only-child):before{content:"在此输入内容...";float:left;color:#999;pointer-events:none;height:0}.tiptap-editor h1{font-size:2em;font-weight:700;margin:1.2em 0 .6em;line-height:1.3;color:#1a1a1a}.tiptap-editor h2{font-size:1.5em;font-weight:600;margin:1em 0 .5em;line-height:1.35;color:#1a1a1a}.tiptap-editor h3{font-size:1.25em;font-weight:600;margin:.8em 0 .4em;color:#1a1a1a}.tiptap-editor p{margin:.6em 0}.tiptap-editor p:first-child{margin-top:0}.tiptap-editor strong{font-weight:700;color:#1a1a1a}.tiptap-editor em{font-style:italic}.tiptap-editor s{text-decoration:line-through;opacity:.7}.tiptap-editor code{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,Consolas,monospace;font-size:.875em;background:#f3f3f3;padding:.15em .4em;border-radius:3px;color:#d73a49}.tiptap-editor pre{background:#f6f8fa;border-radius:6px;padding:16px;overflow-x:auto;margin:1em 0}.tiptap-editor pre code{background:none;padding:0;color:#24292e;font-size:.85em;line-height:1.6}.tiptap-editor blockquote{border-left:4px solid #dfe2e5;padding-left:16px;margin:1em 0;color:#6a737d;font-style:italic}.tiptap-editor ul{list-style-type:disc;margin:.6em 0;padding-left:2em}.tiptap-editor ol{list-style-type:decimal;margin:.6em 0;padding-left:2em}.tiptap-editor li{margin:.2em 0}.tiptap-editor li>p{margin:.2em 0}.tiptap-editor hr{border:none;border-top:1px solid #e1e4e8;margin:1.5em 0}.tiptap-editor a{color:#0366d6;text-decoration:none}.tiptap-editor a:hover{text-decoration:underline}.tiptap-editor ul[data-type=taskList]{list-style:none;padding-left:0}.tiptap-editor ul[data-type=taskList] li{display:flex;align-items:flex-start;gap:.5em}.tiptap-editor ul[data-type=taskList] li>label{flex-shrink:0;margin-top:.3em}.tiptap-editor ul[data-type=taskList] li>div{flex:1}.tiptap-editor .ProseMirror ::selection{background:#b4d7ff}.tiptap-editor .ProseMirror-focused .ProseMirror-gapcursor{display:none}.dark .tiptap-editor{color:#dadadb}.dark .tiptap-editor h1,.dark .tiptap-editor h2,.dark .tiptap-editor h3,.dark .tiptap-editor strong{color:#f0f0f0}.dark .tiptap-editor .ProseMirror p.is-editor-empty:first-child:before{color:#666}.dark .tiptap-editor code{background:#2e2e33;color:#ff7b72}.dark .tiptap-editor pre{background:#2e2e33}.dark .tiptap-editor pre code{color:#dadadb}.dark .tiptap-editor blockquote{border-left-color:#444;color:#9b9c9d}.dark .tiptap-editor hr{border-top-color:#333}.dark .tiptap-editor a{color:#58a6ff}.dark .tiptap-editor .ProseMirror ::selection{background:#1c4e80}