docz/docusaurus.config.js

@@ -1,6 +1,28 @@
 // @ts-check
 // Note: type annotations allow type checking and IDEs autocompletion
 
+/** @typedef { import('prism-react-renderer').PrismTheme['styles'] } PrismThemeStyle */
+/** @typedef { import('prism-react-renderer').PrismTheme['styles'][number]['style'] } PrismThemeEntry */
+
+/** 
+  Updates styles array from prisma theme based off token type
+  @type {(theme: PrismThemeStyle, replace: Record<string, PrismThemeEntry>) => PrismThemeStyle} 
+*/
+const updateThemeStyles = (styles, replace) => {
+	const copy = structuredClone(styles) 
+
+	const types = Object.keys(replace)
+	copy.forEach(style => {
+		types.forEach((type) => {
+			if (style.types.includes(type)) {
+				style.style = { ...style.style, ...replace[type]}
+			}
+		})
+	})
+
+	return copy
+}
+
 const lightCodeTheme = require('prism-react-renderer/themes/github');
 const darkCodeTheme = require('prism-react-renderer/themes/dracula');
 
@@ -145,7 +167,19 @@ const config = {
       },
       prism: {
         theme: lightCodeTheme,
-        darkTheme: darkCodeTheme,
+        darkTheme: {
+          // Dracula dark theme by default has keyword and variable font style set to italic
+          // reset to normal to be consistent with the light theme (github)
+          ...darkCodeTheme,
+          styles: updateThemeStyles(/** @type {any} */ (darkCodeTheme.styles), {
+            'keyword': {
+              fontStyle: "normal"
+            },
+            'variable': {
+              fontStyle: "normal"
+            }
+          })
+        },
         additionalLanguages: [ "visual-basic", "swift", "java", "php", "csharp", "perl", "ruby", "cpp", "applescript", "liquid", "rust", "dart", "wolfram", "matlab", "stata", "zig" ],
       },
       liveCodeBlock: {