Skip to main content

The mobile builder renders checkboxes as on/off switches. Is there an easy way to change that back to the simple square box with label to the right used by the desktop builder?

Custom Renderer… Not easy,  but it is what we have right now… 


Rob, yes I realised that a customer renderer would work and I might have to go down that path anyway since I probably want to do some visual rearrangement with multiple aligned columns and reponsive resizing. But since the first version of Skuid Mobile used regular checkboxes (not the flipswitch) and the Standard builder still does it I thought that there might be a simpler CSS way of doing most of the change. Just wanted to check this before I started on the custom renderer.


Peter I know you were looking for this months back but I only came across the issue myself, here is a CCS solution, no Custom Renderer needed!

/* Remove Switches */input[type=checkbox] {
    width: 20px;
    -webkit-appearance: checkbox;
    -moz-appearance: checkbox;
    border: 0 transparent;
    box-shadow: 0 0 0 #F5F5F5 inset;
}
inputbtype=checkbox]:checked:before {
    content: ‘’;
    margin-left: 0;
}
input    content: ‘’;
    background-image: none;
    display: none;
}


FYI CSS solution below.