/* Define your theme modifications inside next mixin */
@mixin com_dtc_callbook-halo-ext {
$background-colors: #ff0000, #00ff00, #0000ff, #ffff00, #ff5f00, #00c9ff;
$text-colors: #000000, #000000, #000000, #000000, #000000, #000000;
@for $i from 1 through 6 {
.v-select-optiongroup.event-type-label:nth-child(#{$i}) {
background-color: nth($background-colors, $i);
color: nth($text-colors, $i);
}
}
}
This halo-ext.scss file doesn’t compile saying
[CubaWebScssThemeCreation] Error on SCSS traverse
com.vaadin.sass.internal.parser.SCSSParseException: Error when parsing file com.dtc.callbook/halo-ext
Encountered ")" at line 7, column 59.
Was expecting one of:
"}"
However if we paste this into
adding @include com_dtc_callbook-halo-ext() in the end, we’ll get
.v-select-optiongroup.event-type-label:nth-child(1) {
background-color: red;
color: black;
}
.v-select-optiongroup.event-type-label:nth-child(2) {
background-color: lime;
color: black;
}
and so on… Is this vaadin bug? How can I workaround it?
The interesting thing is that if we look at this forum’s syntax highlighter we’ll see exactly same (bug?) The #{$i}) { is treated incorrectly after label:nth-child( Am I wrong with the syntax?