Bug fixes

Co-authored-by: Alex Sparkes <turbomarshmello@gmail.com>

src/App.jsx

@@ -47,8 +47,8 @@ export default class App extends React.Component {
     localStorage.setItem('greetingName', '');
 
     // Set theme depending on user preferred
-    //if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) localStorage.setItem('darkTheme', true);
-    //else localStorage.setItem('darkTheme', false);
+    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) localStorage.setItem('darkTheme', true);
+    else localStorage.setItem('darkTheme', false);
     localStorage.setItem('darkTheme', false);
 
     // Finally we set this to true so it doesn't run the function on every load

src/components/Search.jsx

@@ -3,7 +3,7 @@ import React from 'react';
 
 export default class Search extends React.Component {
   render() {
-    const enabled = localStorage.getItem('searchbar');
+    const enabled = localStorage.getItem('searchBar');
     if (enabled === 'false') return (<div></div>);
 
     const searchEngine = localStorage.getItem('searchEngine');

src/components/Settings.jsx

@@ -88,6 +88,12 @@ export default class Settings extends React.Component {
     document.addEventListener('keyup', (event) => {
       if (event.keyCode === 13) this.saveStuff();
     });
+
+    const darkTheme = localStorage.getItem('darkTheme');
+    if (darkTheme === 'true') {
+      document.getElementById('customBackground').style.color = 'white';
+      document.getElementById('greetingName').style.color = 'white';
+    }
   }
 
   render() {

src/scss/modules/_settings.scss

@@ -100,6 +100,7 @@ h4, #engines {
   box-shadow: 20px #000;
   font-size: 1.3em;
   position: relative;
+  font-family: 'Lexend Deca', sans-serif;
 
   &:hover {
     transform: translateY(-0.10em);
@@ -226,4 +227,8 @@ input[type=color] {
     border: none;
     border-radius: 100%;
   }
+}
+
+input[type=checkbox] {
+  vertical-align: middle;
 }