Backgound color for spinner

UI Builder
1

I want to change the background color of a spinner component. I actually want to have a disk, which is not transparent.
I tried this by extending the definition of the css class base-spinner from the SDK. In the web I found that there is a background attribute for circle which I’m trying to use like this:

.my-spinner.base-spinner {
   circle {
     color: blue;                // this has an effect
     background: red;          // this has no effect
     stroke-dasharray: 2, 400;
     stroke-dashoffset: 0;
     animation: base-spinner_dash 1.5s ease-in-out infinite;
     stroke-linecap: round;
  }
};

Changing the border color works, this way. Setting the background has no effect.
Any idea how to achieve a non-transparent spinner?

Regards,

2

Hello @Klaas_Klever

Instead of background try fill

3

Hi @Dima ,
This is working! Thanks.
I could combine it also with the attribute opacity to control how “strong” the disk is filled.
Regards,

4

You can read about rgba colors in CSS, for example rgba(0,255,0,0.1) = very light green.