diff --git a/renderer/.stylelintrc b/renderer/.stylelintrc
index 0307f024..26202b3e 100644
--- a/renderer/.stylelintrc
+++ b/renderer/.stylelintrc
@@ -5,6 +5,8 @@
   "rules": {
     "indentation": [4, {"except": ["value"], "severity": "warning"}],
     "selector-type-case": ["lower", {"ignoreTypes": ["foreignObject"]}],
+    "color-hex-length": "long",
+    "color-hex-case": "upper",
     "no-missing-end-of-source-newline": null
   }
 }
\ No newline at end of file
diff --git a/renderer/package-lock.json b/renderer/package-lock.json
index f3eb2740..3b04e55a 100644
--- a/renderer/package-lock.json
+++ b/renderer/package-lock.json
@@ -5373,9 +5373,9 @@
       "dev": true
     },
     "nanoid": {
-      "version": "3.1.23",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz",
-      "integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.2.0.tgz",
+      "integrity": "sha512-fmsZYa9lpn69Ad5eDn7FMcnnSR+8R34W9qJEijxYhTbfOWzr22n1QxCMzXLK+ODyW2973V3Fux959iQoUxzUIA==",
       "dev": true
     },
     "nanomatch": {
diff --git a/renderer/src/modules/editor.js b/renderer/src/modules/editor.js
index 94f8618d..3fb2ca7b 100644
--- a/renderer/src/modules/editor.js
+++ b/renderer/src/modules/editor.js
@@ -3,7 +3,7 @@ import DOMManager from "./dommanager";
 export default new class Editor {
 
     async initialize() {
-        const baseUrl = "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.20.0/min"
+        const baseUrl = "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.20.0/min";
 
         Object.defineProperty(window, "MonacoEnvironment", {
             value: {
diff --git a/renderer/src/modules/pluginapi.js b/renderer/src/modules/pluginapi.js
index b490f0eb..2d01784c 100644
--- a/renderer/src/modules/pluginapi.js
+++ b/renderer/src/modules/pluginapi.js
@@ -177,44 +177,6 @@ BdApi.deleteData = function(pluginName, key) {
 };
 
 // Patches other functions
-// BdApi.monkeyPatch = function(what, methodName, options) {
-//     const {before, after, instead, once = false, silent = false, force = false} = options;
-//     const displayName = options.displayName || what.displayName || what.name || what.constructor.displayName || what.constructor.name;
-//     if (!silent) console.log("patch", methodName, "of", displayName); // eslint-disable-line no-console
-//     if (!what[methodName]) {
-//         if (force) what[methodName] = function() {};
-//         else return console.error(methodName, "does not exist for", displayName); // eslint-disable-line no-console
-//     }
-//     const origMethod = what[methodName];
-//     const cancel = () => {
-//         if (!silent) console.log("unpatch", methodName, "of", displayName); // eslint-disable-line no-console
-//         what[methodName] = origMethod;
-//     };
-//     what[methodName] = function() {
-//         const data = {
-//             thisObject: this,
-//             methodArguments: arguments,
-//             cancelPatch: cancel,
-//             originalMethod: origMethod,
-//             callOriginalMethod: () => data.returnValue = data.originalMethod.apply(data.thisObject, data.methodArguments)
-//         };
-//         if (instead) {
-//             const tempRet = Utilities.suppressErrors(instead, "`instead` callback of " + what[methodName].displayName)(data);
-//             if (tempRet !== undefined) data.returnValue = tempRet;
-//         }
-//         else {
-//             if (before) Utilities.suppressErrors(before, "`before` callback of " + what[methodName].displayName)(data);
-//             data.callOriginalMethod();
-//             if (after) Utilities.suppressErrors(after, "`after` callback of " + what[methodName].displayName)(data);
-//         }
-//         if (once) cancel();
-//         return data.returnValue;
-//     };
-//     what[methodName].__monkeyPatched = true;
-//     if (!what[methodName].__originalMethod) what[methodName].__originalMethod = origMethod;
-//     what[methodName].displayName = "patched " + (what[methodName].displayName || methodName);
-//     return cancel;
-// };
 BdApi.monkeyPatch = function(what, methodName, options) {
     const {before, after, instead, once = false, callerId = "BdApi"} = options;
     const patchType = before ? "before" : after ? "after" : instead ? "instead" : "";
@@ -234,7 +196,7 @@ BdApi.monkeyPatch = function(what, methodName, options) {
             return patchReturn;
         }
         catch (err) {
-            Logger.err(`${callerId}:monkeyPatch`, `Error in the ${patchType} of ${methodName}`);
+            Logger.stacktrace(`${callerId}:monkeyPatch`, `Error in the ${patchType} of ${methodName}`, err);
         }
     });
     return data.cancelPatch;
diff --git a/renderer/src/modules/webpackmodules.js b/renderer/src/modules/webpackmodules.js
index 8b44b877..86abe95e 100644
--- a/renderer/src/modules/webpackmodules.js
+++ b/renderer/src/modules/webpackmodules.js
@@ -250,12 +250,13 @@ export default class WebpackModules {
     static get require() {
         if (this._require) return this._require;
         const id = "bd-webpackmodules";
-        let __webpack_require__ = undefined;
-        if (typeof (webpackJsonp) !== "undefined") {
+        let __webpack_require__;
+        if (typeof(webpackJsonp) !== "undefined") {
             __webpack_require__ = window.webpackJsonp.push([[], {
                 [id]: (module, exports, __internal_require__) => module.exports = __internal_require__
             }, [[id]]]);
-        } else if (typeof (window[this.chunkName]) !== "undefined") {
+        }
+        else if (typeof(window[this.chunkName]) !== "undefined") {
             window[this.chunkName].push([[id], 
                 {},
                 __internal_require__ => __webpack_require__ = __internal_require__
diff --git a/renderer/src/styles/builtins/publicservers.css b/renderer/src/styles/builtins/publicservers.css
index 30133bd1..38f806bb 100644
--- a/renderer/src/styles/builtins/publicservers.css
+++ b/renderer/src/styles/builtins/publicservers.css
@@ -29,8 +29,8 @@
 }
 
 #bd-pub-button:hover {
-    color: #fff;
-    background-color: #3e82e5;
+    color: #FFFFFF;
+    background-color: #3E82E5;
 }
 
 #bd-connection {
@@ -38,7 +38,7 @@
 }
 
 .bd-footnote {
-    color: #b9bbbe;
+    color: #B9BBBE;
     font-size: 11px;
 }
 
@@ -204,7 +204,7 @@
 }
 
 .bd-server-count-dot {
-    background-color: #43b581;
+    background-color: #43B581;
     border-radius: 50%;
     width: 8px;
     height: 8px;
@@ -213,7 +213,7 @@
 }
 
 .bd-server-count + .bd-server-count .bd-server-count-dot {
-    background-color: #b9bbbe;
+    background-color: #B9BBBE;
 }
 
 .bd-server-count-text {
@@ -235,8 +235,8 @@
     padding: 0 4px;
     margin-top: 1px;
     border-radius: 3px;
-    background: #3e82e5;
-    color: #fff;
+    background: #3E82E5;
+    color: #FFFFFF;
 }
 
 .bd-pagination {
diff --git a/renderer/src/styles/buttons.css b/renderer/src/styles/buttons.css
index 46cc8949..eb06877f 100644
--- a/renderer/src/styles/buttons.css
+++ b/renderer/src/styles/buttons.css
@@ -2,27 +2,27 @@
     display: inline-flex;
     justify-content: center;
     align-items: center;
-    background-color: #3e82e5;
-    color: #fff;
+    background-color: #3E82E5;
+    color: #FFFFFF;
     border-radius: 3px;
     padding: 4px 8px;
     transition: background-color 0.17s ease, color 0.17s ease, opacity 250ms ease;
 }
 
 .bd-button:hover {
-    background-color: #3875ce;
+    background-color: #3875CE;
 }
 
 .bd-button:active {
-    background-color: #3268b7;
+    background-color: #3268B7;
 }
 
 .bd-button.bd-button-success {
-    background-color: #43b581;
+    background-color: #43B581;
 }
 
 .bd-button.bd-button-success:hover {
-    background-color: #3ca374;
+    background-color: #3CA374;
 }
 
 .bd-button.bd-button-success:active {
@@ -30,27 +30,27 @@
 }
 
 .bd-button.bd-button-warning {
-    background-color: #faa61a;
+    background-color: #FAA61A;
 }
 
 .bd-button.bd-button-warning:hover {
-    background-color: #e19517;
+    background-color: #E19517;
 }
 
 .bd-button.bd-button-warning:active {
-    background-color: #c88515;
+    background-color: #C88515;
 }
 
 .bd-button.bd-button-danger {
-    background-color: #f04747;
+    background-color: #F04747;
 }
 
 .bd-button.bd-button-danger:hover {
-    background-color: #d84040;
+    background-color: #D84040;
 }
 
 .bd-button.bd-button-danger:active {
-    background-color: #c03939;
+    background-color: #C03939;
 }
 
 .bd-button-disabled {
diff --git a/renderer/src/styles/spinner.css b/renderer/src/styles/spinner.css
index a0c502a5..6188d04b 100644
--- a/renderer/src/styles/spinner.css
+++ b/renderer/src/styles/spinner.css
@@ -6,7 +6,7 @@
 
 .bd-cube1,
 .bd-cube2 {
-    background-color: #3e82e5;
+    background-color: #3E82E5;
     width: 10px;
     height: 10px;
     position: absolute;
diff --git a/renderer/src/styles/ui/addonlist.css b/renderer/src/styles/ui/addonlist.css
index 5ddbaf22..3ded72ad 100644
--- a/renderer/src/styles/ui/addonlist.css
+++ b/renderer/src/styles/ui/addonlist.css
@@ -1,11 +1,11 @@
 .bd-reload {
     cursor: pointer;
     vertical-align: top;
-    fill: #dcddde;
+    fill: #DCDDDE;
 }
 
 .bd-reload:hover {
-    fill: #fff;
+    fill: #FFFFFF;
 }
 
 .bd-reload-header {
@@ -156,7 +156,7 @@
 }
 
 .bd-controls > .bd-addon-button svg {
-    fill: #fff;
+    fill: #FFFFFF;
 }
 
 .bd-controls > .bd-addon-button:first-of-type {
@@ -214,7 +214,7 @@
 }
 
 .bd-addon-modal-footer .bd-button {
-    background-color: #3e82e5;
+    background-color: #3E82E5;
 }
 
 .bd-addon-modal-footer .bd-button:hover {
@@ -240,7 +240,7 @@
 }
 
 .bd-addon-views .bd-view-button.selected svg {
-    fill: #fff;
+    fill: #FFFFFF;
 }
 
 .bd-addon-views .bd-view-button:hover {
@@ -252,7 +252,7 @@
 }
 
 .bd-addon-views .bd-view-button.selected {
-    background-color: #3e82e5;
+    background-color: #3E82E5;
 }
 
 .bd-addon-views .bd-view-button + .bd-view-button {
diff --git a/renderer/src/styles/ui/bdsettings.css b/renderer/src/styles/ui/bdsettings.css
index 6605c35f..a0a05100 100644
--- a/renderer/src/styles/ui/bdsettings.css
+++ b/renderer/src/styles/ui/bdsettings.css
@@ -1,9 +1,9 @@
 .theme-dark .bd-social-logo path {
-    fill: #adadad;
+    fill: #ADADAD;
 }
 
 .theme-light .bd-social-logo path {
-    fill: #b9bbbe;
+    fill: #B9BBBE;
 }
 
 .bd-social-link:hover .bd-social-logo {
@@ -11,7 +11,7 @@
 }
 
 .bd-social-link:hover .bd-social-logo path:first-of-type {
-    fill: #3e82e5;
+    fill: #3E82E5;
 }
 
 .bd-button-title {
@@ -160,6 +160,19 @@
     overflow: visible;
 }
 
+.bd-settings-title {
+    color: #FFFFFF;
+    font-weight: 600;
+    cursor: default;
+    flex: 1;
+}
+
+.bd-settings-title:not(.bd-settings-group-title) {
+    margin-bottom: 20px;
+    font-size: 20px;
+    line-height: 24px;
+}
+
 .bd-settings-group.collapsible .bd-settings-title {
     display: flex;
     justify-content: space-between;
@@ -204,19 +217,6 @@
     margin-top: 0;
 }
 
-.bd-settings-title {
-    color: #ffffff;
-    font-weight: 600;
-    cursor: default;
-    flex: 1;
-}
-
-.bd-settings-title:not(.bd-settings-group-title) {
-    margin-bottom: 20px;
-    font-size: 20px;
-    line-height: 24px;
-}
-
 .bd-settings-title.bd-settings-group-title {
     margin-bottom: 10px;
     text-transform: uppercase;
diff --git a/renderer/src/styles/ui/floatingwindow.css b/renderer/src/styles/ui/floatingwindow.css
index 75a8db31..d4bde3f5 100644
--- a/renderer/src/styles/ui/floatingwindow.css
+++ b/renderer/src/styles/ui/floatingwindow.css
@@ -38,7 +38,7 @@
     display: flex;
     justify-content: space-between;
     align-items: center;
-    color: #fff;
+    color: #FFFFFF;
     background: var(--background-tertiary); /* #2F3129background-color: #202225; */
 }
 
@@ -46,7 +46,7 @@
     display: flex;
     flex-direction: column;
     background: var(--background-secondary);
-    color: #fff;
+    color: #FFFFFF;
     flex: 1;
     overflow: hidden;
 }
@@ -88,8 +88,8 @@
 }
 
 .floating-window-buttons .close-button:hover {
-    background: #f04747;
-    color: #fff;
+    background: #F04747;
+    color: #FFFFFF;
 }
 
 .floating-window-content #bd-editor-panel {
diff --git a/renderer/src/styles/ui/notices.css b/renderer/src/styles/ui/notices.css
index a12c7a45..d67f69e4 100644
--- a/renderer/src/styles/ui/notices.css
+++ b/renderer/src/styles/ui/notices.css
@@ -1,5 +1,5 @@
 .bd-notice-success {
-    --color: #3ba55d;
+    --color: #3BA55D;
 }
 
 .bd-notice-error {
@@ -40,7 +40,7 @@
     flex-shrink: 0;
     flex-grow: 0;
     box-shadow: var(--elevation-low);
-    color: #fff;
+    color: #FFFFFF;
     background: var(--color, var(--brand-experiment-600, #3C45A5));
 }
 
@@ -57,8 +57,8 @@
     background: url(https://discord.com/assets/7731c77d99babca1a8faec204d98c380.svg) no-repeat;
     background-position: 50% 55%;
     background-size: 10px 10px;
-    opacity: .5;
-    transition: opacity .2s;
+    opacity: 0.5;
+    transition: opacity 0.2s;
     cursor: pointer;
     -webkit-app-region: no-drag;
 }
@@ -69,7 +69,7 @@
     position: relative;
     top: 6px;
     border: 1px solid;
-    color: #fff;
+    color: #FFFFFF;
     border-radius: 3px;
     height: 24px;
     padding: 0 10px;
@@ -78,15 +78,15 @@
     vertical-align: top;
     margin-left: 10px;
     line-height: 22px;
-    transition: background-color .2s ease,color .2s ease,border-color .2s ease;
+    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
     -webkit-app-region: no-drag;
-    border-color: #fff;
+    border-color: #FFFFFF;
     background: transparent;
 }
 
 .bd-notice-button:hover {
     color: var(--color, var(--background-mobile-primary));
-    background: #fff;
+    background: #FFFFFF;
 }
 
 .bd-notice-close:hover {
diff --git a/renderer/src/styles/ui/toasts.css b/renderer/src/styles/ui/toasts.css
index 023879f3..e65bd44d 100644
--- a/renderer/src/styles/ui/toasts.css
+++ b/renderer/src/styles/ui/toasts.css
@@ -45,7 +45,7 @@
 .bd-toast.toast-error,
 .bd-toast.toast-warning,
 .bd-toast.toast-warn {
-    color: #fff;
+    color: #FFFFFF;
 }
 
 .bd-toast.closing {
@@ -63,7 +63,7 @@
 }
 
 .bd-toast.toast-info {
-    background-color: #4a90e2;
+    background-color: #4A90E2;
 }
 
 .bd-toast.toast-info.icon {
@@ -71,7 +71,7 @@
 }
 
 .bd-toast.toast-success {
-    background-color: #43b581;
+    background-color: #43B581;
 }
 
 .bd-toast.toast-success.icon {
@@ -80,7 +80,7 @@
 
 .bd-toast.toast-danger,
 .bd-toast.toast-error {
-    background-color: #f04747;
+    background-color: #F04747;
 }
 
 .bd-toast.toast-danger.icon,
@@ -90,7 +90,7 @@
 
 .bd-toast.toast-warning,
 .bd-toast.toast-warn {
-    background-color: #ffa600;
+    background-color: #FFA600;
 }
 
 .bd-toast.toast-warning.icon,
diff --git a/renderer/src/ui/draganddrop.js b/renderer/src/ui/draganddrop.js
index 40097064..d1e9061c 100644
--- a/renderer/src/ui/draganddrop.js
+++ b/renderer/src/ui/draganddrop.js
@@ -23,7 +23,7 @@
     flex-direction: column;
     justify-content: center;
     align-items: center;
-    background: #3e82e5;
+    background: #3E82E5;
     padding: 20px;
     border-radius: 20px;
 }