Hi Rob,
If you want to change the checkbox styles then you can use something like below example css to acheive what you want? (this css is for checkbox but if you want to implement this on radio buttons then change input type to radio input[type=radio] )
You have to just add tick and cross images or svg's in your images folder. Or if you just want to use red and green background without images then don't need to worry about adding images.
input[type="checkbox"] {
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-moz-box-shadow: inset 0px 1px 2px #C8C8BE;
-webkit-box-shadow: inset 0px 1px 2px #C8C8BE;
box-shadow: inset 0px 1px 2px #C8C8BE;
height: 26px;
width: 26px;
background: url(/styles/resources/images/cross-white.png) center/17px 12px no-repeat;
background:red;
float: left;
position: relative;
margin-top: 15px;
margin-right: 0px;
cursor: pointer;
}
input[type="checkbox"]:checked {
background: url(/styles/resources/images/tick-white.png) center/17px 12px no-repeat;
background-color: green;
}
Hope this helps!
Cheers,
Mohammed Siddiqui
Hi Rob,
Maybe this is something you are looking for:
https://appstore.home.mendix.com/link/app/1798/Mendix/Boolean-Slider
https://appstore.home.mendix.com/link/app/2586/Mendix/ICheck-Checkboxes
You have to play a little bit with the HTML element structure, which is always a challenge in Mx. But the goal should be something like this fiddle. I managed to build this into a custom widget, but might also be possible in a default Mx page.