extern/nightTab
1
0
Fork 0
mirror of https://github.com/zombieFox/nightTab.git synced 2025-06-30 14:21:05 +02:00
Code Issues Packages Projects Releases Wiki Activity

[design] improve link item name colour

Browse Source
This commit is contained in:
zombieFox
2020-07-23 15:52:14 +01:00
parent 7574b148ee
commit 9456fd3205
2 changed files with 40 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/js/link.js
View File

@ -1360,18 +1360,23 @@ var link = (function() {
}; };
if (stagedLink.link.color.by == "custom") { if (stagedLink.link.color.by == "custom") {
var hsl = helper.convertColor.rgb.hsl(stagedLink.link.color.rgb); var hsl = helper.convertColor.rgb.hsl(stagedLink.link.color.rgb);
var shades = theme.mod.color.shades(stagedLink.link.color.rgb);
var shades = theme.mod.color.shades({
rgb: stagedLink.link.color.rgb,
contrastNegative: 8,
contrastPositive: 8
});
var rgb; var rgb;
if (hsl.l < 50) {
rgb = shades.positive["10"]; if (hsl.l <= 50) {
} else { rgb = shades.positive["9"];
rgb = shades.negative["10"];
};
if (hsl.l < 50) {
linkItemStyle.push("--theme-style-text: var(--theme-white);"); linkItemStyle.push("--theme-style-text: var(--theme-white);");
} else { } else {
rgb = shades.negative["9"];
linkItemStyle.push("--theme-style-text: var(--theme-black);"); linkItemStyle.push("--theme-style-text: var(--theme-black);");
}; };
linkItemStyle.push("--link-item-visual-element-color-focus-hover: var(--theme-style-text);"); linkItemStyle.push("--link-item-visual-element-color-focus-hover: var(--theme-style-text);");
linkItemStyle.push("--link-item-color: " + stagedLink.link.color.rgb.r + ", " + stagedLink.link.color.rgb.g + ", " + stagedLink.link.color.rgb.b + ";"); linkItemStyle.push("--link-item-color: " + stagedLink.link.color.rgb.r + ", " + stagedLink.link.color.rgb.g + ", " + stagedLink.link.color.rgb.b + ";");
linkItemStyle.push("--link-item-color-focus-hover: " + stagedLink.link.color.rgb.r + ", " + stagedLink.link.color.rgb.g + ", " + stagedLink.link.color.rgb.b + ";"); linkItemStyle.push("--link-item-color-focus-hover: " + stagedLink.link.color.rgb.r + ", " + stagedLink.link.color.rgb.g + ", " + stagedLink.link.color.rgb.b + ";");

35
src/js/theme.js
View File

@ -741,12 +741,28 @@ var theme = (function() {
} }
}); });
}, },
shades: function(rgb) { shades: function(override) {
var options = {
rgb: null,
contrastNegative: null,
contrastPositive: null
};
if (override) {
options = helper.applyOptions(options, override);
};
var shadeMax = 10; var shadeMax = 10;
var shadeMin = 1; var shadeMin = 1;
var contrastNeg = state.get.current().theme.color.contrast.dark;
var contrastPos = state.get.current().theme.color.contrast.light; if (options.contrastNegative == null || !options.contrastNegative) {
var hsl = helper.convertColor.rgb.hsl(rgb); options.contrastNegative = state.get.default().theme.color.contrast.dark;
};
if (options.contrastPositive == null || !options.contrastPositive) {
options.contrastPositive = state.get.default().theme.color.contrast.light;
};
var hsl = helper.convertColor.rgb.hsl(options.rgb);
var validateRGBNumber = function(rgb) { var validateRGBNumber = function(rgb) {
for (var key in rgb) { for (var key in rgb) {
if (rgb[key] < 0) { if (rgb[key] < 0) {
@ -764,11 +780,12 @@ var theme = (function() {
positive: {} positive: {}
}; };
// set light theme shades
for (var i = shadeMax; i >= shadeMin; i--) { for (var i = shadeMax; i >= shadeMin; i--) {
var rgb = helper.convertColor.hsl.rgb({ var rgb = helper.convertColor.hsl.rgb({
h: hsl.h, h: hsl.h,
s: hsl.s, s: hsl.s,
l: hsl.l - (contrastNeg * i) l: hsl.l - (options.contrastNegative * i)
}); });
shadeColors.negative[i] = validateRGBNumber(rgb); shadeColors.negative[i] = validateRGBNumber(rgb);
}; };
@ -778,7 +795,7 @@ var theme = (function() {
var rgb = helper.convertColor.hsl.rgb({ var rgb = helper.convertColor.hsl.rgb({
h: hsl.h, h: hsl.h,
s: hsl.s, s: hsl.s,
l: hsl.l + (contrastPos * i) l: hsl.l + (options.contrastPositive * i)
}); });
shadeColors.positive[i] = validateRGBNumber(rgb); shadeColors.positive[i] = validateRGBNumber(rgb);
}; };
@ -786,7 +803,11 @@ var theme = (function() {
return shadeColors; return shadeColors;
}, },
generated: function() { generated: function() {
var shades = mod.color.shades(state.get.current().theme.color.rgb); var shades = mod.color.shades({
rgb: state.get.current().theme.color.rgb,
contrastNegative: state.get.current().theme.color.contrast.dark,
contrastPositive: state.get.current().theme.color.contrast.light
});
helper.setObject({ helper.setObject({
object: state.get.current(), object: state.get.current(),
path: "theme.color.generated.negative", path: "theme.color.generated.negative",