lainns-mirror/noctalia-shell
1
0
Fork 0
mirror of https://github.com/noctalia-dev/noctalia-shell.git synced 2026-05-11 17:08:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

Vesktop: better light theme support for predefined colorscheme

Browse Source
This commit is contained in:
ItsLemmy
2025-10-05 19:10:29 -04:00
parent 9304342eab
commit e88e236f6b
2 changed files with 30 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Helpers/ColorVariants.js
+24 -10
View File
@@ -97,13 +97,21 @@ function hslToHex(h, s, l) {
* Generate fixed_dim variant (darker, muted version)
* Material 3 fixed_dim is typically 20-30% darker
*/
function generateFixedDim(hexColor) {
function generateFixedDim(hexColor, isDarkTheme = false) {
const hsl = hexToHSL(hexColor);
if (!hsl) return hexColor;
// Reduce lightness by 25-30% and slightly reduce saturation
const newL = Math.max(hsl.l * 0.7, 10);
const newS = Math.max(hsl.s * 0.85, 5);
let newL, newS;
if (isDarkTheme) {
// Dark theme: make it dimmer but not too dark (aim for 15-25 lightness)
newL = Math.max(hsl.l * 0.6, 15);
newS = Math.max(hsl.s * 0.7, 15);
} else {
// Light theme: reduce lightness by 25-30% and slightly reduce saturation
newL = Math.max(hsl.l * 0.7, 10);
newS = Math.max(hsl.s * 0.85, 5);
}
return hslToHex(hsl.h, newS, newL);
}
@@ -112,13 +120,20 @@ function generateFixedDim(hexColor) {
* Generate bright variant (lighter, more vibrant version)
* Material 3 bright is typically 15-25% lighter with boosted saturation
*/
function generateBright(hexColor) {
function generateBright(hexColor, isDarkTheme = false) {
const hsl = hexToHSL(hexColor);
if (!hsl) return hexColor;
// Increase lightness by 20-25% and boost saturation
const newL = Math.min(hsl.l * 1.25, 90);
const newS = Math.min(hsl.s * 1.1, 100);
let newL, newS;
if (isDarkTheme) {
// Dark theme: brighten significantly but cap to avoid washing out (aim for 40-60 lightness)
newL = Math.min(hsl.l * 1.5, 60);
newS = Math.min(hsl.s * 1.15, 100);
} else {
// Light theme: increase lightness by 20-25% and boost saturation
newL = Math.min(hsl.l * 1.25, 90);
newS = Math.min(hsl.s * 1.1, 100);
}
return hslToHex(hsl.h, newS, newL);
}
@@ -132,7 +147,6 @@ function generateContainer(hexColor, isDarkTheme = false) {
if (!hsl) return hexColor;
let newL, newS;
if (isDarkTheme) {
// Dark theme: darken the color (aim for 10-20 lightness)
newL = Math.max(hsl.l - (hsl.l - 15) * 0.85, 10);
Services/MatugenService.qml
+6 -6
View File
@@ -335,24 +335,24 @@ Singleton {
},
"surface_container_high": {
"light": {
"color": ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, false))
"color": ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, false), false)
},
"default": {
"color": ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, true))
"color": ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, true), true)
},
"dark": {
"color": ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, true))
"color": ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, true), true)
}
},
"surface_container_highest": {
"light": {
"color": ColorVariants.generateBright(ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, false)))
"color": ColorVariants.generateBright(ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, false), false), false)
},
"default": {
"color": ColorVariants.generateBright(ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, true)))
"color": ColorVariants.generateBright(ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, true), true), true)
},
"dark": {
"color": ColorVariants.generateBright(ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, true)))
"color": ColorVariants.generateBright(ColorVariants.generateBright(ColorVariants.generateContainer(variant.mSurface, true), true), true)
}
}
}