aboutsummaryrefslogtreecommitdiff
path: root/ext/bg
diff options
context:
space:
mode:
Diffstat (limited to 'ext/bg')
-rw-r--r--ext/bg/js/options.js1
-rw-r--r--ext/bg/js/settings-popup-preview.js8
-rw-r--r--ext/bg/js/settings.js2
-rw-r--r--ext/bg/settings.html22
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">