1. Summary
I can’t find how I can overwrite via my color scheme colors in Sublime Text popups, if colors has variables and the color-mod function.
2. MCVE
For example, I have the file KiraExample.coffee:
kiraVariable = "Goddess"
if not kiraVariable
console.log("Kira Goddess!")
I hovered the second kiraVariable:
Color of the text “CoffeeScript 2” in the element <span class="syntax"> has a bad visibility.
(Also, I can’t change colors for the v label on the left, but possibly it should be another question)
Yes, I can change the value of the --foreground variable in my color scheme file:
body#show-definitions
{
--foreground: red;
}
Result:
But the color for the <span class="syntax"> in this case isn’t red, compare colors of the text CoffeeScript 2 and a red rectangle around it. The color of the text CoffeeScript 2 is a red with 50% opacity.
What should I do to make the color of the text CoffeeScript 2 red without opacity?
3. Default Sublime popup colors
Sublime Text 4 settings for default “Definition” and “References” popups are in the file symbol.py. symbol.py settings related to my question:
span.syntax {
color: color(var(--foreground) a(0.5));
padding-left: 10px;
font-style: italic;
font-size: 0.9em;
}
<body id=show-definitions>
<style>
body {
font-family: system;
/*
Necessary due to COOPERATE_WITH_AUTO_COMPLETE
changing the margin to align with AC window
*/
margin: 8px;
}
%s
</style>
<h1>Definition%s</h1>
<p>%s</p>
</body>
link_markup = ('<span class="{class_name}" title="{name}">{letter}</span>'
'<a href="{href}">{location}</a> '
'<span class="syntax">{syntax}</span>')
4. Not helped
Addition any of these CSS to my color scheme file has no effect for me:
body#show-definitions span.syntax
{
color: red !important;
}
body#show-definitions span.syntax
{
color: color(var(--foreground) a(1)) !important;
}
body#show-definitions
{
--custom-color: red;
}
body#show-definitions span.syntax
{
color: color(var(--custom-color) a(1)) !important;
}