Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
Make CheckBox Tick Red
Hi All,
I have the following code:
checkBox.setStyleName("dangerCheckBox");
.v-checkbox.dangerCheckBox {.v-checkbox > input:checked { color: #ff1c41; } }
I have used the sampler but cannot figure out how the "focusColor #ff1c41" and "selectionColor #ff1c41" are set.
If a css champion can please show a complete amature what I am missing I would very much appreciate it.
Regards
Johann
In your mytheme.scss inside the mytheme mixin after include @valo;
For example.
.v-checkbox-danger {
@include valo-checkbox-style($v-background-color, $v-unit-size, #f00);
}
Compiled the scss for the checkmark becomes as css:
:root .mytheme .v-checkbox-danger > input:checked ~ label:after {
color: #f00;
}
But that's too heavy syntax for me already and requires a css champion (I'm not)