diff --git a/src/components/modals/Modals.jsx b/src/components/modals/Modals.jsx
index 0c106036..d5ae60e8 100644
--- a/src/components/modals/Modals.jsx
+++ b/src/components/modals/Modals.jsx
@@ -5,7 +5,8 @@ import Navbar from '../widgets/navbar/Navbar';
 
 import Modal from 'react-modal';
 
-// Modals are lazy loaded as the user won't use them every time they open a tab
+// These modals are lazy loaded as the user won't use them every time they open a tab
+// We used to lazy load the main modal, but doing so broke the main modal open animation on first click
 const Welcome = React.lazy(() => import('./welcome/Welcome'));
 const Feedback = React.lazy(() => import('./feedback/Feedback'));
 const renderLoader = () => <></>;
diff --git a/src/components/modals/main/Main.jsx b/src/components/modals/main/Main.jsx
index f326ef30..7f5aab18 100644
--- a/src/components/modals/main/Main.jsx
+++ b/src/components/modals/main/Main.jsx
@@ -4,6 +4,7 @@ import Tabs from './tabs/backend/Tabs';
 
 import './scss/index.scss';
 
+// Lazy load all the tabs instead of the modal itself
 const Settings = React.lazy(() => import('./tabs/Settings'));
 const Addons = React.lazy(() => import('./tabs/Addons'));
 const Marketplace = React.lazy(() => import('./tabs/Marketplace'));
diff --git a/src/components/modals/main/marketplace/Item.jsx b/src/components/modals/main/marketplace/Item.jsx
index 21eea538..d45267f2 100644
--- a/src/components/modals/main/marketplace/Item.jsx
+++ b/src/components/modals/main/marketplace/Item.jsx
@@ -39,7 +39,7 @@ export default function Item(props) {
       <img alt='product' draggable='false' src={iconsrc}/>
       <div className='informationContainer'>
         <h1>{language.overview}</h1>
-        <p className='description' dangerouslySetInnerHTML={{__html: props.data.description}}></p>
+        <p className='description' dangerouslySetInnerHTML={{ __html: props.data.description }}></p>
           <div className='productInformation'>
             <ul>
               {/* <li className='header'>{language.last_updated}</li>
diff --git a/src/components/modals/main/marketplace/sections/Added.jsx b/src/components/modals/main/marketplace/sections/Added.jsx
index 4d180963..f28b8071 100644
--- a/src/components/modals/main/marketplace/sections/Added.jsx
+++ b/src/components/modals/main/marketplace/sections/Added.jsx
@@ -66,7 +66,7 @@ export default class Added extends React.PureComponent {
   }
 
   uninstall() {
-    MarketplaceFunctions.uninstall(this.state.item.display_name, this.state.item.type);
+    MarketplaceFunctions.uninstall(this.state.item.type, this.state.item.display_name);
     
     toast(window.language.toasts.uninstalled);
 
diff --git a/src/components/modals/main/marketplace/sections/Marketplace.jsx b/src/components/modals/main/marketplace/sections/Marketplace.jsx
index f36213bb..46c90a6b 100644
--- a/src/components/modals/main/marketplace/sections/Marketplace.jsx
+++ b/src/components/modals/main/marketplace/sections/Marketplace.jsx
@@ -110,7 +110,7 @@ export default class Marketplace extends React.PureComponent {
     if (type === 'install') {
       MarketplaceFunctions.install(this.state.item.type, this.state.item.data);
     } else {
-      MarketplaceFunctions.uninstall(this.state.item.display_name, this.state.item.type);
+      MarketplaceFunctions.uninstall(this.state.item.type, this.state.item.display_name);
     }
 
     toast(window.language.toasts[type + 'ed']);
diff --git a/src/components/modals/main/scss/index.scss b/src/components/modals/main/scss/index.scss
index 768e128f..e8cb2ce8 100644
--- a/src/components/modals/main/scss/index.scss
+++ b/src/components/modals/main/scss/index.scss
@@ -1,5 +1,4 @@
 @import '../../../../scss/variables';
-@import '../../../../scss/mixins';
 
 @import 'settings/main';
 @import 'settings/buttons';
diff --git a/src/components/modals/main/settings/FileUpload.jsx b/src/components/modals/main/settings/FileUpload.jsx
index 340345a7..600e3b4d 100644
--- a/src/components/modals/main/settings/FileUpload.jsx
+++ b/src/components/modals/main/settings/FileUpload.jsx
@@ -19,7 +19,9 @@ export default class FileUpload extends React.PureComponent {
         reader.readAsDataURL(file);
       }
 
-      reader.addEventListener('load', (e) => this.props.loadFunction(e));
+      reader.addEventListener('load', (e) => {
+        this.props.loadFunction(e);
+      });
     };
   }
 
diff --git a/src/components/modals/main/settings/Slider.jsx b/src/components/modals/main/settings/Slider.jsx
index 372b2982..166d13d2 100644
--- a/src/components/modals/main/settings/Slider.jsx
+++ b/src/components/modals/main/settings/Slider.jsx
@@ -30,7 +30,7 @@ export default class Slider extends React.PureComponent {
       value: this.props.default
     });
 
-    toast(this.language.toasts.reset);
+    toast(window.language.toasts.reset);
     EventBus.dispatch('refresh', this.props.category);
   }
 
diff --git a/src/components/modals/main/settings/Text.jsx b/src/components/modals/main/settings/Text.jsx
index 2566bd5b..0620b492 100644
--- a/src/components/modals/main/settings/Text.jsx
+++ b/src/components/modals/main/settings/Text.jsx
@@ -42,7 +42,7 @@ export default class Text extends React.PureComponent {
       value: this.props.default || ''
     });
 
-    toast(this.language.toasts.reset);
+    toast(window.language.toasts.reset);
     EventBus.dispatch('refresh', this.props.category);
   }
 
diff --git a/src/components/modals/main/settings/sections/About.jsx b/src/components/modals/main/settings/sections/About.jsx
index 3ef3b264..3e059694 100644
--- a/src/components/modals/main/settings/sections/About.jsx
+++ b/src/components/modals/main/settings/sections/About.jsx
@@ -64,7 +64,7 @@ export default class About extends React.PureComponent {
   }
 
   componentDidMount() {
-    if (localStorage.getItem('offlineMode') === 'true') {
+    if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
       this.setState({
         update: this.language.version.offline_mode
       });
diff --git a/src/components/modals/main/settings/sections/Advanced.jsx b/src/components/modals/main/settings/sections/Advanced.jsx
index ed0cfde4..3cfa2a18 100644
--- a/src/components/modals/main/settings/sections/Advanced.jsx
+++ b/src/components/modals/main/settings/sections/Advanced.jsx
@@ -22,9 +22,9 @@ export default class AdvancedSettings extends React.PureComponent {
   settingsImport(e) {
     const content = JSON.parse(e.target.result);
 
-    for (const key of Object.keys(content)) {
+    Object.keys(content).forEach((key) => {
       localStorage.setItem(key, content[key]);
-    }
+    });
 
     toast(window.language.toasts.imported);
   }
diff --git a/src/components/modals/main/settings/sections/Changelog.jsx b/src/components/modals/main/settings/sections/Changelog.jsx
index 010c9d73..342b7c1c 100644
--- a/src/components/modals/main/settings/sections/Changelog.jsx
+++ b/src/components/modals/main/settings/sections/Changelog.jsx
@@ -29,7 +29,7 @@ export default class Changelog extends React.PureComponent {
   }
   
   componentDidMount() {
-    if (localStorage.getItem('offlineMode') === 'true') {
+    if (navigator.onLine || localStorage.getItem('offlineMode') === 'true') {
       return;
     }
   
diff --git a/src/components/modals/main/settings/sections/Order.jsx b/src/components/modals/main/settings/sections/Order.jsx
index d375c5db..fb77b7d5 100644
--- a/src/components/modals/main/settings/sections/Order.jsx
+++ b/src/components/modals/main/settings/sections/Order.jsx
@@ -78,7 +78,7 @@ export default class OrderSettings extends React.PureComponent {
       items: JSON.parse(localStorage.getItem('order'))
     });
 
-    toast(this.language.toasts.reset);
+    toast(window.language.toasts.reset);
   }
 
   componentDidUpdate() {
diff --git a/src/components/modals/main/settings/sections/background/Background.jsx b/src/components/modals/main/settings/sections/background/Background.jsx
index 295ccba1..8890605b 100644
--- a/src/components/modals/main/settings/sections/background/Background.jsx
+++ b/src/components/modals/main/settings/sections/background/Background.jsx
@@ -30,18 +30,12 @@ export default class BackgroundSettings extends React.PureComponent {
     this.setState({
       customBackground: ''
     });
-    toast(this.language.toasts.reset);
+    toast(window.language.toasts.reset);
     EventBus.dispatch('refresh', 'background');
   }
 
   customBackground(e, text) {
-    let result;
-    if (text === true) {
-      result = e.target.value;
-    } else {
-      result = e.target.result;
-    }
-  
+    const result = (text === true) ? e.target.value : e.target.result;
     localStorage.setItem('customBackground', result);
     this.setState({
       customBackground: result
@@ -83,6 +77,10 @@ export default class BackgroundSettings extends React.PureComponent {
   }
 
   componentDidMount() {
+    if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
+      return;
+    }
+
     this.getBackgroundCategories();
   }
 
diff --git a/src/components/widgets/background/Background.jsx b/src/components/widgets/background/Background.jsx
index 8681df64..db3db760 100644
--- a/src/components/widgets/background/Background.jsx
+++ b/src/components/widgets/background/Background.jsx
@@ -1,3 +1,4 @@
+// warning: the code here is fairly messy and probably needs a rewrite
 import React from 'react';
 
 import EventBus from '../../../modules/helpers/eventbus';
diff --git a/src/components/widgets/background/Favourite.jsx b/src/components/widgets/background/Favourite.jsx
index e04aeed3..1a97ca88 100644
--- a/src/components/widgets/background/Favourite.jsx
+++ b/src/components/widgets/background/Favourite.jsx
@@ -32,7 +32,8 @@ export default class Favourite extends React.PureComponent {
   }
 
   render() {
-    if (localStorage.getItem('backgroundType') === 'colour') {
+    const backgroundType = localStorage.getItem('backgroundType');
+    if (backgroundType === 'colour' || backgroundType === 'custom') {
       return null;
     }
 
diff --git a/src/components/widgets/background/Maximise.jsx b/src/components/widgets/background/Maximise.jsx
index 1cb9a497..7752ff09 100644
--- a/src/components/widgets/background/Maximise.jsx
+++ b/src/components/widgets/background/Maximise.jsx
@@ -13,9 +13,10 @@ export default class View extends React.PureComponent {
   }
 
   setAttribute(blur, brightness) {
-    document.querySelector('#backgroundImage').setAttribute(
+    const element = document.getElementById('backgroundImage');
+    element.setAttribute(
       'style',
-      `background-image: url(${document.getElementById('backgroundImage').style.backgroundImage.replace('url("', '').replace('")', '')}); -webkit-filter: blur(${blur}px) brightness(${brightness}%);`
+      `background-image: url(${element.style.backgroundImage.replace('url("', '').replace('")', '')}); -webkit-filter: blur(${blur}px) brightness(${brightness}%);`
     );
   }
 
diff --git a/src/components/widgets/background/scss/_photoinformation.scss b/src/components/widgets/background/scss/_photoinformation.scss
index 9b4b59da..25227da8 100644
--- a/src/components/widgets/background/scss/_photoinformation.scss
+++ b/src/components/widgets/background/scss/_photoinformation.scss
@@ -73,7 +73,8 @@
     border: none;
   }
 
-  &:hover, span {
+  &:hover, 
+  span {
     display: block !important;
   }
 
diff --git a/src/modules/helpers/eventbus.js b/src/modules/helpers/eventbus.js
index 898419bc..e65c3dea 100644
--- a/src/modules/helpers/eventbus.js
+++ b/src/modules/helpers/eventbus.js
@@ -1,6 +1,8 @@
 export default class EventBus {
   static on(event, callback) {
-    document.addEventListener(event, (e) => callback(e.detail));
+    document.addEventListener(event, (e) => {
+      callback(e.detail);
+    });
   }
 
   static dispatch(event, data) {
diff --git a/src/modules/helpers/marketplace.js b/src/modules/helpers/marketplace.js
index e84ca372..188d7944 100644
--- a/src/modules/helpers/marketplace.js
+++ b/src/modules/helpers/marketplace.js
@@ -4,17 +4,19 @@ import EventBus from './eventbus';
 
 export default class MarketplaceFunctions {
   // based on https://stackoverflow.com/questions/37684/how-to-replace-plain-urls-with-links
-  static urlParser (input) {
+  static urlParser(input) {
     const urlPattern = /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()!@:%_+.~#?&//=]*)/;
     return input.replace(urlPattern, '<a href="$&" target="_blank">$&</a>');
   }
 
-  static uninstall(name, type) {
+  static uninstall(type, name) {
     switch (type) {
       case 'settings':
         const oldSettings = JSON.parse(localStorage.getItem('backup_settings'));
         localStorage.clear();
-        oldSettings.forEach((item) => localStorage.setItem(item.name, item.value));
+        oldSettings.forEach((item) => {
+          localStorage.setItem(item.name, item.value);
+        });
         break;
       case 'quote_packs':
         localStorage.removeItem('quote_packs');
@@ -52,15 +54,17 @@ export default class MarketplaceFunctions {
         localStorage.removeItem('backup_settings');
 
         let oldSettings = [];
-        for (const key of Object.keys(localStorage)) {
+        Object.keys(localStorage).forEach((key) => {
           oldSettings.push({
             name: key,
             value: localStorage.getItem(key)
           });
-        }
+        });
 
         localStorage.setItem('backup_settings', JSON.stringify(oldSettings));
-        input.settings.forEach((element) => localStorage.setItem(element.name, element.value));
+        input.settings.forEach((element) => {
+          localStorage.setItem(element.name, element.value);
+        });
         break;
 
       case 'photos':
diff --git a/src/modules/helpers/settings.js b/src/modules/helpers/settings.js
index a7de6ec6..34456875 100644
--- a/src/modules/helpers/settings.js
+++ b/src/modules/helpers/settings.js
@@ -23,10 +23,9 @@ const saveFile = (data, filename = 'file') => {
 export default class SettingsFunctions {
   static exportSettings() {
     let settings = {};
-    for (const key of Object.keys(localStorage)) {
+    Object.keys(localStorage).forEach((key) => {
       settings[key] = localStorage.getItem(key);
-    }
-  
+    });
     saveFile(settings, 'mue-settings.json');
   }
 
@@ -160,15 +159,17 @@ export default class SettingsFunctions {
 `);
   }
 
+  // in a nutshell, this function saves all of the current settings, resets them, sets the defaults and then overrides 
+  // the new settings with the old saved messages where they exist
   static moveSettings() {
     if (Object.keys(localStorage).length === 0) {
       return this.setDefaultSettings();
     }
 
     let settings = {};
-    for (const key of Object.keys(localStorage)) {
+    Object.keys(localStorage).forEach((key) => {
       settings[key] = localStorage.getItem(key);
-    }
+    });
 
     localStorage.clear();
 
diff --git a/src/scss/index.scss b/src/scss/index.scss
index 66b39aa6..c17a4ddc 100644
--- a/src/scss/index.scss
+++ b/src/scss/index.scss
@@ -1,5 +1,4 @@
 @import 'variables';
-@import 'mixins';
 @import 'themes';
 
 @import 'modules/toast';