Is there a way to reverse switch buttons?

[Andrey Savchenko]

From documentation is seems implicitly that first switch buttons always corresponds to checkbox off and second button to checkbox on.

I am working on existing UI where some legacy settings are "check to disable". That is checkbox on leads to corresponding setting item getting disabled.

Replacing it with switch already helps a lot since I can provide clear label for states. However it results in some switches having enabled state on the right and some on the left. Also I can't style disabled state separately, since again it can be on the left or right.

Is there a possibility of reversing order of switch buttons for some of switches?

[Andrey Savchenko]

Ok, I seem to have managed it. :)

.switch-light.switch-yoast-seo-reverse input:checked ~ span a {
    left: 0;
}

.switch-light.switch-yoast-seo-reverse a {
    left: 50%;
}

.switch-light.switch-yoast-seo-reverse span span {
    float: right;
}

[Ionuț Colceriu]

Good work! 👍 That's the way I would have approached it as well.