fix(ui): show background when code-block missing languages

anse-app · May 24, 2023 · 3a47e9f · 3a47e9f
1 parent 16a056c
commit 3a47e9f
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 5 deletions.
diff --git a/src/assets/prism.css b/src/assets/prism.css
@@ -24,8 +24,9 @@ html:not(.dark) {
   --prism-json-property: var(--prism-literal);
   --prism-line-number: #aaaaaa;
   --prism-line-highlight-background: #f2f2f2;
-  --prism-block-padding-x: 20px;
-  --prism-block-padding-y: 14px;
+  --prism-block-padding-x: 1.25rem;
+  --prism-block-padding-y: 1.5rem;
+  --prism-block-radius: .375rem;
 }
 
 html.dark {
@@ -55,6 +56,7 @@ html.dark {
   --prism-line-number-gutter: #eeeeee;
   --prism-line-highlight-background: #333333;
   --prism-selection-background: #444444;
-  --prism-block-padding-x: 20px;
-  --prism-block-padding-y: 14px;
+  --prism-block-padding-x: 1.25rem;
+  --prism-block-padding-y: 1.5rem;
+  --prism-block-radius: .375rem;
 }
diff --git a/src/components/Markdown.tsx b/src/components/Markdown.tsx
@@ -21,7 +21,9 @@ const parseMarkdown = (raw: string) => {
     .use(remarkGfm)
     .use(remarkMath)
     .use(remarkRehype)
-    .use(rehypePrism)
+    .use(rehypePrism, {
+      ignoreMissing: true,
+    })
     .use(rehypeKatex)
     .use(rehypeStringify)
     .processSync(raw)

diff --git a/unocss.config.ts b/unocss.config.ts
@@ -38,6 +38,9 @@ export default defineConfig({
           'padding': '0 0.2em',
           'color': 'var(--prism-keyword)',
         },
+        'pre': {
+          'background-color': 'var(--prism-background) !important',
+        },
       },
     }),
   ],