2013-11-16 06:21:12 +08:00
|
|
|
//
|
|
|
|
// Navs
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
|
|
|
|
// BASE CLASS
|
|
|
|
// ----------
|
|
|
|
|
|
|
|
.nav {
|
|
|
|
margin-left: 0;
|
|
|
|
margin-bottom: @baseLineHeight;
|
|
|
|
list-style: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Make links block level
|
|
|
|
.nav > li > a {
|
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
.nav > li > a:hover {
|
|
|
|
text-decoration: none;
|
|
|
|
background-color: @grayLighter;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Redeclare pull classes because of specifity
|
|
|
|
.nav > .pull-right {
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// TABS
|
2021-02-02 05:54:19 +08:00
|
|
|
// -------------
|
2013-11-16 06:21:12 +08:00
|
|
|
|
|
|
|
// Give the tabs something to sit on
|
|
|
|
.nav-tabs {
|
|
|
|
border-bottom: 1px solid #ddd;
|
2021-02-02 05:54:19 +08:00
|
|
|
.clearfix();
|
2013-11-16 06:21:12 +08:00
|
|
|
}
|
|
|
|
// Make the list-items overlay the bottom border
|
|
|
|
.nav-tabs > li {
|
|
|
|
margin-bottom: -1px;
|
2021-02-02 05:54:19 +08:00
|
|
|
float: left;
|
2013-11-16 06:21:12 +08:00
|
|
|
}
|
|
|
|
// Actual tabs (as links)
|
|
|
|
.nav-tabs > li > a {
|
2021-02-02 05:54:19 +08:00
|
|
|
padding-top: 8px 12px;
|
|
|
|
margin-right: 2px;
|
|
|
|
line-height: 14px; // keeps the overall height an even number
|
2013-11-16 06:21:12 +08:00
|
|
|
line-height: @baseLineHeight;
|
|
|
|
border: 1px solid transparent;
|
2020-09-03 03:30:23 +08:00
|
|
|
border-radius: 4px 4px 0 0;
|
2013-11-16 06:21:12 +08:00
|
|
|
&:hover {
|
|
|
|
border-color: @grayLighter @grayLighter #ddd;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// Active state, and it's :hover to override normal :hover
|
|
|
|
.nav-tabs > .active > a,
|
|
|
|
.nav-tabs > .active > a:hover {
|
|
|
|
color: @gray;
|
|
|
|
background-color: @white;
|
|
|
|
border: 1px solid #ddd;
|
|
|
|
border-bottom-color: transparent;
|
|
|
|
cursor: default;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// DROPDOWNS
|
|
|
|
// ---------
|
|
|
|
|
|
|
|
.nav-tabs .dropdown-menu {
|
2020-09-03 03:30:23 +08:00
|
|
|
border-radius: 0 0 6px 6px; // remove the top rounded corners here since there is a hard edge above the menu
|
2013-11-16 06:21:12 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
// Default dropdown links
|
|
|
|
// -------------------------
|
|
|
|
// Make carets use linkColor to start
|
|
|
|
.nav .dropdown-toggle .caret {
|
|
|
|
border-top-color: @linkColor;
|
|
|
|
border-bottom-color: @linkColor;
|
|
|
|
margin-top: 6px;
|
|
|
|
}
|
|
|
|
.nav .dropdown-toggle:hover .caret {
|
|
|
|
border-top-color: @linkColorHover;
|
|
|
|
border-bottom-color: @linkColorHover;
|
|
|
|
}
|
|
|
|
/* move down carets for tabs */
|
|
|
|
.nav-tabs .dropdown-toggle .caret {
|
|
|
|
margin-top: 8px;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Active dropdown links
|
|
|
|
// -------------------------
|
|
|
|
.nav .active .dropdown-toggle .caret {
|
|
|
|
border-top-color: #fff;
|
|
|
|
border-bottom-color: #fff;
|
|
|
|
}
|
|
|
|
.nav-tabs .active .dropdown-toggle .caret {
|
|
|
|
border-top-color: @gray;
|
|
|
|
border-bottom-color: @gray;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Active:hover dropdown links
|
|
|
|
// -------------------------
|
|
|
|
.nav > .dropdown.active > a:hover {
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Open dropdowns
|
|
|
|
// -------------------------
|
|
|
|
.nav-tabs .open .dropdown-toggle,
|
|
|
|
.nav > li.dropdown.open.active > a:hover {
|
|
|
|
color: @white;
|
|
|
|
background-color: @grayLight;
|
|
|
|
border-color: @grayLight;
|
|
|
|
}
|
|
|
|
.nav li.dropdown.open .caret,
|
|
|
|
.nav li.dropdown.open.active .caret,
|
|
|
|
.nav li.dropdown.open a:hover .caret {
|
|
|
|
border-top-color: @white;
|
|
|
|
border-bottom-color: @white;
|
2020-09-03 03:30:23 +08:00
|
|
|
opacity: 1;
|
2013-11-16 06:21:12 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// TABBABLE
|
|
|
|
// --------
|
|
|
|
|
|
|
|
|
|
|
|
// COMMON STYLES
|
|
|
|
// -------------
|
|
|
|
|
|
|
|
.tab-content {
|
|
|
|
overflow: auto; // prevent content from running below tabs
|
|
|
|
}
|
|
|
|
|
|
|
|
// Show/hide tabbable areas
|
2021-02-02 05:54:19 +08:00
|
|
|
.tab-content > .tab-pane {
|
2013-11-16 06:21:12 +08:00
|
|
|
display: none;
|
|
|
|
}
|
2021-02-02 05:54:19 +08:00
|
|
|
.tab-content > .active {
|
2013-11-16 06:21:12 +08:00
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// DISABLED STATES
|
|
|
|
// ---------------
|
|
|
|
|
|
|
|
// Gray out text
|
|
|
|
.nav > .disabled > a {
|
|
|
|
color: @grayLight;
|
|
|
|
}
|
|
|
|
// Nuke hover effects
|
|
|
|
.nav > .disabled > a:hover {
|
|
|
|
text-decoration: none;
|
|
|
|
background-color: transparent;
|
|
|
|
cursor: default;
|
|
|
|
}
|