1
0
Fork 1
mirror of https://github.com/zen-browser/desktop.git synced 2025-07-08 00:10:00 +02:00

Enhance compact mode functionality by refining sidebar animation conditions and updating CSS ignore rules

This commit is contained in:
mr. M 2025-01-25 13:42:52 +01:00
parent d996db31d6
commit 63fcbc73a5
No known key found for this signature in database
GPG key ID: CBD57A2AEDBDA1FB
3 changed files with 11 additions and 3 deletions

View file

@ -23,5 +23,6 @@ docs/issue-metrics/*.md
# Some CSS files are preprocessed and prettier doesn't handle them well # Some CSS files are preprocessed and prettier doesn't handle them well
# We also dont want to format the CSS files that are generated by the build # We also dont want to format the CSS files that are generated by the build
src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
src/browser/base/content/zen-styles/zen-compact-mode.css
src/browser/base/zen-components/ZenEmojies.mjs src/browser/base/zen-components/ZenEmojies.mjs
build/codesign/codesign.bash build/codesign/codesign.bash

View file

@ -4,7 +4,10 @@
* file, You can obtain one at http://mozilla.org/MPL/2.0/. * file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/ */
& #zen-sidebar-top-buttons:not(:has(toolbarbutton, toolbaritem)) { &
#zen-sidebar-top-buttons:not(
:has(#zen-sidebar-top-buttons-customization-target > *:not(#zen-sidebar-top-buttons-separator))
) {
max-height: 0 !important; max-height: 0 !important;
min-height: 0 !important; min-height: 0 !important;
opacity: 0; opacity: 0;

View file

@ -149,13 +149,17 @@ var gZenCompactModeManager = {
this._animating = true; this._animating = true;
const isCompactMode = this.preference; const isCompactMode = this.preference;
const canHideSidebar = Services.prefs.getBoolPref('zen.view.compact.hide-tabbar'); const canHideSidebar = Services.prefs.getBoolPref('zen.view.compact.hide-tabbar');
const canAnimate =
lazyCompactMode.COMPACT_MODE_CAN_ANIMATE_SIDEBAR &&
!this.sidebar.hasAttribute('zen-user-show') &&
!this.sidebar.hasAttribute('zen-has-hover');
// Do this so we can get the correct width ONCE compact mode styled have been applied // Do this so we can get the correct width ONCE compact mode styled have been applied
if (lazyCompactMode.COMPACT_MODE_CAN_ANIMATE_SIDEBAR) { if (canAnimate) {
this.sidebar.setAttribute('animate', 'true'); this.sidebar.setAttribute('animate', 'true');
} }
window.requestAnimationFrame(() => { window.requestAnimationFrame(() => {
let sidebarWidth = this.getAndApplySidebarWidth(); let sidebarWidth = this.getAndApplySidebarWidth();
if (!lazyCompactMode.COMPACT_MODE_CAN_ANIMATE_SIDEBAR) { if (!canAnimate) {
this.sidebar.removeAttribute('animate'); this.sidebar.removeAttribute('animate');
this._animating = false; this._animating = false;
return; return;