Checkbox does not render correctly

[shnplr]

CheckBoxSkin uses css selectors "box" and "mark"

public CheckBoxSkin(CheckBox checkbox) {
    super(checkbox, new ButtonBehavior<CheckBox>(checkbox));

    box.getStyleClass().setAll("box");
    innerbox = new StackPane();
    innerbox.getStyleClass().setAll("mark");
    ...
}

however mark is being redefined in bootstrap.css as:

mark,
.mark {
  -fx-background-color: #fcf8e3;
  -fx-padding: .2em;
}

this causes the checkbox to be small and the mark is not visible - a workaround is to redefine affected check-box style e.g. from modena in your css file (loaded after bootstrapfx.css)

.check-box:selected > .box > .mark,
.check-box:indeterminate  > .box > .mark {
    -fx-background-color: -fx-mark-highlight-color, -fx-mark-color;
}
.check-box > .box > .mark {
    -fx-background-color: null;
    -fx-padding: 0.416667em 0.416667em 0.5em 0.5em; /* 5 5 6 6 */
}
.check-box:indeterminate  > .box > .mark {
    -fx-padding: 0.666667em; /* 16x16 = 8+8 */
}

[shnplr]

Hi,
I'm still seeing effect of mark in bootstrapfx.css - the size is correct but the tick mark is yellow and there is no visual difference between selected and not.

.mark {
    -fx-background-color: #ff0;
    -fx-text-fill: #000;
    -fx-fill: #000;
}

Looks to be defined in _normalize.scss