// // Dropdowns //
.dropdown-toggle {
outline: 0;
}
.dropdown-menu {
@include shadow; padding: 0;
}
.dropdown-item {
@include transition; font-size: $font-size-sm; &:first-child { @include border-top-radius($card-inner-border-radius); } &:last-child { @include border-bottom-radius($card-inner-border-radius); } &:active { span { color: $white; } color: rgba($white, .5); } span { color: $gray-800; font-size: $font-size-base; }
}
.dropdown-divider {
margin: 0;
}
// animate dropdown inside navbar .navbar {
@include media-breakpoint-up(lg) { .dropdown-menu { &.show { animation: dropdown .2s ease forwards; } } }
}
@keyframes dropdown{
0%{ opacity: 0; transform: translateY(-1rem); } 100%{ opacity: 1; transform: translateY(0); }
}
// mega dropdown .dropdown-mega {
position: static; .dropdown-menu { top: 85px; width: 100%; > .row { margin-right: 0; margin-left: 0; > [class*="col"] { padding-top: ($grid-gutter-width / 2); padding-bottom: ($grid-gutter-width / 2); &:not(:first-child) { border-left: $border-width solid $border-color; } } } }
}
.mega-title {
display: block; padding: 0 $dropdown-item-padding-y; margin-bottom: .5rem; color: $canalplus; letter-spacing: $letter-spacing; font-size: $font-size-sm; text-transform: uppercase;
}
.mega-list {
margin: 0; padding: 0; list-style: none; li { a { @include transition; @include border-radius; display: block; font-size: $font-size-sm; padding: $dropdown-item-padding-y; color: $gray-300; &:hover { background-color: rgba($canalplus, .05); } &.highlight { border: $border-width solid $border-color; } } }
}