Make new dropdown-item-hover style global

This commit is contained in:
Winnie Hellmann 2017-10-09 14:29:47 +02:00
parent 915d2b9ba2
commit 0c4cda2494

View file

@ -143,6 +143,16 @@
} }
} }
@mixin dropdown-item-hover {
background-color: $dropdown-item-hover-bg;
color: $gl-text-color;
// make sure the text color is not overriden
&.text-danger {
color: $brand-danger;
}
}
@mixin dropdown-link { @mixin dropdown-link {
display: block; display: block;
position: relative; position: relative;
@ -159,9 +169,11 @@
} }
&:hover, &:hover,
&:active,
&:focus, &:focus,
&.is-focused { &.is-focused {
background-color: $dropdown-link-hover-bg; @include dropdown-item-hover;
text-decoration: none; text-decoration: none;
.badge { .badge {
@ -239,6 +251,12 @@
text-align: left; text-align: left;
list-style: none; list-style: none;
padding: 0 10px; padding: 0 10px;
a,
button,
.menu-item {
@include dropdown-link;
}
} }
.divider { .divider {
@ -260,10 +278,6 @@
background-color: $dropdown-divider-color; background-color: $dropdown-divider-color;
} }
a {
@include dropdown-link;
}
.dropdown-menu-empty-item a { .dropdown-menu-empty-item a {
&:hover, &:hover,
&:focus { &:focus {
@ -314,6 +328,10 @@
padding: $gl-btn-padding; padding: $gl-btn-padding;
cursor: pointer; cursor: pointer;
&.droplab-item-active button {
@include dropdown-item-hover;
}
> a, > a,
> button { > button {
display: flex; display: flex;
@ -321,17 +339,9 @@
padding: 0; padding: 0;
border-radius: 0; border-radius: 0;
text-overflow: inherit; text-overflow: inherit;
background-color: inherit;
color: inherit;
border: inherit; border: inherit;
text-align: left; text-align: left;
&:hover,
&:focus {
background-color: inherit;
color: inherit;
}
&.btn .fa:not(:last-child) { &.btn .fa:not(:last-child) {
margin-left: 5px; margin-left: 5px;
} }
@ -744,11 +754,6 @@
} }
} }
@mixin dropdown-item-hover {
background-color: $dropdown-item-hover-bg;
color: $gl-text-color;
}
// TODO: change global style and remove mixin // TODO: change global style and remove mixin
@mixin new-style-dropdown($selector: '') { @mixin new-style-dropdown($selector: '') {
#{$selector}.dropdown-menu, #{$selector}.dropdown-menu,
@ -763,10 +768,6 @@
background-color: transparent; background-color: transparent;
} }
&.droplab-item-active button {
@include dropdown-item-hover;
}
a, a,
button, button,
.menu-item { .menu-item {
@ -787,23 +788,6 @@
display: block; display: block;
} }
} }
&.is-focused,
&:hover,
&:active,
&:focus {
@include dropdown-item-hover;
background-color: $dropdown-item-hover-bg;
color: $gl-text-color;
}
}
&.dropdown-menu-empty-item a {
&:hover,
&:focus {
background-color: transparent;
}
} }
} }