Add opacity variables, set opacity on disabled state

This commit is contained in:
Mark Otto 2020-09-13 19:12:16 -07:00 committed by Mark Otto
parent 1e69503a73
commit 95f81f8331
2 changed files with 8 additions and 3 deletions

View File

@ -13,24 +13,25 @@
background-clip: content-box;
border: 0; // for button elements
@include border-radius();
opacity: .5;
opacity: $btn-close-opacity;
// Override <a>'s hover style
&:hover {
color: $btn-close-color;
text-decoration: none;
opacity: .75;
opacity: $btn-close-hover-opacity;
}
&:focus {
outline: none;
box-shadow: $btn-close-focus-shadow;
opacity: 1;
opacity: $btn-close-focus-opacity;
}
&:disabled,
&.disabled {
pointer-events: none;
user-select: none;
opacity: $btn-close-disabled-opacity;
}
}

View File

@ -1276,6 +1276,10 @@ $btn-close-padding-y: $btn-close-padding-x !default;
$btn-close-color: $black !default;
$btn-close-bg: url("data:image/svg+xml,<svg fill='#{$btn-close-color}' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>") !default;
$btn-close-focus-shadow: $input-btn-focus-box-shadow !default;
$btn-close-opacity: .5 !default;
$btn-close-hover-opacity: .75 !default;
$btn-close-focus-opacity: 1 !default;
$btn-close-disabled-opacity: .25 !default;
// Code