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

feat: Disable light weight themes and use our own ones, b=no-bug, c=common, tabs, workspaces

This commit is contained in:
mr. m 2025-06-25 12:17:27 +02:00
parent 3fca0657b5
commit ee20de3c3d
No known key found for this signature in database
GPG key ID: 928E01ED4C97749F
6 changed files with 32 additions and 32 deletions

View file

@ -21,3 +21,5 @@ pref('zen.theme.window.scheme', 'auto'); // auto, light, dark
pref('zen.theme.acrylic-elements', false); pref('zen.theme.acrylic-elements', false);
#endif #endif
// Light weight themes
pref('zen.theme.disable-lightweight', false);

View file

@ -1,5 +1,5 @@
diff --git a/toolkit/modules/LightweightThemeConsumer.sys.mjs b/toolkit/modules/LightweightThemeConsumer.sys.mjs diff --git a/toolkit/modules/LightweightThemeConsumer.sys.mjs b/toolkit/modules/LightweightThemeConsumer.sys.mjs
index d8c79cbae4de3ebfc5dc62f3597c7be4965a5429..4398108bd6d74aa8b6689baaf5334d8ba9a26c4e 100644 index fe01b25c520d1be71224b136b1ce46e9577e11a1..e5501590f3695ed4c2e19be5c104958b497c886e 100644
--- a/toolkit/modules/LightweightThemeConsumer.sys.mjs --- a/toolkit/modules/LightweightThemeConsumer.sys.mjs
+++ b/toolkit/modules/LightweightThemeConsumer.sys.mjs +++ b/toolkit/modules/LightweightThemeConsumer.sys.mjs
@@ -31,7 +31,7 @@ const toolkitVariableMap = [ @@ -31,7 +31,7 @@ const toolkitVariableMap = [
@ -11,3 +11,12 @@ index d8c79cbae4de3ebfc5dc62f3597c7be4965a5429..4398108bd6d74aa8b6689baaf5334d8b
} }
// Remove the alpha channel // Remove the alpha channel
const { r, g, b } = rgbaChannels; const { r, g, b } = rgbaChannels;
@@ -317,7 +317,7 @@ LightweightThemeConsumer.prototype = {
}
let theme = useDarkTheme ? themeData.darkTheme : themeData.theme;
- if (!theme) {
+ if (!theme || Services.prefs.getBoolPref("zen.theme.disable-lightweight")) {
theme = { id: DEFAULT_THEME_ID };
}
let hasTheme = theme.id != DEFAULT_THEME_ID || useDarkTheme;

View file

@ -103,7 +103,7 @@ body > #confetti {
:root:is([zen-single-toolbar='true'], :not([zen-sidebar-expanded='true'])) :root:is([zen-single-toolbar='true'], :not([zen-sidebar-expanded='true']))
#zen-sidebar-top-buttons-customization-target #zen-sidebar-top-buttons-customization-target
&, &,
#zen-sidebar-foot-buttons { #zen-sidebar-foot-buttons & {
--tab-border-radius: 6px; --tab-border-radius: 6px;
--toolbarbutton-border-radius: var(--tab-border-radius); --toolbarbutton-border-radius: var(--tab-border-radius);
--toolbarbutton-inner-padding: 7px; --toolbarbutton-inner-padding: 7px;

View file

@ -136,9 +136,6 @@
} }
& #nav-bar { & #nav-bar {
/* Add bottom margin */
margin-bottom: var(--zen-toolbox-padding);
/* Hide flexible spaces */ /* Hide flexible spaces */
& toolbarspring { & toolbarspring {
display: none; display: none;
@ -1275,7 +1272,6 @@
.zen-essentials-container { .zen-essentials-container {
will-change: transform; will-change: transform;
padding-bottom: var(--zen-toolbox-padding);
overflow: hidden; overflow: hidden;
gap: 4px; gap: 4px;
transition: transition:
@ -1299,6 +1295,7 @@
min-width: calc(100% + var(--zen-toolbox-padding) * 2); min-width: calc(100% + var(--zen-toolbox-padding) * 2);
width: calc(100% + var(--zen-toolbox-padding) * 2); width: calc(100% + var(--zen-toolbox-padding) * 2);
padding: 0 var(--zen-toolbox-padding); padding: 0 var(--zen-toolbox-padding);
padding-top: 6px;
display: grid; display: grid;
position: absolute; position: absolute;

View file

@ -1091,8 +1091,8 @@
} }
if (themedColors.length === 2) { if (themedColors.length === 2) {
return [ return [
`linear-gradient(${rotation}deg, ${this.getSingleRGBColor(themedColors[1], forToolbar)} -25%, transparent 100%)`, `linear-gradient(${rotation}deg, ${this.getSingleRGBColor(themedColors[1], forToolbar)} 0%, transparent 100%)`,
`linear-gradient(${rotation + 180}deg, ${this.getSingleRGBColor(themedColors[0], forToolbar)} -25%, transparent 100%)`, `linear-gradient(${rotation + 180}deg, ${this.getSingleRGBColor(themedColors[0], forToolbar)} 0%, transparent 100%)`,
].join(', '); ].join(', ');
} else if (themedColors.length === 3) { } else if (themedColors.length === 3) {
let color1 = this.getSingleRGBColor(themedColors[2], forToolbar); let color1 = this.getSingleRGBColor(themedColors[2], forToolbar);
@ -1100,9 +1100,9 @@
let color3 = this.getSingleRGBColor(themedColors[1], forToolbar); let color3 = this.getSingleRGBColor(themedColors[1], forToolbar);
if (!forToolbar) { if (!forToolbar) {
return [ return [
`radial-gradient(circle at -30% -30%, ${color2}, transparent 100%)`, `radial-gradient(circle at 0% 0%, ${color2}, transparent 100%)`,
`radial-gradient(circle at 130% -30%, ${color3}, transparent 100%)`, `radial-gradient(circle at 100% 0%, ${color3}, transparent 100%)`,
`linear-gradient(to top, ${color1} -30%, transparent 60%)`, `linear-gradient(to top, ${color1} 0%, transparent 60%)`,
].join(', '); ].join(', ');
} }
return [`linear-gradient(120deg, ${color1} -30%, ${color3} 100%)`].join(', '); return [`linear-gradient(120deg, ${color1} -30%, ${color3} 100%)`].join(', ');
@ -1250,19 +1250,7 @@
}; };
getMostDominantColor(allColors) { getMostDominantColor(allColors) {
const dominantColor = this.getPrimaryColor(allColors); return this.getPrimaryColor(allColors);
if (!dominantColor) {
return this.hexToRgb(this.getNativeAccentColor());
}
const result = this.pSBC(
this.isDarkMode ? 0.2 : -0.5,
`rgb(${dominantColor[0]}, ${dominantColor[1]}, ${dominantColor[2]})`
);
const color = result?.match(/\d+/g)?.map(Number);
if (!color || color.length !== 3) {
return this.hexToRgb(this.getNativeAccentColor());
}
return color;
} }
blendColors(rgb1, rgb2, percentage) { blendColors(rgb1, rgb2, percentage) {
@ -1359,9 +1347,11 @@
browser.gZenThemePicker.currentOpacity = workspaceTheme.opacity ?? 0.5; browser.gZenThemePicker.currentOpacity = workspaceTheme.opacity ?? 0.5;
browser.gZenThemePicker.currentTexture = workspaceTheme.texture ?? 0; browser.gZenThemePicker.currentTexture = workspaceTheme.texture ?? 0;
const dominantColor = this.getMostDominantColor(workspaceTheme.gradientColors); let dominantColor = this.getMostDominantColor(workspaceTheme.gradientColors);
const isDefaultTheme = const isDefaultTheme = !dominantColor;
dominantColor?.toString() === this.hexToRgb(this.getNativeAccentColor()).toString(); if (isDefaultTheme) {
dominantColor = this.hexToRgb(this.getNativeAccentColor());
}
const opacitySlider = browser.document.getElementById( const opacitySlider = browser.document.getElementById(
'PanelUI-zen-gradient-generator-opacity' 'PanelUI-zen-gradient-generator-opacity'
@ -1472,9 +1462,10 @@
if (dominantColor) { if (dominantColor) {
browser.document.documentElement.style.setProperty( browser.document.documentElement.style.setProperty(
'--zen-primary-color', '--zen-primary-color',
typeof dominantColor === 'string' this.pSBC(
? dominantColor this.isDarkMode ? 0.2 : -0.5,
: `rgb(${dominantColor[0]}, ${dominantColor[1]}, ${dominantColor[2]})` `rgb(${dominantColor[0]}, ${dominantColor[1]}, ${dominantColor[2]})`
)
); );
let isDarkMode = this.isDarkMode; let isDarkMode = this.isDarkMode;
if (!isDefaultTheme) { if (!isDefaultTheme) {

View file

@ -192,14 +192,14 @@
&::before { &::before {
content: ''; content: '';
position: absolute; position: absolute;
width: 100%; width: calc(100% - 8px);
height: 16px; height: 16px;
background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1)); background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
border-radius: 999px; border-radius: 999px;
pointer-events: none; pointer-events: none;
z-index: -1; z-index: -1;
top: 50%; top: 50%;
left: 4px; left: 8px;
transform: translateY(-50%); transform: translateY(-50%);
} }
@ -215,6 +215,7 @@
margin: 0 !important; margin: 0 !important;
background: transparent; background: transparent;
z-index: 2; z-index: 2;
padding: 0 5px;
&::-moz-range-thumb { &::-moz-range-thumb {
background: light-dark(black, white); background: light-dark(black, white);