How to extend default ValoTheme.SOME_VAR in scss

General
1

Hi all !
I`m sorry for my english, hope you can help me.

So, i meet some difficulties in uderstanding Valo extending. I like existing approach to configure components appearance (i.e. label.setStyleName(ValoTheme.LABEL_FAILURE)), but how can i extend ValoTheme.LABEL_FAILURE in my own custom theme.

I can see appropriate configuration in browser css viewer and then write my castom style with this config. But this approach is very unconvenient =(

I hope that existists some other approach, something like
.customLabelStyle
{
@include ValoTheme.LABEL_FAILURE();
//some changes over ValoTheme.LABEL_FAILURE
//e.g i want remove icon and change border color
}

2

Hello Sergey!

If you inspect the DOM, you’ll see that the class of a LABEL_FAILURE styled label contains
v-label-failure
.

If you want to overwrite it:

.v-label-failure {
  // something...
}

If you want to extend it:

.my-label {
  @extend .v-label-failure;
  // something...
}