mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-09-01 01:21:49 +02:00
Code Issues Releases Wiki Activity

Rename .close to .btn-close, replace times sign with background SVG, update focus state

Browse Source
This commit is contained in:
Mark Otto
2020-09-01 15:16:50 -07:00
committed by Mark Otto
parent fe77208a01
commit 99777662c6
7 changed files with 55 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
scss/_close.scss
View File

@@ -1,36 +1,36 @@
.close {
@include font-size($close-font-size);
font-weight: $close-font-weight;
line-height: 1;
color: $close-color;
text-shadow: $close-text-shadow;
// transparent background and border properties included for button version.
// iOS requires the button element instead of an anchor tag.
// If you want the anchor version, it requires `href="#"`.
// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
.btn-close {
box-sizing: content-box;
width: $btn-close-width;
height: $btn-close-height;
padding: $btn-close-padding-y $btn-close-padding-x;
color: $btn-close-color;
background: transparent escape-svg($btn-close-bg) no-repeat center center / $btn-close-width auto; // include transparent for button elements
background-clip: content-box;
border: 0; // for button elements
@include border-radius();
opacity: .5;
// Override <a>'s hover style
&:hover {
color: $close-color;
color: $btn-close-color;
text-decoration: none;
opacity: .75;
}
&:hover,
&:focus {
opacity: .75;
outline: none;
box-shadow: $btn-close-focus-shadow;
opacity: 1;
}
&:disabled,
&.disabled {
pointer-events: none;
user-select: none;
}
}
// Additional properties for button version
// iOS requires the button element instead of an anchor tag.
// If you want the anchor version, it requires `href="#"`.
// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
// stylelint-disable-next-line selector-no-qualifying-type
button.close {
padding: 0;
background-color: transparent;
border: 0;
}