mirror of
https://github.com/zombieFox/nightTab.git
synced 2025-06-30 06:11:09 +02:00
[design] improve link item name colour
This commit is contained in:
@ -1360,18 +1360,23 @@ var link = (function() {
|
||||
};
|
||||
if (stagedLink.link.color.by == "custom") {
|
||||
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;
|
||||
if (hsl.l < 50) {
|
||||
rgb = shades.positive["10"];
|
||||
} else {
|
||||
rgb = shades.negative["10"];
|
||||
};
|
||||
if (hsl.l < 50) {
|
||||
|
||||
if (hsl.l <= 50) {
|
||||
rgb = shades.positive["9"];
|
||||
linkItemStyle.push("--theme-style-text: var(--theme-white);");
|
||||
} else {
|
||||
rgb = shades.negative["9"];
|
||||
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-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 + ";");
|
||||
|
@ -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 shadeMin = 1;
|
||||
var contrastNeg = state.get.current().theme.color.contrast.dark;
|
||||
var contrastPos = state.get.current().theme.color.contrast.light;
|
||||
var hsl = helper.convertColor.rgb.hsl(rgb);
|
||||
|
||||
if (options.contrastNegative == null || !options.contrastNegative) {
|
||||
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) {
|
||||
for (var key in rgb) {
|
||||
if (rgb[key] < 0) {
|
||||
@ -764,11 +780,12 @@ var theme = (function() {
|
||||
positive: {}
|
||||
};
|
||||
|
||||
// set light theme shades
|
||||
for (var i = shadeMax; i >= shadeMin; i--) {
|
||||
var rgb = helper.convertColor.hsl.rgb({
|
||||
h: hsl.h,
|
||||
s: hsl.s,
|
||||
l: hsl.l - (contrastNeg * i)
|
||||
l: hsl.l - (options.contrastNegative * i)
|
||||
});
|
||||
shadeColors.negative[i] = validateRGBNumber(rgb);
|
||||
};
|
||||
@ -778,7 +795,7 @@ var theme = (function() {
|
||||
var rgb = helper.convertColor.hsl.rgb({
|
||||
h: hsl.h,
|
||||
s: hsl.s,
|
||||
l: hsl.l + (contrastPos * i)
|
||||
l: hsl.l + (options.contrastPositive * i)
|
||||
});
|
||||
shadeColors.positive[i] = validateRGBNumber(rgb);
|
||||
};
|
||||
@ -786,7 +803,11 @@ var theme = (function() {
|
||||
return shadeColors;
|
||||
},
|
||||
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({
|
||||
object: state.get.current(),
|
||||
path: "theme.color.generated.negative",
|
||||
|
Reference in New Issue
Block a user