AdminLTE/build/scss/_navs.scss
REJack 6773bd1772
further scss changes
- changed /* comments to // (to avoid displaying in compiled css file)
- added .alert-primary
- removed _label.scss (due renamed to badge with BS4)
- reworked bg-*, bg-gradient-*, custom-switch-*, custom-range-* as mixin
- changed control-sidebar-light border color to main-header border
- renamed `.direct-chat-info` to `.direct-chat-infos` (not theme color, its a extra block inside direct-chat & updated demo files
- enhanced direct-chat with all colors
- added `.dropdown-menu-xl`
- reworked color-palette in pages/UI/general
- changed `Block Quotes Pulled Right` to `Secondary Block Quotes` in pages/UI/general
- removed `@-webkit-keyframes flipInX` due autoprefixer
- enhanced demo.js with additional colors for sidebar & renamed `Navbar border` to `No Navbar border`
2019-07-18 16:22:11 +02:00

83 lines
1.5 KiB
SCSS

//
// Component: Nav
//
.nav-pills {
.nav-link {
color: $gray-600;
&:not(.active):hover {
color: theme-color('primary');
}
}
.nav-item {
&.dropdown.show {
.nav-link:hover {
color: $dropdown-link-active-color;
}
}
}
}
// Vertical Tabs
.nav-tabs.flex-column {
border-bottom: 0;
border-right: $nav-tabs-border-width solid $nav-tabs-border-color;
.nav-link {
margin-right: -$nav-tabs-border-width;
@include hover-focus {
border-color: $gray-200 $nav-tabs-border-color $gray-200 $gray-200;
}
}
.nav-link.active,
.nav-item.show .nav-link {
border-color: $gray-300 $nav-tabs-link-active-bg $gray-300 $gray-300;
}
&.nav-tabs-right {
border-left: $nav-tabs-border-width solid $nav-tabs-border-color;
border-right: 0;
.nav-link {
margin-left: -$nav-tabs-border-width;
@include hover-focus {
border-color: $gray-200 $gray-200 $gray-200 $nav-tabs-border-color;
}
}
.nav-link.active,
.nav-item.show .nav-link {
border-color: $gray-300 $gray-300 $gray-300 $nav-tabs-link-active-bg;
}
}
}
// Color variants
@each $color, $value in $theme-colors {
@if $color == dark or $color == light {
.navbar-#{$color} {
background-color: $value;
}
}
}
@each $color, $value in $theme-colors {
@if $color != dark and $color != light {
.navbar-#{$color} {
background-color: $value;
}
}
}
@each $color, $value in $colors {
.navbar-#{$color} {
background-color: $value;
}
}