JSFiddle - React, Tailwind, and code Playground

by shimmy

HTML

<button type="button" class="btn btn-primary" data-toggle="button" aria-pressed="false" autocomplete="off">
  Single toggle
</button>

<hr/>

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary active">
      <input type="checkbox" autocomplete="off" checked="checked"/> Checkbox 1 (pre-checked)
  </label>
  <label class="btn btn-primary">
      <input type="checkbox" autocomplete="off"/> Checkbox 2
  </label>
  <label class="btn btn-primary">
      <input type="checkbox" autocomplete="off"/> Checkbox 3
  </label>
</div>

<hr/>

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary">
      <input type="checkbox" autocomplete="off"/> Single checkbox
  </label>
</div>

<hr/>

<div class="form-group col-md-2">
    <div class="input-group">
        <span class="input-group-addon">
            <input type="checkbox"/>
        </span>
        <input type="text" class="form-control"/>
    </div><!-- /input-group -->
</div>

<hr/>

<div class="form-group col-md-2">  
    <div class="input-group">
        <span class="input-group-btn">
            <button class="btn btn-default" type="button">Go!</button>
        </span>
        <input type="text" class="form-control" placeholder="Search for..."/>
    </div><!-- /input-group -->
</div>

<hr/>

<div class="form-group col-md-2">  
    <div class="input-group">
        <span class="input-group-btn" data-toggle="buttons">
            <button class="btn btn-default" type="button">
               <input type="checkbox" autocomplete="off"/> Single checkbox 
            </button>
        </span>
        <input type="text" class="form-control" placeholder="Search for..."/>
    </div><!-- /input-group -->
</div>