checkbox renderTpl

[NickT]

Hello,
I was altering the checkbox to appear more like a natural checkbox in sencha touch 1.1 by adding this to checkbox config

    baseCls: 'x-plain',    renderTpl: [
        '<tpl if="fieldEl"><input id="{inputId}" type="{inputType}" name="{name}" class="{fieldCls}" tabIndex="-1" ',
        '<tpl if="checked"> checked </tpl>',
        ' value="{inputValue}">&nbsp;{label}</input>',
        '</tpl>'
    ],

this no longer works in 2.0. Can you advise as to what I can do in 2.0 to style the checkbox?

thanks

[mitchellsimoens]

It's done via CSS. Inspect it and start enabling/disabling things.

[rdougan]

The underlying HTML for the component actually uses a <input type="checkbox" /> tag.

The main CSS override you will need is below. However there are many other things you will need to add to make it look 'correct' in all devices.

.x-input-checkbox {
    -webkit-appearance: checkbox;
}