ul.nav {
display: inline-block;
}
.nav {
padding-left: 0; margin-bottom: 0; list-style: none; > li { position: relative; display: block; > a:not(.button) { position: relative; display: block; padding: 10px 15px; &:hover, &:focus { text-decoration: none; background-color: #eee; } } } > li.disabled { > a:not(.button) { color: #777; } } // Tabs &.tabs, &.nav-tabs { border-bottom: 1px solid #ddd; width: 100%; > li { float: left; margin-bottom: -1px; > a:not(.button) { margin-right: 2px; line-height: 1.42857143; border: 1px solid transparent; border-radius: 4px 4px 0 0; &:hover { border-color: #eee #eee #ddd; } } &.active > a:not(.button) { &, &:hover, &:focus { color: #555; cursor: default; background-color: #fff; border: 1px solid #ddd; border-bottom-color: transparent; } } } // Justified Tabs &.justified, &.nav-justified { border-bottom: 0; > li { float: none; @media (min-width: 768px) { display: table-cell; width: 1%; } > a { margin-bottom: 5px; text-align: center; margin-right: 0; border-radius: 4px; @media (min-width: 768px) { margin-bottom: 0; border-bottom: 1px solid #ddd; border-radius: 4px 4px 0 0; } } &.active > a, &.active > a:hover, &.active > a:focus { border: 1px solid #ddd; @media (min-width: 768px) { border-bottom-color: #fff; } } } > .dropdown .dropdown-menu { top: auto; left: auto; } } } // Pills &.pills, &.nav-pills { > li { float: left; > a { border-radius: 4px; } & + li { margin-left: 2px; } &.active > a, &.active > a:hover, &.active > a:focus { color: #fff; background-color: $orange; } } } // Veritcal &.vertical, &.nav-vertical { width: 100%; li.active a, li.active a:hover, li.active a:focus { color: #fff; background-color: $orange; } }
}