diff --git a/src/browser/app/profile/zen-browser.js b/src/browser/app/profile/zen-browser.js
index 4add188aa..b9446bdec 100644
--- a/src/browser/app/profile/zen-browser.js
+++ b/src/browser/app/profile/zen-browser.js
@@ -73,6 +73,7 @@ pref('zen.theme.toolbar-themed', true);
pref('zen.theme.pill-button', false);
pref('zen.view.compact', false);
pref('zen.view.compact.hide-toolbar', false);
+pref('zen.view.compact.toolbar-flash-popup', true);
pref('zen.view.sidebar-expanded', false);
pref('zen.view.sidebar-expanded.on-hover', false);
diff --git a/src/browser/base/content/ZenUIManager.mjs b/src/browser/base/content/ZenUIManager.mjs
index 91fd23e47..b8d549b74 100644
--- a/src/browser/base/content/ZenUIManager.mjs
+++ b/src/browser/base/content/ZenUIManager.mjs
@@ -110,6 +110,8 @@ var gZenVerticalTabsManager = {
};
var gZenCompactModeManager = {
+ _flashSidebarTimeout: null,
+
init() {
Services.prefs.addObserver('zen.view.compact', this._updateEvent.bind(this));
},
@@ -135,6 +137,27 @@ var gZenCompactModeManager = {
sidebar.toggleAttribute('zen-user-show');
},
+ flashSidebar() {
+ let sidebar = document.getElementById('navigator-toolbox');
+ if (sidebar.matches(':hover')) {
+ return;
+ }
+ if (this._flashSidebarTimeout) {
+ clearTimeout(this._flashSidebarTimeout);
+ } else {
+ window.requestAnimationFrame(() =>
+ sidebar.setAttribute('flash-popup', '')
+ );
+ }
+ this._flashSidebarTimeout =
+ setTimeout(() => {
+ window.requestAnimationFrame(() => {
+ sidebar.removeAttribute('flash-popup')
+ this._flashSidebarTimeout = null;
+ });
+ }, 1600);
+ },
+
toggleToolbar() {
let toolbar = document.getElementById('zen-appcontent-navbar-container');
toolbar.toggleAttribute('zen-user-show');
diff --git a/src/browser/base/content/zen-styles/zen-compact-mode.css b/src/browser/base/content/zen-styles/zen-compact-mode.css
index aa5b49846..c5614cfec 100644
--- a/src/browser/base/content/zen-styles/zen-compact-mode.css
+++ b/src/browser/base/content/zen-styles/zen-compact-mode.css
@@ -95,6 +95,7 @@
#navigator-toolbox:hover,
#navigator-toolbox:focus-within,
#navigator-toolbox[zen-user-show],
+ #navigator-toolbox[flash-popup],
#navigator-toolbox[movingtab],
#mainPopupSet:has(> #appMenu-popup:hover) ~ toolbox,
#navigator-toolbox:has(.tabbrowser-tab:active),
@@ -187,6 +188,7 @@
#navigator-toolbox:hover,
#navigator-toolbox:focus-within,
#navigator-toolbox[zen-user-show],
+ #navigator-toolbox[flash-popup],
#navigator-toolbox[movingtab],
#mainPopupSet:has(> #appMenu-popup:hover) ~ toolbox,
#navigator-toolbox:has(.tabbrowser-tab:active),
diff --git a/src/browser/components/preferences/zen-settings.js b/src/browser/components/preferences/zen-settings.js
index 2f06f0e6b..dc427d1d7 100644
--- a/src/browser/components/preferences/zen-settings.js
+++ b/src/browser/components/preferences/zen-settings.js
@@ -522,6 +522,11 @@ Preferences.addAll([
type: "bool",
default: false,
},
+ {
+ id: "zen.view.compact.toolbar-flash-popup",
+ type: "bool",
+ default: true,
+ },
{
id: "zen.workspaces.enabled",
type: "bool",
diff --git a/src/browser/components/preferences/zenLooksAndFeel.inc.xhtml b/src/browser/components/preferences/zenLooksAndFeel.inc.xhtml
index f0fd75acc..e7ddbc4d1 100644
--- a/src/browser/components/preferences/zenLooksAndFeel.inc.xhtml
+++ b/src/browser/components/preferences/zenLooksAndFeel.inc.xhtml
@@ -30,7 +30,10 @@
+ preference="zen.view.compact.hide-toolbar"/>
+