Merge branch 'feat/overtype-hard' into feat/friendly-playground

Author: nedtwigg

browser-extension/package-lock.json

@@ -2,6 +2,7 @@
   "author": "DiffPlug",
   "dependencies": {
     "@wxt-dev/webextension-polyfill": "^1.0.0",
+    "highlight.js": "^11.11.1",
     "overtype": "^1.2.3",
     "webextension-polyfill": "^0.12.0"
   },

browser-extension/package.json

@@ -102,6 +102,7 @@ export interface OverTypeConstructor {
   getInstance(element: Element): OverTypeInstance | null;
   destroyAll(): void;
   injectStyles(force?: boolean): void;
+  setCodeHighlighter(highlighterFn: (code: string, language: string) => string);
   setTheme(theme: string | Theme, customColors?: Partial<Theme['colors']>): void;
   initGlobalListeners(): void;
   getTheme(name: string): Theme;

browser-extension/src/overtype/overtype.d.ts

@@ -21,8 +21,8 @@ export function generateStyles(options = {}) {
     mobile = {},
   } = options;
 
-  fontFamily = "inherit !important"
-  fontSize = "var(--text-body-size-medium) !important"
+  fontFamily = "inherit";
+  fontSize = "var(--text-body-size-medium)";
 
   // Generate mobile overrides
   const mobileStyles =
@@ -47,6 +47,11 @@ export function generateStyles(options = {}) {
 
   return `
     /* OverType Editor Styles */
+    /* GitHub styles */
+    .overtype-preview pre.code-block {
+      font-family: ${fontFamily} !important;
+      font-size: ${fontSize} !important;
+    }
     
     /* Middle-ground CSS Reset - Prevent parent styles from leaking in */
     .overtype-container * {