JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/bootstrap/3.3.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/bootstrap/3.3.0/css/bootstrap-theme.min.css">
<script src="https://cdn.jsdelivr.net/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<div dir="rtl" ng-show="buildings.total_buildings" tooltip="מגוון פעולות שניתן לבצע על הרשומות שבחרתם" class="btn-group">
    <button class="btn btn-default dropdown-toggle btn-lg" data-toggle="dropdown"> <i class="fa fa-lg fa-building "></i>
 <span class="caret"></span>  <span class="badge_success badge">{{buildings.total_buildings}}</span>

    </button>
    <ul class="dropdown-menu">
        <li> <a href="javascript:void(0);" ng-click="buildings.user.exportHtmlTableToPdf('buildings_table', 'lskd')"><i class="fa fa-file-pdf-o"></i>&nbsp;&nbsp;&nbsp;&nbsp;יצא לקובץ pdf</a>

        </li>
        <li class="dropdown-submenu pull-left"> <a href="javascript:void(0);"><i class="fa fa-envelope-o"></i>&nbsp;&nbsp;&nbsp;&nbsp;שלח מייל</a>

            <ul href="javascript:void(0);" class="dropdown-menu">
                <li><a href="javascript:void(0);"><i class="fa fa-building"></i>&nbsp;&nbsp;&nbsp;&nbsp;כולם</a>

                </li>
                <li><a href="javascript:void(0);"><i class="fa fa-building owner"></i>&nbsp;&nbsp;&nbsp;&nbsp;בעלים</a>

                </li>
                <li><a href="javascript:void(0);"><i class="fa fa-building renter"></i>&nbsp;&nbsp;&nbsp;&nbsp;שוכרים</a>

                </li>
                <li><a href="javascript:void(0);"><i class="fa fa-building defecto"></i>&nbsp;&nbsp;&nbsp;&nbsp;דיירים</a>

                </li>
            </ul>
        </li>
        <li class="dropdown-submenu pull-left"> <a href="javascript:void(0);" ng-click="return"><i class="fa fa-comment-o"></i>&nbsp;&nbsp;&nbsp;&nbsp;שלח סמס</a>

            <ul...

CSS

/* 

.input-append .add-on, .input-prepend .add-on {
display: inline-block;
width: auto;
height: 20px;
min-width: 16px;
padding: 4px 5px;
font-size: 14px;
font-weight: normal;
line-height: 20px;
text-align: center;
text-shadow: 0 1px 0 #fff;
background-color: #eee;
border: 1px solid #ccc;
}


.dropdown-menu li>a:hover, .dropdown-menu li>a:focus, .dropdown-submenu:hover>a {
color: #fff;
text-decoration: none;
background-color: #0081c2;
background-image: -moz-linear-gradient(top,#08c,#0077b3);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#08c),to(#0077b3));
background-image: -webkit-linear-gradient(top,#08c,#0077b3);
background-image: -o-linear-gradient(top,#08c,#0077b3);
background-image: linear-gradient(to bottom,#08c,#0077b3);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc',endColorstr='#ff0077b3',GradientType=0);
}
.dropdown-menu li>a {
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 20px;
color: #333;
white-space: nowrap;
}


.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
display: none;
float: left;
min-width: 160px;
padding: 5px 0;
margin: 2px 0 0;
list-style: none;
background-color: #fff;
border: 1px solid #ccc;
border: 1px solid rgba(0,0,0,0.2);
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
-moz-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
box-shadow: 0 5px 10px rgba(0,0,0,0.2);
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
 */
 @import url(http://fonts.googleapis.com/earlyaccess/alefhebrew.css);
 body {
    font-family:"Alef Hebrew", “Helvetica Neue”, Helvetica, Arial, sans-serif !important;
}
#search-sam-components-bar {
    padding-left: 305px;
}
#search-button-td {
    padding-left: 10px;
}
#search-button {
    width: 143%;
}
.logo_in_header {
    width: 6%;
}
/* taken from bootstrap combined */
...