Howto embed font variants in JavaFX

Question

I need to embed local .ttf files on a JavaFX project with some variants (bold, italic and so on) but the css parser seems to not support font properties in @font-face declaration:

@font-face {
    font-family: 'Open Sans', sans-serif;
    src: url('fonts/OpenSans-Regular.ttf');
}
@font-face {
    font-family: 'Open Sans', sans-serif;
    src: url('fonts/OpenSans-Bold.ttf');
    font-weight: bold;
}
@font-face {
    font-family: 'Open Sans', sans-serif;
    src: url('fonts/OpenSans-ExtraBoldItalic.ttf');
    font-style: italic;
}

WARNING: CSS Error parsing jar:file:/home/test/dist/run736633436/test.jar!/it/test/vending/css/application.css: Unexpected TOKEN [:] at [8,15] mag 06, 2015 3:40:15 PM com.sun.javafx.css.parser.CSSParser fontFace WARNING: CSS Error parsing jar:file:/home/test/dist/run736633436/test.jar!/it/test/vending/css/application.css: Unexpected TOKEN [:] at [13,14]

How could I achieve this?

==EDIT==

---

Notice that the parser complains on font-weight: bold; and font-style: italic; rules.

Answer 1

I think I found a solution. Try to swap the font-weight and font-style attributes with the src attribute. In your case your css would look like:

@font-face {
    font-family: 'Open Sans', sans-serif;
    src: url('fonts/OpenSans-Regular.ttf');
}
@font-face {
    font-family: 'Open Sans', sans-serif;
    font-weight: bold;
    src: url('fonts/OpenSans-Bold.ttf');
}
@font-face {
    font-family: 'Open Sans', sans-serif;
    font-style: italic;
    src: url('fonts/OpenSans-ExtraBoldItalic.ttf');
}

I had the same issue and swapping the attributes did the job. I have no idea why that is but it seems to resolve the issue.