JSFiddle - React, Tailwind, and code Playground

by Dhanck

HTML

<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog modal-lg">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <button type="button" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-plus"></span><span class="glyphicon glyphicon-file"></span>

                </button>
                <div class="btn-group">
                    <button type="button" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-th"></span>

                    </button>
                    <button type="button" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-align-justify"></span>

                    </button>
                </div>
                <div class="col-sm-3 pull-right">
                    <div class="input-group">
                        <input type="text" class="form-control input-sm" placeholder="Search file..."> <span class="input-group-btn">
        <button class="btn btn-default btn-sm" type="button"><span class="glyphicon glyphicon-search"></span>

                        </button>
                        </span>
                    </div>
                </div>
                <div class="pull-right">Filter:
                    <div class="btn-group">
                        <button type="button" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-file"></span>

                        </button>
                        <button type="button" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-picture"></span>

                        </button>
                        <button type="button" class="btn btn-default btn-sm"><span class="glyphicon...

CSS

.dropdow-pull-right {
    text-align:right;
    padding-right:20px;
}
.modal-header-custom {
    height: 30px;
    background-color: #F7F7F7;
    padding: 6px 10px 0 15px;
    color: #333;
}
.sub-header-position {
    float: right;
    margin-top: -2px;
}