diff options
author | toasted-nutbread <toasted-nutbread@users.noreply.github.com> | 2019-10-12 17:59:56 -0400 |
---|---|---|
committer | toasted-nutbread <toasted-nutbread@users.noreply.github.com> | 2019-10-12 19:00:24 -0400 |
commit | b086fca69fdbc74a44d31a06203b302493656151 (patch) | |
tree | ec5c2657e67463d3d89dc32b8c0a553d47a1c66d /ext/bg | |
parent | 1da60aae2dcd08dd139abf14ca145510e136ee53 (diff) |
Add separate theme option for outer popup style
Diffstat (limited to 'ext/bg')
-rw-r--r-- | ext/bg/js/options.js | 1 | ||||
-rw-r--r-- | ext/bg/js/settings-popup-preview.js | 8 | ||||
-rw-r--r-- | ext/bg/js/settings.js | 2 | ||||
-rw-r--r-- | ext/bg/settings.html | 22 |
4 files changed, 28 insertions, 5 deletions
diff --git a/ext/bg/js/options.js b/ext/bg/js/options.js index 088945c0..cadc4443 100644 --- a/ext/bg/js/options.js +++ b/ext/bg/js/options.js @@ -277,6 +277,7 @@ function profileOptionsCreateDefaults() { compactGlossaries: false, mainDictionary: '', popupTheme: 'default', + popupOuterTheme: 'default', customPopupCss: '' }, diff --git a/ext/bg/js/settings-popup-preview.js b/ext/bg/js/settings-popup-preview.js index 6f64c240..53a5f1d0 100644 --- a/ext/bg/js/settings-popup-preview.js +++ b/ext/bg/js/settings-popup-preview.js @@ -22,6 +22,7 @@ class SettingsPopupPreview { this.frontend = null; this.apiOptionsGetOld = apiOptionsGet; this.popupShown = false; + this.themeChangeTimeout = null; } static create() { @@ -97,6 +98,13 @@ class SettingsPopupPreview { onThemeDarkCheckboxChanged(node) { document.documentElement.classList.toggle('dark', node.checked); + if (this.themeChangeTimeout !== null) { + clearTimeout(this.themeChangeTimeout); + } + this.themeChangeTimeout = setTimeout(() => { + this.themeChangeTimeout = null; + this.frontend.popup.updateTheme(); + }, 300); } setText(text) { diff --git a/ext/bg/js/settings.js b/ext/bg/js/settings.js index b98754ab..900b89bb 100644 --- a/ext/bg/js/settings.js +++ b/ext/bg/js/settings.js @@ -40,6 +40,7 @@ async function formRead(options) { options.general.popupHorizontalOffset2 = parseInt($('#popup-horizontal-offset2').val(), 0); options.general.popupVerticalOffset2 = parseInt($('#popup-vertical-offset2').val(), 10); options.general.popupTheme = $('#popup-theme').val(); + options.general.popupOuterTheme = $('#popup-outer-theme').val(); options.general.customPopupCss = $('#custom-popup-css').val(); options.audio.enabled = $('#audio-playback-enabled').prop('checked'); @@ -109,6 +110,7 @@ async function formWrite(options) { $('#popup-horizontal-offset2').val(options.general.popupHorizontalOffset2); $('#popup-vertical-offset2').val(options.general.popupVerticalOffset2); $('#popup-theme').val(options.general.popupTheme); + $('#popup-outer-theme').val(options.general.popupOuterTheme); $('#custom-popup-css').val(options.general.customPopupCss); $('#audio-playback-enabled').prop('checked', options.audio.enabled); diff --git a/ext/bg/settings.html b/ext/bg/settings.html index 531c0e86..08e56a09 100644 --- a/ext/bg/settings.html +++ b/ext/bg/settings.html @@ -232,11 +232,23 @@ </div> <div class="form-group"> - <label for="popup-theme">Theme</label> - <select class="form-control" id="popup-theme"> - <option value="default">Light</option> - <option value="dark">Dark</option> - </select> + <div class="row"> + <div class="col-xs-6"> + <label for="popup-theme">Popup theme</label> + <select class="form-control" id="popup-theme"> + <option value="default">Light</option> + <option value="dark">Dark</option> + </select> + </div> + <div class="col-xs-6"> + <label for="popup-outer-theme">Popup shadow theme</label> + <select class="form-control" id="popup-outer-theme"> + <option value="auto">Auto-detect</option> + <option value="default">Light</option> + <option value="dark">Dark</option> + </select> + </div> + </div> </div> <div class="form-group options-advanced"> |