JSFiddle - React, Tailwind, and code Playground

by irwan dwiyanto

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
						<div class="col-md-6">
							<label for="status">Status</label><br/>
							<div class="btn-group" data-toggle="buttons">
								<label class="btn btn-default btn-on btn-sm ">
								<input type="radio" value="0"  name="status" id="aktif" >Active</label>
								<label class="btn btn-default btn-off btn-sm active">
								<input type="radio" value="1" name="status" id="deaktif" >Deactive</label>							
							</div>
						</div>

CSS

.btn-default.btn-on.active{background-color: #5BB75B;color: white;}
.btn-default.btn-off.active{background-color: #DA4F49;color: white;}