Make code blocks use correct theme when in dark mode (#2367)

Co-authored-by: SleeplessOne1917 <insomnia-void@protonmail.com>

src/shared/components/app/app.tsx

@@ -51,7 +51,7 @@ export class App extends Component<any, any> {
             {siteView && (
               <>
                 <Theme defaultTheme={siteView.local_site.default_theme} />
-                <CodeTheme />
+                <CodeTheme defaultTheme={siteView.local_site.default_theme} />
               </>
             )}
             <Navbar siteRes={siteRes} />

src/shared/components/app/code-theme.tsx

@@ -1,22 +1,35 @@
+import { dataBsTheme } from "@utils/browser";
 import { Component } from "inferno";
+import { Helmet } from "inferno-helmet";
+import { UserService } from "../../services";
 
-export class CodeTheme extends Component {
+interface CodeThemeProps {
+  defaultTheme: string;
+}
+
+export class CodeTheme extends Component<CodeThemeProps, any> {
   render() {
+    const user = UserService.Instance.myUserInfo;
+    const userTheme = user?.local_user_view.local_user.theme;
+    const theme =
+      user && userTheme !== "browser" ? userTheme : this.props.defaultTheme;
+
     return (
-      <>
+      <Helmet>
-        <link
+        {dataBsTheme(theme) === "dark" ? (
-          rel="stylesheet"
-          type="text/css"
-          href={`/css/code-themes/atom-one-light.css`}
-          media="(prefers-color-scheme: light)"
-        />
           <link
             rel="stylesheet"
             type="text/css"
             href={`/css/code-themes/atom-one-dark.css`}
-          media="(prefers-color-scheme: no-preference), (prefers-color-scheme: dark)"
           />
-      </>
+        ) : (
+          <link
+            rel="stylesheet"
+            type="text/css"
+            href={`/css/code-themes/atom-one-light.css`}
+          />
+        )}
+      </Helmet>
     );
   }
 }