I am using JavaFX with ControlsFX Glyph icons and fontawesome.
It works nicely with the default JavaFX Modena theme.
But when I add the yellowOnBlack CSS for high contrast, the icons turns to weird font shapes.
The Glyph source code explicitly sets the font family which I am passing "FontAwesome". Its sets thru Label.setFontFamily().
The control looks like this on Modena:
ToggleButton[id=btnHamburger, styleClass=toggle-button]''
Glyph@72cc2cbd[styleClass=label glyph-font]''
Text[text="", x=0.0, y=0.0, alignment=LEFT, origin=BASELINE, boundsType=LOGICAL_VERTICAL_CENTER, font=Font[name=FontAwesome, family=FontAwesome, style=Regular, size=14.0], fontSmoothingType=LCD, fill=0x333333ff]
When I add the yellowOnBlack it looks like this:
ToggleButton[id=btnHamburger, styleClass=toggle-button]''
Glyph@3bd84c6d[styleClass=label glyph-font]''
Text[text="", x=0.0, y=0.0, alignment=LEFT, origin=BASELINE, boundsType=LOGICAL_VERTICAL_CENTER, font=Font[name=System Regular, family=System, style=Regular, size=12.0], fontSmoothingType=LCD, fill=0xffff00ff]
It is overriding the font-family, which is weird because it was set thru the .setFontFamily().
That's because yellowOnBlack sets this CSS:
.text,
.text-input {
-fx-font-weight: bold;
}
It works if i do this:
.glyph-font .text {
-fx-font-weight: normal;
-fx-font-family: "FontAwesome";
}
But I cannot fix the -fx-font-family to "FontAwesome" because it's optional on the Glyph constructor.
Any alternative ideas to fix it?
Thanks.