Checkbox CSS
-
Hey,
I’am using the beta6 and try create a view with checkboxes looking like this:
My checkboxes look like this:
So it seems the css is missing.
In the example,
https://onsen.io/pattern-checkbox_list.htmlit seems there is no special CSS needed.
So I don’t know why it is not working.
My Code:
.... <ons-list> <ons-list-header>Title</ons-list-header> <ons-list-item modifier="tappable"> <label class="checkbox checkbox--list-item"> <input type="checkbox" checked="checked"> <div class="checkbox__checkmark checkbox--noborder__checkmark checkbox--list-item__checkmark"></div> Checkbox 1 </label> </ons-list-item> .....
Thank you in advance
-
You are using the reference of onsen1.0 not onsen2.0, please have a look at this url: https://onsen.io/2/index.html
<ons-list> <ons-list-item> <label class="checkbox--noborder"> <input type="checkbox" class="checkbox__input checkbox--noborder__input"> <div class="checkbox__checkmark checkbox--noborder__checkmark"></div> OFF </label> </ons-list-item> <ons-list-item> <label class="checkbox--noborder"> <input type="checkbox" class="checkbox__input checkbox--noborder__input" checked="checked"> <div class="checkbox__checkmark checkbox--noborder__checkmark"></div> ON </label> </ons-list-item> <ons-list-item> <label class="checkbox--noborder"> <input type="checkbox" class="checkbox__input checkbox--noborder__input" disabled checked="checked"> <div class="checkbox__checkmark checkbox--noborder__checkmark"></div> Disabled </label> </ons-list-item> </ons-list>
I also did a Codepen-Link: http://codepen.io/anon/pen/eJKXYX
-
@patrick Thank you!