JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://08.kiev.ua/00/libs/bs/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://yastatic.net/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="contaner">
    <div class="row panel panel-primary">
        <div class="col-xs-12 panel-heading">header</div>
    </div>
    <div class="row" style="height: 200px">
        <div class="col-xs-4 pandel-body row2" style="height: 100%">
            text 2text 1text 1text 1text 1 rotext 1text 1text 1text 1text 1text 1text 1text 1text 1text 1text 1text 1
        </div>
        <div class="col-xs-8 pandel-body row1" style="height: 100%">
            <div class="toggle-btn active" data-val="nav-arr">
                <input type="checkbox" checked class="cb-value"/><span class="round-btn"></span>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="pandel-body">
            <div class="col-xs-4 row1">text 3</div>
            <div class="col-xs-4 row2"><input type="checkbox" checked class="cb-value"/><span class="round-btn"></span>text
                1text 1text 1text 1text 1text 1text 1text 1
            </div>
        </div>

    </div>
</div>

CSS

.row1	{ background-color: #EFEFEF; }
  .row2	{ background-color: #DEE3E7; }
  .row3	{ background-color: #D1D7DC; }