XF 2.2 CSS selector of checkboxes

[Gri]

Hi there, I'd like to change the color of these checkboxes but couldn't find their correct CSS selector. Can you please help me?

Thanks.

 

[Gri]

Hi there, any ideas?

 

[Thunderfall]

Anyone know? I cam looking to change the color of the checkboxes as well.

 

[Thunderfall]

I managed to change the checkbox color by changing this rule.
But I wonder is there a better way than adding this rule to extra.less?

.formRow .iconic>i, .inputGroup .iconic>i, .inputChoices .iconic>i, .block-footer .iconic>i, .dataList-cell .iconic>i, .message-cell--extra .iconic>i, .formRow.dataList-cell--fa>a>i, .inputGroup.dataList-cell--fa>a>i, .inputChoices.dataList-cell--fa>a>i, .block-footer.dataList-cell--fa>a>i, .dataList-cell.dataList-cell--fa>a>i, .message-cell--extra.dataList-cell--fa>a>i, .formRow .iconic svg, .inputGroup .iconic svg, .inputChoices .iconic svg, .block-footer .iconic svg, .dataList-cell .iconic svg, .message-cell--extra .iconic svg, .formRow.dataList-cell--fa>a svg, .inputGroup.dataList-cell--fa>a svg, .inputChoices.dataList-cell--fa>a svg, .block-footer.dataList-cell--fa>a svg, .dataList-cell.dataList-cell--fa>a svg, .message-cell--extra.dataList-cell--fa>a svg {
color: #47a7eb;
fill: currentColor;
}

 

[orhanorak]

I managed to change the checkbox color by changing this rule.
But I wonder is there a better way than adding this rule to extra.less?

.formRow .iconic>i, .inputGroup .iconic>i, .inputChoices .iconic>i, .block-footer .iconic>i, .dataList-cell .iconic>i, .message-cell--extra .iconic>i, .formRow.dataList-cell--fa>a>i, .inputGroup.dataList-cell--fa>a>i, .inputChoices.dataList-cell--fa>a>i, .block-footer.dataList-cell--fa>a>i, .dataList-cell.dataList-cell--fa>a>i, .message-cell--extra.dataList-cell--fa>a>i, .formRow .iconic svg, .inputGroup .iconic svg, .inputChoices .iconic svg, .block-footer .iconic svg, .dataList-cell .iconic svg, .message-cell--extra .iconic svg, .formRow.dataList-cell--fa>a svg, .inputGroup.dataList-cell--fa>a svg, .inputChoices.dataList-cell--fa>a svg, .block-footer.dataList-cell--fa>a svg, .dataList-cell.dataList-cell--fa>a svg, .message-cell--extra.dataList-cell--fa>a svg {
color: #47a7eb;
fill: currentColor;
}

I'm trying to find the basic color (style properties) effecting these checkboxes. it works by the way.

There is another way also:

Unmaintained - Better Checkboxes (Now with radios!)

Overview This simple CSS insert adds a nice subtle UI tweak for your checkboxes. First, we'll fade out unchecked boxes and labels to a softer color, helping to give them a "deactivated" appearance. Next, we highlight the checkbox color when...

xenforo.com