Fix theming and fix theme switcher bug (#14)

* Fix theming and fix theme switcher bug

* Fix css comment and remove old js

themes/gokarna/static/css/dark.css

@@ -1,10 +1,13 @@
 html {
-  background: #171717 !important;
-  color: white !important;
+  background: #121212 !important;
+  color: #e2e2e2 !important;
 }
-.header {
-  background-color: #1b1c1d !important;
-  color: white !important;
+
+.header,
+code,
+pre {
+  background-color: #1f1f1f !important;
+  color: #e2e2e2 !important;
 }
 
 /* TODO: Check if this is needed or not */

themes/gokarna/static/css/main.css

@@ -6,7 +6,8 @@ html {
 
 /* HEADER */
 .header {
-  background-color: #bbb;
+  background-color: rgb(238, 238, 238);
+  box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 2px 0px;
   color: black;
   height: 70px;
   left: 0;
@@ -86,6 +87,7 @@ html {
   cursor: pointer;
 }
 
+/** COMMON **/
 /* TAGS */
 .post-tags {
   list-style-type: none;
@@ -105,6 +107,24 @@ html {
   text-decoration: none;
 }
 
+/* CODE BLOCKS */
+code,
+pre {
+  background-color: #eee !important;
+  box-sizing: border-box;
+}
+
+pre {
+  font-size: 0.95rem;
+  padding: 20px;
+}
+
+code {
+  box-decoration-break: clone;
+  padding: 0 3px;
+  word-wrap: break-word;
+}
+
 /* SINGLE */
 #content {
   width: 810px;

themes/gokarna/static/js/main.js

@@ -12,9 +12,8 @@ function ready() {
     toggleIcon = document.querySelector('#dark-theme-toggle span');
     darkThemeCss = document.getElementById("dark-theme");
 
-    // TODO: Fetch programatically by user's system preference
     const savedTheme = localStorage.getItem(THEME_PREF_STORAGE_KEY) || 
-        window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark': 'light';
+        (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark': 'light');
     setTheme(savedTheme);
     document.getElementById('dark-theme-toggle').addEventListener('click', () => {
         if (toggleIcon.className === THEME_TO_ICON_CLASS.dark) {