<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <div class=" well col-xs-6 col-md-3"> RM234567</br> <b>Permata Sari</b></br> 29 tahun / 23 Jan 1986 <hr> <ul class="nav nav-pills nav-stacked"> <li role="presentation"><a href="#"><span class="glyphicon glyphicon-dashboard" aria-hidden="true"></span> Dashboard</a></li> <li role="presentation" class="active"><a href="#"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span> Anamnesa</a></li> <li role="presentation"><a href="#"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Rekam Medis</a></li> <li role="presentation"><a href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span> Diagnosis</a></li> <li role="presentation" ><a href="#"><span class="glyphicon glyphicon-heart" aria-hidden="true"></span> Tindakan Medis</a></li> <li role="presentation"><a href="#"><span class="glyphicon glyphicon-align-left" aria-hidden="true"></span> Hasil Radiologi</a></li> </ul> </div> <div class=" col-xs-12 col-sm-6 col-md-9"> <h3><span class="glyphicon glyphicon-heart" aria-hidden="true"></span> Anamnesa</h3> <div class="panel panel-default"> <div class="panel-heading"> <div class="row"> <div class="col-md-5"> <h4>Survey</h4> </div> <form class="form-inline"> <div class=""> <div class="form-group"> <div class="input-group"> <input type="text" class="form-control" id="weightInput" placeholder="Berat badan"> <div class="input-group-addon">kg</div> </div> </div> <div class="form-group"> <div class="input-group"> <input type="text" class="form-control" id="heightInput" placeholder="Tinggi badan"> <div class="input-group-addon">cm</div> </div> </div> </div> </form> </div> </div> <div class="row"> <div class="col-md-3" style=" margin-left: 30px;"> <div class="radio"> <label> <input type="radio" name="statsAnamnesa" id="statsAutoAnamnesa" value="autoAnamnesa" checked> Auto-anamnesa </label> </div> </div> <div class="col-md-7"> <div class="radio"> <label> <input type="radio" name="statsAnamnesa" id="statsAlloAnamnesa" value="alloAnamnesa"> Allo-anamnesa <div class="input-group"> <div class="input-group-addon">Dengan nama</div> <input type="text" class="form-control" id="anamnesaWith" placeholder="Nama"> </div> <div class="input-group"> <div class="input-group-addon">Hubungan dengan pasien</div> <input type="text" class="form-control" id="anamnesaRelation" placeholder="Hubungan"> </div> </label> </div> </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"><h4>Keluhan Utama</h4></div> <textarea class="form-control" placeholder="Deskripsi keluhan utama" rows="3"></textarea> </div> <div class="panel panel-default"> <div class="panel-heading"><h4>Perjalanan Penyakit</h4></div> <textarea class="form-control" placeholder="Deskripsi perjalanan penyakit" rows="3"></textarea> </div> <div class="panel panel-default"> <div class="panel-heading"><h4>Alergi</h4></div> <div class="row"> <div class="col-md-3" style=" margin-left: 30px;"> <div class="radio"> <label> <input type="radio" name="alergyOption" id="alergyNo" value="tidakAda" checked> Tidak ada </label> </div> </div> <div class="col-md-8"> <div class="radio"> <label> <input type="radio" name="alergyOption" id="alergyYes" value="ada"> Ada </label> <textarea class="form-control" placeholder="Deskripsi alergi" rows="2"></textarea> </div> </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"><h4>Obat yang sedang dikonsumsi</h4></div> <textarea class="form-control" placeholder="Deskripsi obat" rows="3"></textarea> </div> <div class="panel panel-default"> <div class="panel-heading"><h4>Informasi Tambahan</h4></div> <textarea class="form-control" placeholder="Informasi tambahan" rows="3"></textarea> </div> </div> </div>