diff --git a/src/css/options/body.css b/src/css/options/body.css index 770f4bb..6643b79 100644 --- a/src/css/options/body.css +++ b/src/css/options/body.css @@ -48,9 +48,9 @@ z-index: 11; - color: white; - background-color: rgba(50, 50, 50, 0.6); - box-shadow: 0px 0px .5px .5px rgba(0, 0, 0, 0.45); + color: var(--body-background-color); + background-color: var(--body-color); + box-shadow: 0px 0px .5px .5px var(--box-shadow-color); border: 1px solid rgba(0, 0, 0, 0.45);; border-radius: 99px; @@ -66,7 +66,7 @@ } #status_message { - color: white; + color: var(--body-background-color); } /* Import modal */ @@ -83,6 +83,10 @@ display: flex; } +#import_container, #import_container * { + color: var(--body-color); +} + #import_container { height: fit-content; width: min(50vw, 350px); @@ -94,10 +98,10 @@ text-align: center; - background-color: white; - box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.5); + background-color: var(--body-background-color); + box-shadow: 0px 0px .5px .5px var(--box-shadow-color); - border: 1px solid rgba(0, 0, 0, 0.45); + border: 1px solid var(--box-shadow-color); border-radius: 2px; display: flex; @@ -109,10 +113,12 @@ #import_container input { width: min(75%, 200px); padding: 2px 7px; + color: black; } #import_container button { width: fit-content; padding: 2px 7px; + color: black; } diff --git a/src/js/background/main.js b/src/js/background/main.js index a626d8e..39a0b79 100644 --- a/src/js/background/main.js +++ b/src/js/background/main.js @@ -19,6 +19,8 @@ browser.runtime.onMessage.addListener((data, sender) => { browser.browserAction.setIcon(inactiveIcons); } + // Save settings. (for initial load) + browser.storage.local.set(settings); }); } diff --git a/src/js/options/settings-menu.js b/src/js/options/settings-menu.js index fd438e6..71ffbd5 100644 --- a/src/js/options/settings-menu.js +++ b/src/js/options/settings-menu.js @@ -127,7 +127,9 @@ function settingsObjToStr(settings) { const getId = id => idToShortId[id]; const getVal = val => val === true ? 't' : 'f'; - const str = Object.entries(settings).map(([id, val]) => `${getId(id)}${delimiter1}${getVal(val)}`).join(delimiter2); + const str = Object.entries(settings). + filter(([id, val]) => getId(id)). + map(([id, val]) => `${getId(id)}${delimiter1}${getVal(val)}`).join(delimiter2); return prefix + str; }