From 9ce5fb58178aadb3b1907d7005aadeb1ae63ba53 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Wed, 28 Dec 2016 00:20:06 -0800 Subject: [PATCH] Revamp dropdown item states - Removes the plain-hover-focus mixin from active and disabled states; no need for them. - Adds :active and :disabled since we can use button elements here, too. - Wrap the disabled background-image override in an -gradients condition. --- scss/_dropdown.scss | 35 +++++++++++++---------------------- 1 file changed, 13 insertions(+), 22 deletions(-) diff --git a/scss/_dropdown.scss b/scss/_dropdown.scss index 5f72c9ba44..46251031f6 100644 --- a/scss/_dropdown.scss +++ b/scss/_dropdown.scss @@ -81,30 +81,21 @@ background-color: $dropdown-link-hover-bg; } - // Active state - &.active { - @include plain-hover-focus { - color: $dropdown-link-active-color; - text-decoration: none; - background-color: $dropdown-link-active-bg; - outline: 0; - } + &.active, + &:active { + color: $dropdown-link-active-color; + text-decoration: none; + background-color: $dropdown-link-active-bg; } - // Disabled state - // - // Gray out text and ensure the hover/focus state remains gray - &.disabled { - @include plain-hover-focus { - color: $dropdown-link-disabled-color; - } - - // Nuke hover/focus effects - @include hover-focus { - text-decoration: none; - cursor: $cursor-disabled; - background-color: transparent; - background-image: none; // Remove CSS gradient + &.disabled, + &:disabled { + color: $dropdown-link-disabled-color; + cursor: $cursor-disabled; + background-color: transparent; + // Remove CSS gradients if they're enabled + @if $enable-gradients { + background-image: none; } } }