Custom Checkbox with Font Awesome (Sass, Rails)
Cleaned up the code from CSS-Tricks and combined with icons from Font Awesome.
Sass code:
label.checkbox {width:100%; cursor:pointer; overflow: hidden;
input[type=checkbox] {float:left; position:relative; margin-left:-9999px;}
i:before {width:25px; content: "\f096"; }
input[type=checkbox]:checked + i:before {content: "\f046";}
}
Rails 3 view:
<fieldset>
<%= form.label :newsletter, :class => 'checkbox' do %>
<%= form.check_box :newsletter %>
<i class="icon-"></i> Join up!
<% end %>
</fieldset>
Written by Adi Wibisono
Related protips
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Rails
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#