From: Kevin Ball Date: Mon, 3 Apr 2017 21:32:54 +0000 (-0700) Subject: Merge branch 'patch-1' of git://github.com/christhekeele/foundation-sites into christ... X-Git-Tag: v6.4.0-rc1~97 X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=cf33542679a0c1540e51f93879a17332acc6ca67;p=thirdparty%2Ffoundation%2Ffoundation-sites.git Merge branch 'patch-1' of git://github.com/christhekeele/foundation-sites into christhekeele-patch-1 --- cf33542679a0c1540e51f93879a17332acc6ca67 diff --cc scss/components/_button.scss index 5c14e557c,3c8c76d10..c5054c74a --- a/scss/components/_button.scss +++ b/scss/components/_button.scss @@@ -165,8 -157,8 +165,8 @@@ $button-transition: background-color 0. } @mixin button-hollow-style( - $color: $primary-color, + $color: $button-background, - $hover-lightness: $button-hollow-hover-lightness, + $hover-lightness: $button-hollow-hover-lightness, $border-width: $button-hollow-border-width ) { $color-hover: scale-color($color, $lightness: $hover-lightness); @@@ -180,35 -172,11 +180,35 @@@ } } +/// Removes background fill on hover and focus for hollow buttons. +@mixin button-clear { + &, + &:hover, &:focus { + background-color: transparent; + } +} + +@mixin button-clear-style( + $color: $primary-color, + $hover-lightness: $button-clear-hover-lightness, + $border-width: $button-clear-border-width +) { + $color-hover: scale-color($color, $lightness: $hover-lightness); + + border: $border-width solid transparent; + color: $color; + + &:hover, &:focus { + border-color: transparent; + color: $color-hover; + } +} + /// Adds disabled styles to a button by fading the element, reseting the cursor, and disabling pointer events. - /// @param [Color] $background [$primary-color] - Background color of the disabled button. + /// @param [Color] $background [$button-background] - Background color of the disabled button. /// @param [Color] $color [$button-color] - Text color of the disabled button. Set to `auto` to have the mixin automatically generate a color based on the background color. @mixin button-disabled( - $background: $primary-color, + $background: $button-background, $color: $button-color ) { @if $color == auto {