[dev] use light code block for light theme, more contrast for dark theme

Author: AlexKlimenkov

docusaurus.config.js

@@ -161,8 +161,9 @@ const onAfterDataTransformation = (data) => {
 // @ts-check
 // Note: type annotations allow type checking and IDEs autocompletion
 
-//const lightCodeTheme = require('prism-react-renderer/themes/github');
-//const darkCodeTheme = require('prism-react-renderer/themes/dracula');
+const { themes: prismThemes } = require('prism-react-renderer');
+const lightCodeTheme = prismThemes.github;
+const darkCodeTheme = prismThemes.vsDark;//vsDark
 
 /** @type {import('@docusaurus/types').Config} */
 const config = {
@@ -356,8 +357,9 @@ const config = {
 			]
 		},
     	prism: {
-			//theme: lightCodeTheme,
-			//darkTheme: darkCodeTheme,
+			additionalLanguages: ['csharp', 'php'],
+			theme: lightCodeTheme,
+			darkTheme: darkCodeTheme,
 		}
     })
 };

src/css/custom.css

@@ -25,11 +25,12 @@
   --ifm-list-item-margin: 0.7rem;
 }
 
-/* deprecated from v3.1
+
 html[data-theme=dark] {
   --ifm-color-primary: #26adf7;
+  --ifm-background-color: #111111;
 }
-
+/* deprecated from v3.1
 .docusaurus-highlight-code-line {
   background-color: rgb(210, 213, 214);
   display: block;