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

fix: Made detected contrasts pass accessibility tests, b=no-bug, c=common, workspaces

This commit is contained in:
mr. m 2025-06-25 16:43:13 +02:00
parent ee20de3c3d
commit 76166c4aa3
No known key found for this signature in database
GPG key ID: 928E01ED4C97749F
4 changed files with 22 additions and 12 deletions

View file

@ -84,7 +84,13 @@
</defs> </defs>
</svg> </svg>
</box> </box>
<html:input type="range" min="0.15" max="0.8" value="0.4" step="0.01" id="PanelUI-zen-gradient-generator-opacity" /> <html:input type="range" max="0.9" value="0.4" step="0.01" id="PanelUI-zen-gradient-generator-opacity"
#ifdef XP_WIN
min="0.2"
#else
min="0.15"
#endif
/>
</vbox> </vbox>
<vbox id="PanelUI-zen-gradient-generator-texture-wrapper"> <vbox id="PanelUI-zen-gradient-generator-texture-wrapper">
</vbox> </vbox>

View file

@ -134,6 +134,8 @@
transparent 90% transparent 90%
); );
--toolbar-color: light-dark(rgb(21, 20, 26, 0.7), rgb(251, 251, 254, 0.7)) !important;
/* Other colors */ /* Other colors */
--urlbar-box-bgcolor: var(--zen-urlbar-background) !important; --urlbar-box-bgcolor: var(--zen-urlbar-background) !important;
--urlbar-box-active-bgcolor: var(--toolbarbutton-hover-background) !important; --urlbar-box-active-bgcolor: var(--toolbarbutton-hover-background) !important;
@ -227,6 +229,9 @@
@media (-moz-windows-mica) or (-moz-platform: macos) { @media (-moz-windows-mica) or (-moz-platform: macos) {
background: transparent; background: transparent;
--zen-themed-toolbar-bg-transparent: transparent; --zen-themed-toolbar-bg-transparent: transparent;
@media -moz-pref('widget.windows.mica.toplevel-backdrop', 2) {
--zen-themed-toolbar-bg-transparent: light-dark(rgba(255, 255, 255, 0.1), rgba(0, 0, 0, 0.3));
}
&[zen-should-be-dark-mode] { &[zen-should-be-dark-mode] {
--zen-themed-toolbar-bg-transparent: var(--zen-themed-browser-overlay-bg); --zen-themed-toolbar-bg-transparent: var(--zen-themed-browser-overlay-bg);
} }

View file

@ -40,6 +40,9 @@
return points; return points;
} }
const MAX_OPACITY = 0.9;
const MIN_OPACITY = AppConstants.platform === 'win' ? 0.2 : 0.15;
class nsZenThemePicker extends ZenMultiWindowFeature { class nsZenThemePicker extends ZenMultiWindowFeature {
static MAX_DOTS = 3; static MAX_DOTS = 3;
@ -1018,11 +1021,7 @@
} }
luminance([r, g, b]) { luminance([r, g, b]) {
const a = [r, g, b].map((v) => { return 0.2126 * (r / 255) + 0.7152 * (g / 255) + 0.0722 * (b / 255);
v /= 255;
return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
});
return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722;
} }
contrastRatio(rgb1, rgb2) { contrastRatio(rgb1, rgb2) {
@ -1111,7 +1110,7 @@
} }
shouldBeDarkMode(accentColor) { shouldBeDarkMode(accentColor) {
let minimalLum = this.isDarkMode ? 0.6 : 0.5; let minimalLum = 0.5;
if (!this.canBeTransparent) { if (!this.canBeTransparent) {
// Blend the color with the toolbar background // Blend the color with the toolbar background
const toolbarBg = this.getToolbarModifiedBaseRaw(); const toolbarBg = this.getToolbarModifiedBaseRaw();
@ -1363,14 +1362,13 @@
const [_, secondStop, thirdStop] = document.querySelectorAll( const [_, secondStop, thirdStop] = document.querySelectorAll(
'#PanelUI-zen-gradient-generator-slider-wave-gradient stop' '#PanelUI-zen-gradient-generator-slider-wave-gradient stop'
); );
// Opacity can only be between 0.15 to 0.80. Make opacity relative to that range // Opacity can only be between MIN_OPACITY to MAX_OPACITY. Make opacity relative to that range
// So 0.15 becomes 0, and 0.80 becomes 1. if (opacity < MIN_OPACITY) {
if (opacity < 0.15) {
opacity = 0; opacity = 0;
} else if (opacity > 0.8) { } else if (opacity > MAX_OPACITY) {
opacity = 1; opacity = 1;
} else { } else {
opacity = (opacity - 0.15) / (0.8 - 0.15); opacity = (opacity - MIN_OPACITY) / (MAX_OPACITY - MIN_OPACITY);
} }
if (isDefaultTheme) { if (isDefaultTheme) {
opacity = 1; // If it's the default theme, we want the wave to be opacity = 1; // If it's the default theme, we want the wave to be

View file

@ -277,6 +277,7 @@
&:hover { &:hover {
transform: scale(1.05) translate(-50%, -50%); transform: scale(1.05) translate(-50%, -50%);
} }
transform-origin: center center;
} }
&[dragging='true'] { &[dragging='true'] {