JSFiddle - React, Tailwind, and code Playground

This is a simple Twitter Bootstrap 3 template. You can fork it to get a ready to use Bootstrap 3 fiddle.

by Dug Sohn

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.8.0/bootstrap-table.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.8.0/bootstrap-table.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<br><br>    <div class="row">
         <div class="col-md-3 col-sm-12 clearfix">
          <div class="bg-plans-round col-xs-2 col-sm-2 col-md-8 col-md-offset-4">
            2
        </div>

          <h3 class="text-center col-xs-8 col-sm-8 col-md-12">Choose Your Final Bill Destination</h3>
          <div class="hidden">
            <label class="radio-inline  col-sm-6">
              <input type="radio" formControlName="service_address" value="Current Address">
              Your Current Address </label>
            <label class="radio-inline  col-sm-6">
              <input type="radio" formControlName="service_address" value="New Address" >
              Your New Address </label>
          </div>
        </div>
      <div class="hidden-xs hidden-sm col-md-1">
        <i class="fa fa-chevron-right fa-3x"></i>
      </div>
      <div class="col-sm-12 col-md-8">

         <div class="row text-center">
          <div class="container-fluid">
            <div class="col-sm-12">
             <small class="alert alert-warning"> Please select final service address</small>
            </div>
          </div>
        </div>

         <div class="row text-center">
           <div class="col-xs-6 col-md-6">
             <button class="btn btn-default btn-block" [ngClass]="{ 'btn-primary': isUseCurrent }"  (click)="useCurrentAddress()"><i class="fa fa-check" style="visibility: hidden" ></i> CURRENT ADDRESS</button>
           </div>
           <div class="col-md-1...

SCSS

$account-base:  rgba(6,81,128,1.0)       !default;
$plans-base:    rgba(254,162,32,1.0)     !default;
$payment-base:  rgba(46,177,52,1.0)      !default;
$control-base:  rgba(27,141,205,1.0)     !default;
$footer-base:   rgba(231,231,231,1.0)    !default;
$dark-base:     rgba(10,10,10,1.0)       !default;
$highlight-row:  rgba(241,240,207, 0.8) !default;

.moving-address-form{
    h3 {
        margin-bottom:1em;
    }

}

.change-plans-grid {
 background-color:  rgba(251,247,220,1.0);
padding-top:30px;
}

.plans-bg {
  color: $plans-base;
}
.bg-plans-round {
  height: 60px;
  width: 60px;
  border-radius:30px;
  background-color: $plans-base;
    text-align: center;
    padding-top: 6px;
    font-size: 32px;
    color: #fff;
}
.btn-primary .fa {
  visibility: visible !important;
}
.fa-3x {
  margin-top: 30px;
  color: #ccc;
}
.agreement-text {
  max-height: 78px;
  overflow-y: auto;
}

small.alert {
  display: block;
  margin: 15px 0;
  padding: 5px;
}


.filter-wrapper,
.keyword-wrapper {
  display: flex;
  justify-content: center;
}
.filter-wrapper {
  min-height: 100%;
  flex-flow: column wrap;;
  position: relative
}
.keyword-wrapper {
  width: 100%;
  position: relative;
}
// #keyword {
//   border: 1px solid #ccc;
//   padding: 10px;
//   font: 1.5em 'Arimo', sans-serif;
//   width: 100%;
//   outline: none;
//   transition: border 0.5s ease-in-out
// }
#keyword:focus {
  border-color : rgba(81, 203, 238, 1);;
}
#keyword-button {
  position: absolute;
  right: 26%;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.7em;
  color: #8DB9ED
}
#keyword-button:hover {
  color: #ccc
}
.filter-select {
  padding-left: 0;
  width: 100%;
  list-style: none;
  color: rgb(105, 105, 105);
  border: 1px solid #ccc;
  border-top: none;
  /*so things don't jump around*/
  //position: absolute;
  //left: 25%;
  top: calc(50% + 25px);
 // max-height: calc(50% - 15px);
  overflow-y: auto;
  background: #fff
}
.filter-select-list img {
  margin-right: 30px;
}
.tags {
 ...