angular-bootstrap-scrolling-tabs
Version:
Angular directive for scrollable Bootstrap Tabs
59 lines (48 loc) • 1.37 kB
CSS
/**
* angular-bootstrap-scrolling-tabs
* @version v1.2.0
* @link https://github.com/mikejacobson/angular-bootstrap-scrolling-tabs
* @author Mike Jacobson <michaeljjacobson1@gmail.com>
* @license MIT License, http://www.opensource.org/licenses/MIT
*/
.scrtabs-tab-container * {
box-sizing: border-box; }
.scrtabs-tab-container {
height: 42px; }
.scrtabs-tab-container .tab-content {
clear: left; }
.scrtabs-tab-wrapper-container.force-height {
height: 42px; }
.scrtabs-tabs-fixed-container {
float: left;
height: 42px;
overflow: hidden;
width: 100%; }
.scrtabs-allow-scrollbar .scrtabs-tabs-fixed-container {
overflow-x: auto; }
.scrtabs-allow-scrollbar .scrtabs-tabs-fixed-container::-webkit-scrollbar {
display: none; }
.scrtabs-tabs-movable-container {
position: relative; }
.scrtabs-tabs-movable-container .tab-content {
display: none; }
.scrtabs-tab-scroll-arrow {
border: 1px solid #dddddd;
border-top: none;
color: #428bca;
cursor: pointer;
display: none;
float: left;
font-size: 12px;
height: 42px;
margin-bottom: -1px;
padding-left: 2px;
padding-top: 13px;
width: 20px; }
.scrtabs-tab-scroll-arrow:hover {
background-color: #eeeeee; }
.scrtabs-tab-scroll-arrow--is-on-edge {
pointer-events: none;
opacity: .5; }
.scrtabs-tabs-fixed-container ul.nav-tabs > li {
white-space: nowrap; }