no-bug: Clarify comment for acrylic elements (gh-12884)

This commit is contained in:
mr. m
2026-03-22 20:18:05 +01:00
committed by GitHub
parent 144741ea68
commit e221bcccc8
4 changed files with 14 additions and 12 deletions

View File

@@ -1014,7 +1014,7 @@ window.gZenVerticalTabsManager = {
marginBottom: isLastItem() ? ["0px", "0px"] : [transform, "0px"],
},
{
duration: 0.075,
duration: 0.1,
easing: "easeOut",
}
)

View File

@@ -33,7 +33,9 @@
@media -moz-pref("zen.theme.acrylic-elements") {
& browser[type="content"] {
/* For the rendering engine to apply layering optimizations. This
* is a hacky solution, but it works for now. */
* is a hacky solution, but it works for now. Note that this makes
* zen REALLY slow, so lets not enable it by default until we have
* a better solution. */
will-change: transform;
}
}

View File

@@ -1278,7 +1278,7 @@ export class nsZenThemePicker extends nsZenMultiWindowFeature {
return `rgba(${baseColor[0]}, ${baseColor[1]}, ${baseColor[2]}, ${opacity})`;
}
getSingleRGBColor(color, forToolbar = false) {
#getSingleRGBColor(color, forToolbar = false) {
if (color.isCustom) {
return color.c;
}
@@ -1345,13 +1345,13 @@ export class nsZenThemePicker extends nsZenMultiWindowFeature {
};
return forToolbar ? this.getToolbarModifiedBase() : getBrowserBg();
} else if (themedColors.length === 1) {
return this.getSingleRGBColor(themedColors[0], forToolbar);
return this.#getSingleRGBColor(themedColors[0], forToolbar);
}
// If there are custom colors, we just return a linear gradient with all colors
if (themedColors.find(color => color.isCustom)) {
// Just return a linear gradient with all colors
const gradientColors = themedColors.map(color =>
this.getSingleRGBColor(color, forToolbar)
this.#getSingleRGBColor(color, forToolbar)
);
// Divide all colors evenly in the gradient
const colorStops = gradientColors
@@ -1365,17 +1365,17 @@ export class nsZenThemePicker extends nsZenMultiWindowFeature {
if (themedColors.length === 2) {
if (!forToolbar) {
return [
`linear-gradient(${rotation}deg, ${this.getSingleRGBColor(themedColors[1], forToolbar)} 0%, transparent 100%)`,
`linear-gradient(${rotation + 180}deg, ${this.getSingleRGBColor(themedColors[0], forToolbar)} 0%, transparent 100%)`,
`linear-gradient(${rotation}deg, ${this.#getSingleRGBColor(themedColors[1], forToolbar)} 0%, transparent 100%)`,
`linear-gradient(${rotation + 180}deg, ${this.#getSingleRGBColor(themedColors[0], forToolbar)} 0%, transparent 100%)`,
]
.reverse()
.join(", ");
}
return `linear-gradient(${rotation}deg, ${this.getSingleRGBColor(themedColors[1], forToolbar)} 0%, ${this.getSingleRGBColor(themedColors[0], forToolbar)} 100%)`;
return `linear-gradient(${rotation}deg, ${this.#getSingleRGBColor(themedColors[1], forToolbar)} 0%, ${this.#getSingleRGBColor(themedColors[0], forToolbar)} 100%)`;
} else if (themedColors.length === 3) {
let color1 = this.getSingleRGBColor(themedColors[2], forToolbar);
let color2 = this.getSingleRGBColor(themedColors[0], forToolbar);
let color3 = this.getSingleRGBColor(themedColors[1], forToolbar);
let color1 = this.#getSingleRGBColor(themedColors[2], forToolbar);
let color2 = this.#getSingleRGBColor(themedColors[0], forToolbar);
let color3 = this.#getSingleRGBColor(themedColors[1], forToolbar);
return [
`linear-gradient(-5deg, ${color1} 10%, transparent 80%)`,
`radial-gradient(circle at 95% 0%, ${color3} 0%, transparent 75%)`,

View File

@@ -411,7 +411,7 @@ zen-workspace {
.zen-current-workspace-indicator-chevron {
width: 16px;
height: 16px;
transition: transform 0.1s, opacity 0.1s;
transition: transform 0.1s, opacity 0.15s;
transform: rotate(90deg);
padding: 1px;