Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/twbs/bootstrap-rubygem.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat (limited to 'assets/stylesheets/bootstrap/mixins/_hover.scss')
-rw-r--r--assets/stylesheets/bootstrap/mixins/_hover.scss70
1 files changed, 24 insertions, 46 deletions
diff --git a/assets/stylesheets/bootstrap/mixins/_hover.scss b/assets/stylesheets/bootstrap/mixins/_hover.scss
index fd2f1e2..ec2e328 100644
--- a/assets/stylesheets/bootstrap/mixins/_hover.scss
+++ b/assets/stylesheets/bootstrap/mixins/_hover.scss
@@ -1,61 +1,39 @@
// stylelint-disable indentation
+
+// Hover mixin and `$enable-hover-media-query` are deprecated.
+//
+// Origally added during our alphas and maintained during betas, this mixin was
+// designed to prevent `:hover` stickiness on iOS—an issue where hover styles
+// would persist after initial touch.
+//
+// For backward compatibility, we've kept these mixins and updated them to
+// always return their regular psuedo-classes instead of a shimmed media query.
+//
+// Issue: https://github.com/twbs/bootstrap/issues/25195
+
@mixin hover {
- // TODO: re-enable along with mq4-hover-shim
-// @if $enable-hover-media-query {
-// // See Media Queries Level 4: https://drafts.csswg.org/mediaqueries/#hover
-// // Currently shimmed by https://github.com/twbs/mq4-hover-shim
-// @media (hover: hover) {
-// &:hover { @content }
-// }
-// }
-// @else {
- &:hover { @content; }
-// }
+ &:hover { @content; }
}
-
@mixin hover-focus {
- @if $enable-hover-media-query {
- &:focus {
- @content;
- }
- @include hover { @content; }
- } @else {
- &:focus,
- &:hover {
- @content;
- }
+ &:hover,
+ &:focus {
+ @content;
}
}
@mixin plain-hover-focus {
- @if $enable-hover-media-query {
- &,
- &:focus {
- @content;
- }
- @include hover { @content; }
- } @else {
- &,
- &:focus,
- &:hover {
- @content;
- }
+ &,
+ &:hover,
+ &:focus {
+ @content;
}
}
@mixin hover-focus-active {
- @if $enable-hover-media-query {
- &:focus,
- &:active {
- @content;
- }
- @include hover { @content; }
- } @else {
- &:focus,
- &:active,
- &:hover {
- @content;
- }
+ &:hover,
+ &:focus,
+ &:active {
+ @content;
}
}