icheck-bootstrap

WebJar for icheck-bootstrap

License

License

MIT
GroupId

GroupId

org.webjars.npm
ArtifactId

ArtifactId

icheck-bootstrap
Last Version

Last Version

3.0.1
Release Date

Release Date

Type

Type

jar
Description

Description

icheck-bootstrap
WebJar for icheck-bootstrap
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/bantikyan/icheck-bootstrap

Download icheck-bootstrap

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.npm/icheck-bootstrap/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>icheck-bootstrap</artifactId>
    <version>3.0.1</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.npm/icheck-bootstrap/
implementation 'org.webjars.npm:icheck-bootstrap:3.0.1'
// https://jarcasting.com/artifacts/org.webjars.npm/icheck-bootstrap/
implementation ("org.webjars.npm:icheck-bootstrap:3.0.1")
'org.webjars.npm:icheck-bootstrap:jar:3.0.1'
<dependency org="org.webjars.npm" name="icheck-bootstrap" rev="3.0.1">
  <artifact name="icheck-bootstrap" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.npm', module='icheck-bootstrap', version='3.0.1')
)
libraryDependencies += "org.webjars.npm" % "icheck-bootstrap" % "3.0.1"
[org.webjars.npm/icheck-bootstrap "3.0.1"]

Dependencies

There are no dependencies for this project. It is a standalone project that does not depend on any other jars.

Project Modules

There are no modules declared in this project.

icheck-bootstrap

bower version npm version nuget version

Did you had a problem customizing html checkboxes and radio buttons? icheck-bootstrap is pure css solution for displaying twitter bootstrap style checkboxes and radio buttons. Try Demo.

You may also like to try icheck-material.
Love cool tech? Check out CoolTechUnder.com

Table of contents

Getting started

Several quick start options are available:

HTML syntax

checkbox example

<div class="icheck-primary">
    <input type="checkbox" id="someCheckboxId" />
    <label for="someCheckboxId">Click to check</label>
</div>

radio buttons example

<div class="icheck-primary">
    <input type="radio" id="someRadioId1" name="someGroupName" />
    <label for="someRadioId1">Option 1</label>
</div>
<div class="icheck-primary">
    <input type="radio" id="someRadioId2" name="someGroupName" />
    <label for="someRadioId2">Option 2</label>
</div>

inline styling

To have checkboxes or radio buttons inline use .icheck-inline class

<div class="icheck-primary icheck-inline">
    <input type="checkbox" id="chb1" />
    <label for="chb1">Label 1</label>
</div>
<div class="icheck-primary icheck-inline">
    <input type="checkbox" id="chb2" />
    <label for="chb2">Label 2</label>
</div>

disabled

Use disabled attribute on your input (checkbox or radio) to have disabled style.

no label

To have components without label, you still have to have label control with empty text.

<div class="icheck-primary">
    <input type="checkbox" id="someCheckboxId" />
    <label for="someCheckboxId"></label>
</div>

ASP.NET MVC syntax

checkbox example

<div class="icheck-primary">
    @Html.CheckBoxFor(m => m.SomeProperty, new { id = "someCheckboxId" })
    <label for="someCheckboxId">Click to check</label>
</div>

radio buttons example

<div class="icheck-primary">
    @Html.RadioButtonFor(m => m.SomeProperty, SomeValue1, new { id = "someRadioId1" }) 
    <label for="someRadioId1">Option 1</label>
</div>
<div class="icheck-primary">
    @Html.RadioButtonFor(m => m.SomeProperty, SomeValue2, new { id = "someRadioId2" })
    <label for="someRadioId2">Option 2</label>
</div>

Color schemes

Try Demo

Twitter Bootstrap: As you can see in previous examples, icheck-primary class used for styling. You can use following classes for Twitter Bootstrap color scheme:

.icheck-default
.icheck-primary
.icheck-success
.icheck-info
.icheck-warning
.icheck-danger

Flat UI Colors: Also you can use one of the really nice colors from flatuicolors.com

.icheck-turquoise
.icheck-emerland
.icheck-peterriver
.icheck-amethyst
.icheck-wetasphalt
.icheck-greensea
.icheck-nephritis
.icheck-belizehole
.icheck-wisteria
.icheck-midnightblue
.icheck-sunflower
.icheck-carrot
.icheck-alizarin
.icheck-clouds
.icheck-concrete
.icheck-orange
.icheck-pumpkin
.icheck-pomegranate
.icheck-silver
.icheck-asbestos

License

icheck-bootstrap released under the MIT license. Feel free to use it in personal and commercial projects.

Versions

Version
3.0.1