Form

kitstrap2 provides form components: text inputs, toggles, file inputs, and form groups.

Textbox

<input class="kit-textbox" type="text" placeholder="Default textbox">

Textbox variants

<input class="kit-textbox -flat" type="text" placeholder="Flat textbox">
<input class="kit-textbox -rounded" type="text" placeholder="Rounded textbox">

Textbox sizes

<input class="kit-textbox -small" type="text" placeholder="Small">
<input class="kit-textbox -medium" type="text" placeholder="Medium">
<input class="kit-textbox -large" type="text" placeholder="Large">

Textarea

<textarea class="kit-textbox" placeholder="Textarea"></textarea>

Toggle switch

Toggle option

<div class="kit-toggle">
  <span>Toggle option</span>
  <input type="checkbox" id="toggle1">
  <label for="toggle1"></label>
</div>

File input

Choose file

<div class="kit-input-file">
  Choose file
  <input type="file">
</div>

Form group

Combine textboxes and buttons into a connected group.

<div class="kit-formgroup">
  <input class="kit-textbox" type="text" placeholder="Search...">
  <button class="kit-button -primary">Go</button>
</div>