feat: add CSS variables for markup diff tokens (#698)

shikijs · Jun 11, 2024 · 84c0b53 · 84c0b53
1 parent 724b410
commit 84c0b53
Showing 1 changed file with 30 additions and 0 deletions.
diff --git a/packages/shiki/src/theme-css-variables.ts b/packages/shiki/src/theme-css-variables.ts
@@ -231,6 +231,36 @@ export function createCssVariablesTheme(options: CssVariablesThemeOptions = {}):
           foreground: variable('token-keyword'),
         },
       },
+      {
+        // [Custom] Diff
+        scope: [
+          'markup.inserted',
+          'meta.diff.header.to-file',
+          'punctuation.definition.inserted',
+        ],
+        settings: {
+          foreground: variable('token-inserted'),
+        },
+      },
+      {
+        scope: [
+          'markup.deleted',
+          'meta.diff.header.from-file',
+          'punctuation.definition.deleted',
+        ],
+        settings: {
+          foreground: variable('token-deleted'),
+        },
+      },
+      {
+        scope: [
+          'markup.changed',
+          'punctuation.definition.changed',
+        ],
+        settings: {
+          foreground: variable('token-changed'),
+        },
+      },
     ],
   }