Checkbox Input Component

Checkbox Input component is an input field for capturing multiple choices from multiple options decision from user. Bissetii did a number of researches on its own and decided to only provide styling for proper HTML5 semantic syntax defined by w3.org.

This component is available starting from v1.12.1.

Hugo

All Checkbox Input Hugo interface is directly supported by Form Component.

Go

All Checkbox Input Go interface is directly supported by Form Component.

HTML

Expanding from Form Component, Checkbox is meant for multiple fixed values selection.

To properly use it with Bissetii:

1. All options for a subject shall share the same value for name= attribute.
2. The <label> is always exists after the <input> for styling requirement.

An all compatible attributes HTML syntax is shown as follows:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

<ul>
	<li>
		<input type="checkbox"
			id="input-javascript-id"
			name="example"
			value="Checked by Default"
			checked
			required
			disabled
			autofocus
		/>
		<label for="input-javascript-id">Label Here</label>
	</li>
	...
</ul>

Here is an example:

CSS

All Checkbox Input CSS variables is directly supported by Form Component.

Javascript

All Checkbox Input Javascript is directly supported by Form Component.

Sass

All Checkbox Input Sass is directly supported by Form Component.

Researches

Here are the researches done to ensure Checkbox Input component meets the necessary quality assurances:

SCHEDULED COMING SOON

Epilogue

That’s all about Checkbox Input component in Bissetii. If you need more feature or need to report a bug, please feel free to file an issue at our Issue Section.