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

feat: Improved scrolling and fixed identifying contrast on custom colors, b=bug #9185, c=common, workspaces

This commit is contained in:
mr. m 2025-06-26 21:03:41 +02:00
parent f0169277a0
commit 51d4396088
No known key found for this signature in database
GPG key ID: 928E01ED4C97749F
6 changed files with 66 additions and 33 deletions

View file

@ -16,3 +16,8 @@
type: bool
value: true
mirror: always
- name: zen.swipe.is-fast-swipe
type: bool
value: true
mirror: always

View file

@ -0,0 +1,21 @@
diff --git a/widget/SwipeTracker.cpp b/widget/SwipeTracker.cpp
index b09252fd60beb10d5865d226c39ee0c8a9c22d87..91f68161209c6ca3f3bac22997d4e2066f1fafec 100644
--- a/widget/SwipeTracker.cpp
+++ b/widget/SwipeTracker.cpp
@@ -5,6 +5,7 @@
* You can obtain one at http://mozilla.org/MPL/2.0/. */
#include "SwipeTracker.h"
+#include "mozilla/StaticPrefs_zen.h"
#include "InputData.h"
#include "mozilla/FlushType.h"
@@ -90,7 +91,7 @@ bool SwipeTracker::ComputeSwipeSuccess() const {
return (mGestureAmount * targetValue +
mCurrentVelocity * targetValue *
- StaticPrefs::widget_swipe_success_velocity_contribution()) >=
+ (StaticPrefs::zen_swipe_is_fast_swipe() ? 0.5 : StaticPrefs::widget_swipe_success_velocity_contribution())) >=
kSwipeSuccessThreshold;
}

View file

@ -93,9 +93,11 @@
z-index: 1;
opacity: var(--zen-grainy-background-opacity, 0);
mix-blend-mode: overlay;
:root:not([swipe-gesture='true']) & {
transition: opacity 0.3s ease-in-out;
}
}
}
#sidebar-box {
/** Sidebar is already hidden in full screen mode */

View file

@ -130,8 +130,8 @@
--toolbarbutton-hover-background: color-mix(
in srgb,
var(--zen-branding-bg-reverse) 5%,
transparent 95%
var(--zen-branding-bg-reverse) 7.5%,
transparent 92.5%
);
--toolbarbutton-active-background: color-mix(
@ -192,11 +192,7 @@
--zen-active-tab-scale: 0.98;
/* Define tab hover background color */
--tab-hover-background-color: color-mix(
in srgb,
var(--toolbarbutton-hover-background) 50%,
transparent 50%
);
--tab-hover-background-color: var(--toolbarbutton-hover-background);
/* Nativity */
--zen-native-content-radius: var(--zen-border-radius);

View file

@ -1253,7 +1253,11 @@
};
getMostDominantColor(allColors) {
return this.getPrimaryColor(allColors);
const color = this.getPrimaryColor(allColors);
if (typeof color === 'string') {
return this.hexToRgb(color);
}
return color;
}
blendColors(rgb1, rgb2, percentage) {
@ -1629,8 +1633,8 @@
const gradient = this.getGradient(workspace.theme.gradientColors);
this.currentOpacity = previousOpacity;
this.#currentLightness = previousLightness;
this.#gradientsCache[uuid] = gradient;
return gradient;
this.#gradientsCache[uuid] = [gradient, workspace.theme.texture ?? 0];
return this.#gradientsCache[uuid];
}
}

View file

@ -647,6 +647,7 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
element.addEventListener(
'MozSwipeGestureEnd',
() => {
Services.prefs.setBoolPref('zen.swipe.is-fast-swipe', false);
document.documentElement.removeAttribute('swipe-gesture');
gZenUIManager.tabsWrapper.style.removeProperty('scrollbar-width');
delete this._hasAnimatedBackgrounds;
@ -694,6 +695,7 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
lastDelta: 0,
direction: null,
};
Services.prefs.setBoolPref('zen.swipe.is-fast-swipe', true);
}
_handleSwipeUpdate(event) {
@ -714,7 +716,7 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
translateX = this._swipeState.lastDelta;
}
if (Math.abs(delta) > 1) {
if (Math.abs(delta) > 0.8) {
this._swipeState.direction = delta > 0 ? 'left' : 'right';
}
@ -1665,30 +1667,33 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
}
if (offsetPixels) {
// Find the next workspace we are scrolling to
if (!this._hasAnimatedBackgrounds) {
this._hasAnimatedBackgrounds = true;
const nextWorkspace = workspaces.workspaces[workspaceIndex + (offsetPixels > 0 ? -1 : 1)];
if (nextWorkspace) {
const nextGradient = await gZenThemePicker.getGradientForWorkspace(nextWorkspace);
const existingBackground = document.documentElement.style.getPropertyValue(
'--zen-main-browser-background'
);
if (existingBackground !== nextGradient) {
const [nextGradient, nextGrain] =
await gZenThemePicker.getGradientForWorkspace(nextWorkspace);
const [existingBackground, existingGrain] =
await gZenThemePicker.getGradientForWorkspace(workspace);
const percentage = Math.abs(offsetPixels) / 200;
if (!this._hasAnimatedBackgrounds) {
this._hasAnimatedBackgrounds = true;
document.documentElement.style.setProperty(
'--zen-main-browser-background-old',
existingBackground
);
document.documentElement.style.setProperty(
'--zen-main-browser-background',
nextGradient
);
document.documentElement.style.setProperty('--zen-main-browser-background', nextGradient);
}
document.documentElement.style.setProperty('--zen-background-opacity', percentage);
// Fit the offsetPixels into the grain limits. Both ends may be nextGrain and existingGrain,
// so we need to use the min and max of both. For example, existing may be 0.2 and next may be 0.5,
// meaning we should convert the offset to a percentage between 0.2 and 0.5. BUT if existingGrain
// is 0.5 and nextGrain is 0.2, we should still convert the offset to a percentage between 0.2 and 0.5.
const minGrain = Math.min(existingGrain, nextGrain);
const maxGrain = Math.max(existingGrain, nextGrain);
const grainValue =
minGrain +
(maxGrain - minGrain) * (existingGrain > nextGrain ? 1 - percentage : percentage);
gZenThemePicker.updateNoise(grainValue);
}
}
document.documentElement.style.setProperty(
'--zen-background-opacity',
Math.abs(offsetPixels) / 200
);
} else {
delete this._hasAnimatedBackgrounds;
}