JSFiddle - React, Tailwind, and code Playground

HTML

<div class="navbar-inverse">
    <div class="navbar-inner">
        <ul>
            <li><a href="#">1212</a></li>
            <li><a href="#">3232</a></li>
            <li><a href="#">LINK</a></li>
        </ul>
    </div>
</div>

CSS

.navbar-inverse .navbar-inner {
    background-color: #1b1b1b;
    background-image: -moz-linear-gradient(top, #222222, #111111);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#222222), to(#111111));
    background-image: -webkit-linear-gradient(top, #222222, #111111);
    background-image: -o-linear-gradient(top, #222222, #111111);
    background-image: linear-gradient(to bottom, #222222, #111111);
    background-repeat: repeat-x;
    border-color: #252525;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff111111', GradientType=0);
}
.navbar-inverse .navbar-inner {
    background:violet;
    border:0 none;
    filter:none;
}