style: inline code

tiptiz · Dec 12, 2024 · a66740f · a66740f
1 parent 20657d7
commit a66740f
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 7 deletions.
diff --git a/example/src/styles/editor.scss b/example/src/styles/editor.scss
@@ -27,6 +27,16 @@
     height: 0;
     pointer-events: none;
 }
+// inline code
+.tiptap code.inline-code {
+    background-color: rgba(0, 0, 0, 0.1);
+    padding: 3px 6px;
+    border-radius: 4px;
+}
+.dark .tiptap code.inline-code {
+    background-color: rgb(89, 89, 89);
+}
+
 
 // task modules
 @import url("./editor-styles/table.scss");

diff --git a/example/src/utils/editor.ts b/example/src/utils/editor.ts
@@ -78,13 +78,7 @@ export const extensions: Extensions = [
         types: horizontalTypes
     }),
     Bold.extend({ renderHTML: ({ HTMLAttributes }) => ["b", HTMLAttributes, 0] }),
-    Code.configure(attrs({
-        style: css`
-            padding: 2px 6px;
-            border-radius: 3px;
-            background-color: ${lowContrastBg};
-        `
-    })),
+    Code.configure(attrs({ class: "inline-code" })),
     Sub,
     Sup,
     Link.configure(attrs({