Change list component's auto-divider color?

[Mike6580064]

How can I change my list component's auto-divider background color?

*Note: I'm using the flat-ui theme (swatch F) with a label placed inside of the list component (causing the list item color to be white, which I'm ok with).

[Evgene Karachevtsev]

Hello Mike,

You can choose swatch (change color) for divider in the UI builder in the properties of list_component like in the screenshot:

[Mike6580064]

Evgene,

Thanks. Is there a way to specify a custom color other than the theme's swatches?

[Evgene Karachevtsev]

Mike,

Of course. You may set any color using custom css

[Mike6580064]

Evgene,

Yes but what would the css property be for the list component's auto divider?

[Evgene Karachevtsev]

Mike,

If you want to set a specific color for all separators in all the lists, please try this code

code[data-role="list-divider"].ui-li-divider{
background-color:#ff0000;
}
if it is necessary for certain tiles to do this, add to these sheets of any class, for example redDivider, and use the css

.redDivider [data-role="list-divider"].ui-li-divider{
background-color:#ff0000;
}/code

[Mike6580064]

Great thanks