From 0d0e62aedf8bfd8393f5ad17e369a95ddc12137f Mon Sep 17 00:00:00 2001 From: Akshay Nair Date: Sun, 25 Aug 2024 17:06:50 +0530 Subject: firefox: Add private browsing indicator + move passthru indicator --- .../firefox.home/chrome/globalKeybindings.uc.js | 26 ++++++++---- modules/firefox.home/chrome/styles/variables.css | 1 + modules/firefox.home/chrome/userChrome.css | 47 +++++++++++++--------- 3 files changed, 47 insertions(+), 27 deletions(-) (limited to 'modules') diff --git a/modules/firefox.home/chrome/globalKeybindings.uc.js b/modules/firefox.home/chrome/globalKeybindings.uc.js index 1ff868c..4ad35da 100644 --- a/modules/firefox.home/chrome/globalKeybindings.uc.js +++ b/modules/firefox.home/chrome/globalKeybindings.uc.js @@ -41,10 +41,21 @@ const togglePassthrough = () => () => UC.globalKeybindings.updateMode(m => m !== MODE_PASSTHRU ? MODE_PASSTHRU : MODE_NORMAL) const sidetabs = { - getExtensionId: () => [...SidebarController.sidebars].find(([_, p]) => p.label?.match(/sidetabs/i))?.[0], - ensureOpen: () => !SidebarController.isOpen && SidebarController.show(sidetabs.getExtensionId() ?? undefined), - toggle: () => () => { - sidetabs.ensureOpen(); + getExtensionId: () => { + return [...SidebarController.sidebars].find(([_, p]) => p.label?.match(/sidetabs/i))?.[0]; + }, + ensureReady: async () => { + for (let i = 0; i < 3; i++) { + if (sidetabs.getExtensionId()) { + return !SidebarController.isOpen && SidebarController.show(sidetabs.getExtensionId() ?? undefined) + } else { + console.log('sidebar retry...'); + await new Promise(res => setTimeout(res), 100); + } + } + }, + toggle: () => async () => { + await sidetabs.ensureReady(); const sidebar = document.getElementById('sidebar-box'); sidebar?.classList.toggle('open'); }, @@ -97,17 +108,18 @@ updateMode: f => { module.mode = f(module.mode); - gBrowser.tabContainer.dataset.keyMode = module.mode + if (gNavToolbox) gNavToolbox.dataset.keyMode = module.mode; + Services.obs.notifyObservers(null, 'uc:globalKeybindings:modeChanged', module.mode); }, handleKeyUpEvent: e => module.evaluateKeybindings(module.keybindings.RELEASE, e), handleKeyDownEvent: e => module.evaluateKeybindings(module.keybindings.PRESS, e), - onWindowReady: (win) => { + onWindowReady: async (win) => { win.addEventListener('keyup', module.handleKeyUpEvent, true); win.addEventListener('keydown', module.handleKeyDownEvent, true); - sidetabs.ensureOpen(); + await sidetabs.ensureReady(); }, init(win) { diff --git a/modules/firefox.home/chrome/styles/variables.css b/modules/firefox.home/chrome/styles/variables.css index f002f1f..54ccb2b 100644 --- a/modules/firefox.home/chrome/styles/variables.css +++ b/modules/firefox.home/chrome/styles/variables.css @@ -4,6 +4,7 @@ --ff-bg-color: #0f0c19; --ff-bg-color-1: #16121f; --ff-bg-color-2: #26222f; + --ff-bg-private: hsl(247,36%,15%); --ff-urlbar-height: 28px; } diff --git a/modules/firefox.home/chrome/userChrome.css b/modules/firefox.home/chrome/userChrome.css index 4133251..7b647f6 100644 --- a/modules/firefox.home/chrome/userChrome.css +++ b/modules/firefox.home/chrome/userChrome.css @@ -16,7 +16,7 @@ toolbarbutton { } #TabsToolbar { - background-color: var(--ff-bg-color) !important; + background-color: var(--toolbar-bgcolor) !important; } .browser-toolbar { @@ -94,31 +94,13 @@ toolbarbutton#alltabs-button { display: none !important; } -/* Show a label to display the current mode for global keybindings */ -#tabbrowser-tabs[data-key-mode=""]::after { - display: none; -} -#tabbrowser-tabs[data-key-mode]::after { - content: attr(data-key-mode); - vertical-align: middle; - font-size: 0.73rem; - background-color: var(--ff-accent-color); - color: #ddd; - padding: 2px 5px; - top: 50%; - position: absolute; - right: 8px; - transform: translateY(-50%); -} - - /* Nav bar with url */ #nav-bar { border-top: none !important; - background-color: var(--ff-bg-color) !important; + background-color: var(--toolbar-bgcolor) !important; padding: 4px 2px !important; } @@ -222,3 +204,28 @@ toolbarbutton#alltabs-button { } +/* Key mode indicator */ +#navigator-toolbox[data-key-mode=""]::after { + display: none; +} +#navigator-toolbox[data-key-mode]::after { + content: attr(data-key-mode); + vertical-align: middle; + font-size: 0.73rem; + background-color: var(--ff-accent-color); + color: #ddd; + padding: 2px 5px; + top: 0; + position: absolute; + right: 0; + /* transform: translateY(-50%); */ +} + +/* Private browsing indicator */ +#main-window[privatebrowsingmode="temporary"] #navigator-toolbox { + --toolbar-bgcolor: var(--ff-bg-private) !important; +} +#main-window[privatebrowsingmode="temporary"] #browser { + background-color: var(--ff-bg-private) !important; +} + -- cgit v1.3.1