diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json index a9a18a7..3d42b62 100644 --- a/src/_locales/en/messages.json +++ b/src/_locales/en/messages.json @@ -225,6 +225,9 @@ "Import_accesskey": { "message": "I" }, + "OptIncognitoPerm": { + "message": "Enable setting permanent permissions in incognito/private tabs.\nBEWARE: doing this can leak site information!" + }, "KeepLocked": { "message": "Keep this element locked (recommended)" }, diff --git a/src/ui/options.css b/src/ui/options.css index 4653786..b70f22a 100644 --- a/src/ui/options.css +++ b/src/ui/options.css @@ -56,19 +56,6 @@ body { white-space: nowrap; } -.opt-group { - display: flex; - flex-flow: row wrap; - justify-content: flex-start; - border-bottom: 1px solid rgba(255, 255, 255, .5); - padding: .5em 0; -} - -.opt-group:last-child { - border-bottom: none; - margin-bottom: .5em; -} - section form, section fieldset { margin: .5em 0; } @@ -77,9 +64,7 @@ fieldset:disabled { opacity: .5; } -.opt-group > span { - margin: 0 .5em; -} + .sect-sites form { display: flex; @@ -146,22 +131,10 @@ button.add { appearance: none; } -.opt-group { - padding: 0.5em 0; -} - #xssFaq { padding: 0.5em 1em; } -#tb-options { - display: none; -} - -.tor #tb-options { - display: initial; -} - #clearclick-options { display: none; } diff --git a/src/ui/options.html b/src/ui/options.html index 1ccc62f..bc40d3b 100644 --- a/src/ui/options.html +++ b/src/ui/options.html @@ -109,8 +109,8 @@ (__MSG_XssFaq__) + -
@@ -119,7 +119,8 @@
- +
diff --git a/src/ui/popup.css b/src/ui/popup.css index 3433cf2..28c1878 100644 --- a/src/ui/popup.css +++ b/src/ui/popup.css @@ -246,3 +246,19 @@ body { .error { background-image: url("/img/error64.png"); } + +#incognito-ui-chooser, html.incognito #message:not(.hidden) ~ #incognito-ui-chooser { + display: none; +} +html.incognito #incognito-ui-chooser { + display: initial; +} + +#incognito-ui-chooser label { + white-space: pre-wrap; +} + +#incognito-ui-chooser input:checked + label { + background: #fff; + color: #800; +} diff --git a/src/ui/popup.html b/src/ui/popup.html index c0ecadd..66117b4 100644 --- a/src/ui/popup.html +++ b/src/ui/popup.html @@ -38,6 +38,13 @@
+
+ + + + +
diff --git a/src/ui/popup.js b/src/ui/popup.js index 9e69db7..d759e7e 100644 --- a/src/ui/popup.js +++ b/src/ui/popup.js @@ -245,7 +245,14 @@ addEventListener("unload", e => { initSitesUI(); UI.onSettings = initSitesUI; - + if (UI.incognito) { + UI.wireOption("overrideTorBrowserPolicy", "sync", toggle => { + if (UI.forceIncognito !== !toggle) { + UI.forceIncognito = !toggle; + sitesUI.render(); + } + }); + } function initSitesUI() { pendingReload(false); @@ -308,6 +315,7 @@ addEventListener("unload", e => { sitesUI.mainDomain = tld.getDomain(sitesUI.mainUrl.hostname); sitesUI.render(sites); + sitesUI.focus(); } function reload() { diff --git a/src/ui/ui.css b/src/ui/ui.css index 8c7c415..9d9f9d5 100644 --- a/src/ui/ui.css +++ b/src/ui/ui.css @@ -6,16 +6,42 @@ body { min-width: 600px; } -.mobile > body { +html.mobile > body { font-family: Inter, sans-serif; font-size: 4mm; min-width: auto; } -.mobile .desktop { +html.mobile .desktop { display: none !important; } +html:not(.tor) .tor, html.tor .not-tor { + display: none; +} +html.tor .tor, html:not(.tor) .not-tor { + display: initial; +} + +.opt-group { + display: flex; + flex-flow: row wrap; + border-bottom: 1px solid rgba(255, 255, 255, .5); + padding: .5em 0; +} + +.opt-group:last-child { + border-bottom: none; + margin-bottom: .5em; +} + +.opt-group > span { + margin: 0 .5em; + display: flex; + flex-flow: row; + align-items: center; +} + @media (max-width: 100mm) { body { background-size: 4em !important; diff --git a/src/ui/ui.js b/src/ui/ui.js index b233083..8afbc54 100644 --- a/src/ui/ui.js +++ b/src/ui/ui.js @@ -14,7 +14,9 @@ var UI = (() => { async init(tab) { UI.tabId = tab ? tab.id : -1; - UI.incognito = tab && tab.incognito; + document.documentElement.classList.toggle("incognito", + UI.incognito = tab && tab.incognito + ); let scripts = [ "/ui/ui.css", "/lib/Messages.js", @@ -656,7 +658,6 @@ var UI = (() => { this.sites = sites; } this.sort(sorter); - window.setTimeout(() => this.focus(), 50); } focus() {