diff --git a/apps/web/src/lib/wechat-copy.test.mjs b/apps/web/src/lib/wechat-copy.test.mjs index e37048fc..01fb20e1 100644 --- a/apps/web/src/lib/wechat-copy.test.mjs +++ b/apps/web/src/lib/wechat-copy.test.mjs @@ -89,7 +89,7 @@ describe("preparePublishArticle", () => { const root = preparePublishArticle("

重点 Cmd/Ctrl + E

", container); expect(css(root.querySelector("strong"))).toContain("color:#7351CF"); expect(css(root.querySelector("code"))).toContain("color:#3d4450"); - expect(css(root.querySelector("code"))).toContain("background:#f3f5f7"); + expect(css(root.querySelector("code"))).toContain("background:#e9edf1"); } finally { globalThis.getComputedStyle = previous; } @@ -120,7 +120,7 @@ describe("preparePublishArticle", () => { expect(css(root.querySelector("strong"))).toContain("font-weight:800"); const inlineCode = body.querySelector("code"); expect(css(inlineCode)).toContain("color:#3d4450"); - expect(css(inlineCode)).toContain("background:#f3f5f7"); + expect(css(inlineCode)).toContain("background:#e9edf1"); expect(css(root.querySelector("h2"))).toContain("font-weight:600"); expect(css(root.querySelector("h2"))).toContain("color:#27272a"); const [rule, merge] = root.querySelectorAll("hr"); diff --git a/apps/web/src/lib/wechat-copy.ts b/apps/web/src/lib/wechat-copy.ts index 902292f0..b3ce9a30 100644 --- a/apps/web/src/lib/wechat-copy.ts +++ b/apps/web/src/lib/wechat-copy.ts @@ -24,8 +24,7 @@ const PUBLISH_MONO = "'JetBrains Mono', 'Fira Code', ui-monospace, SFMono-Regula const BODY_COLOR = "#27272a"; const QUOTE_COLOR = "#3d4450"; const CODE_COLOR = "#3d4450"; -const CODE_BACKGROUND = "#f3f5f7"; -const CODE_BORDER = "#e1e5ea"; +const CODE_BACKGROUND = "#e9edf1"; const LINK_COLOR = "#404040"; const CHECKED_TASK_COLOR = "#737373"; @@ -81,7 +80,7 @@ const applyLegacyWeChatStyles = ( b: bold, em: "font-style: italic;", del: "text-decoration: line-through;", - code: `padding: 2px 6px; border: 1px solid ${CODE_BORDER}; border-radius: 4px; background: ${CODE_BACKGROUND}; color: ${inlineCodeColor}; font-family: ${PUBLISH_MONO}; font-size: ${codeSize}; font-weight: 550;`, + code: `padding: 1px 4px; border: 0; border-radius: 4px; background: ${CODE_BACKGROUND}; box-shadow: inset 0 0 0 1px rgba(61,68,80,0.08); color: ${inlineCodeColor}; font-family: ${PUBLISH_MONO}; font-size: ${codeSize}; font-weight: 450;`, pre: `margin: 0 0 16px; padding: 14px 16px; overflow: hidden; border: 1px solid #e4e4e4; border-radius: 8px; background: #fafafa; color: #0f172a; font-family: ${PUBLISH_MONO}; font-size: ${codeSize}; line-height: 1.6; text-align: left; white-space: pre-wrap;`, hr: "margin: 24px 0; border: 0; border-top: 1px solid #1a1d21;", table: `width: 100%; margin: 20px 0; border-collapse: collapse; font-size: ${fontSize}; line-height: 1.45;`, diff --git a/apps/web/src/styles/globals.css b/apps/web/src/styles/globals.css index c8bc3bc7..698b685e 100644 --- a/apps/web/src/styles/globals.css +++ b/apps/web/src/styles/globals.css @@ -1722,12 +1722,13 @@ html[data-edgeever-extension-theme] .edgeever-memo-divider { } .ProseMirror code { - border: 1px solid #e1e5ea; + border: 0; border-radius: 4px; - background: #f3f5f7; - padding: 0.12rem 0.38rem; + background: #e9edf1; + box-shadow: inset 0 0 0 1px rgb(61 68 80 / 0.08); + padding: 0.08em 0.28em; font-size: var(--editor-code-font-size, 0.875em); - font-weight: 550; + font-weight: 450; color: #3d4450; font-family: "JetBrains Mono", "Fira Code", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; } @@ -1746,8 +1747,10 @@ html[data-edgeever-extension-theme] .edgeever-memo-divider { .ProseMirror pre code { border: 0; background: transparent; + box-shadow: none; padding: 0; color: inherit; + font-weight: 550; } .ProseMirror .edgeever-code-block, @@ -2499,16 +2502,18 @@ html[data-edgeever-extension-theme] .edgeever-memo-divider { } .markdown-content code { font-family: "JetBrains Mono", "Fira Code", monospace; - background-color: #f2f9f5; - color: #0d5f3a; - border: 1px solid #d4ebdc; - padding: 0.125rem 0.38rem; + background-color: #e9edf1; + box-shadow: inset 0 0 0 1px rgb(61 68 80 / 0.08); + color: #3d4450; + border: 0; + padding: 0.08em 0.28em; border-radius: 4px; font-size: 0.8rem; - font-weight: 550; + font-weight: 450; } .markdown-content pre code { background-color: transparent; + box-shadow: none; border: 0; color: inherit; padding: 0; @@ -2741,11 +2746,17 @@ html[data-edgeever-extension-theme] .edgeever-memo-divider { :root.dark .ProseMirror code, :root.dark .markdown-content code { - border-color: rgb(255 255 255 / 0.12); - background: rgb(255 255 255 / 0.06); + background: rgb(255 255 255 / 0.09); + box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08); color: hsl(var(--foreground)); } +:root.dark .ProseMirror pre code, +:root.dark .markdown-content pre code { + background: transparent; + box-shadow: none; +} + :root.dark .ProseMirror pre, :root.dark .markdown-content pre { border-color: rgb(var(--slate-200-rgb) / 0.8); @@ -2909,9 +2920,3 @@ html[data-edgeever-extension-theme] .edgeever-memo-divider { animation-duration: 0.01ms !important; } } - -:root.dark .markdown-content code { - background-color: rgb(var(--brand-green-rgb) / 0.1); - border-color: rgb(var(--brand-green-rgb) / 0.28); - color: var(--brand-green-text); -}