toolbar theme

Author: tylerlong

src/index.css

@@ -60,14 +60,13 @@
   vertical-align: top;
 }
 #about-icon:hover {
-  background-color: #ddd;
+  background-color: #999;
   border-color: #ccc;
   cursor: pointer;
 }
 
 #toolbar {
   padding-left: 3px;
-  color: #666;
 }
 #toolbar .fa {
   padding: 2px 5px;
@@ -79,7 +78,7 @@
 }
 #toolbar .fa:hover,
 #toolbar .icon:hover {
-  background-color: #ddd;
+  background-color: #999;
   border-color: #ccc;
   cursor: pointer;
 }

src/store.ts

@@ -66,6 +66,15 @@ export class Store {
       document.getElementById('dark-theme').setAttribute('disabled', 'true');
     }
 
+    // toolbar theme
+    if (darkTheme) {
+      document.getElementById('toolbar').style.backgroundColor = '#0d1117';
+      document.getElementById('toolbar').style.color = '#f0f6fc';
+    } else {
+      document.getElementById('toolbar').style.backgroundColor = 'white';
+      document.getElementById('toolbar').style.color = '#666';
+    }
+
     // editor font size
     this.editor.dispatch({
       effects: this.editorFontSize.reconfigure(