fix code color scheme

frontend/package.json

@@ -18,22 +18,21 @@
     "@types/react-redux": "^7.0.6",
     "@types/react-router": "^4.4.5",
     "@types/react-router-dom": "^4.3.2",
+    "@types/sass": "^1.16.0",
     "autoprefixer": "^9.5.1",
     "enzyme": "^3.9.0",
     "enzyme-adapter-react-16": "^1.12.1",
     "jest": "^24.7.1",
-    "node-sass": "^4.11.0",
     "parcel-bundler": "^1.12.3",
     "postcss-modules": "^1.4.1",
     "redux-devtools-extension": "^2.13.8",
+    "sass": "^1.19.0",
     "ts-jest": "^24.0.2"
   },
   "dependencies": {
     "@blueprintjs/core": "^3.15.1",
     "@blueprintjs/icons": "^3.8.0",
     "highlight.js": "^9.15.6",
-    "http2": "^3.3.7",
-    "rea": "0.0.1",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
     "react-markdown": "^4.0.6",

frontend/src/Documents/CodeBlock.scss

@@ -0,0 +1,5 @@
+@import "../../node_modules/highlight.js/styles/a11y-light";
+
+.bp3-dark {
+    @import "../../node_modules/highlight.js/styles/a11y-dark";
+}

frontend/src/Documents/CodeBlock.tsx

@@ -3,14 +3,11 @@
 import hljs from "highlight.js";
 import * as React from "react";
 
-import * as darkStyle from "highlight.js/styles/a11y-dark.css";
-import * as lightStyle from "highlight.js/styles/a11y-light.css";
+import "./CodeBlock.scss";
 
 export interface ICodeBlockProps {
     value: string;
     language?: string;
-
-    darkMode: boolean;
 }
 
 interface ICodeBlockState {
@@ -29,13 +26,11 @@ export class CodeBlock extends React.PureComponent<
     }
 
     public render() {
-        console.log(darkStyle);
         return (
             <pre>
                 <code
                     ref={this.setRef}
                     className={"lang-" + this.props.language}
-                    style={this.props.darkMode ? darkStyle : lightStyle}
                 >
                     {this.props.value}
                 </code>

frontend/src/Documents/DocumentView.tsx

@@ -18,8 +18,6 @@ export interface IDocumentViewComponentProps extends RouteComponentProps {
     fetching: boolean;
     spinner: boolean;
 
-    darkMode: boolean;
-
     fetchDocs: () => void;
 }
 
@@ -29,7 +27,6 @@ export class DocumentViewComponent extends React.PureComponent<
 > {
     public render() {
         const { id } = this.props.match.params as any;
-        const { darkMode } = this.props;
         if (this.props.allDocs && this.props.allDocs[id]) {
             const doc = this.props.allDocs[id];
             return (
@@ -50,14 +47,7 @@ export class DocumentViewComponent extends React.PureComponent<
                         <Markdown
                             source={doc.content}
                             renderers={{
-                                code: props => {
-                                    return (
-                                        <CodeBlock
-                                            {...props}
-                                            darkMode={darkMode}
-                                        />
-                                    );
-                                },
+                                code: CodeBlock,
                             }}
                         />
                     </div>
@@ -86,8 +76,6 @@ function mapStateToProps(state: IAppState) {
         allDocs: state.docs.all,
         fetching: state.docs.fetching,
         spinner: state.docs.spinner,
-
-        darkMode: state.localSettings.darkMode,
     };
 }
 

package-lock.json

@@ -1598,7 +1598,7 @@
             },
             "doctrine": {
                "version": "1.5.0",
-               "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
+               "resolved": "http://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
                "integrity": "sha1-N53Ocw9hZvds76TmcHoVmwLFpvo=",
                "dev": true,
                "requires": {
@@ -1617,7 +1617,7 @@
             },
             "load-json-file": {
                "version": "2.0.0",
-               "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
+               "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
                "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
                "dev": true,
                "requires": {