diff options
Diffstat (limited to 'assets/stylesheets/bootstrap/_carousel.scss')
-rw-r--r-- | assets/stylesheets/bootstrap/_carousel.scss | 28 |
1 files changed, 13 insertions, 15 deletions
diff --git a/assets/stylesheets/bootstrap/_carousel.scss b/assets/stylesheets/bootstrap/_carousel.scss index fb5e9f8..84ffd6c 100644 --- a/assets/stylesheets/bootstrap/_carousel.scss +++ b/assets/stylesheets/bootstrap/_carousel.scss @@ -101,7 +101,8 @@ @include transition($carousel-control-transition); // Hover/focus state - @include hover-focus() { + &:hover, + &:focus { color: $carousel-control-color; text-decoration: none; outline: 0; @@ -110,15 +111,11 @@ } .carousel-control-prev { left: 0; - @if $enable-gradients { - background-image: linear-gradient(90deg, rgba($black, .25), rgba($black, .001)); - } + background-image: if($enable-gradients, linear-gradient(90deg, rgba($black, .25), rgba($black, .001)), null); } .carousel-control-next { right: 0; - @if $enable-gradients { - background-image: linear-gradient(270deg, rgba($black, .25), rgba($black, .001)); - } + background-image: if($enable-gradients, linear-gradient(270deg, rgba($black, .25), rgba($black, .001)), null); } // Icons for within @@ -127,7 +124,9 @@ display: inline-block; width: $carousel-control-icon-width; height: $carousel-control-icon-width; - background: no-repeat 50% / 100% 100%; + background-repeat: no-repeat; + background-position: 50%; + background-size: 100% 100%; } .carousel-control-prev-icon { background-image: escape-svg($carousel-control-prev-icon-bg); @@ -147,7 +146,7 @@ right: 0; bottom: 0; left: 0; - z-index: 15; + z-index: 2; display: flex; justify-content: center; padding-left: 0; // override <ol> default @@ -170,12 +169,12 @@ // Use transparent borders to increase the hit area by 10px on top and bottom. border-top: $carousel-indicator-hit-area-height solid transparent; border-bottom: $carousel-indicator-hit-area-height solid transparent; - opacity: .5; + opacity: $carousel-indicator-opacity; @include transition($carousel-indicator-transition); } .active { - opacity: 1; + opacity: $carousel-indicator-active-opacity; } } @@ -187,11 +186,10 @@ .carousel-caption { position: absolute; right: (100% - $carousel-caption-width) / 2; - bottom: 20px; + bottom: $carousel-caption-spacer; left: (100% - $carousel-caption-width) / 2; - z-index: 10; - padding-top: 20px; - padding-bottom: 20px; + padding-top: $carousel-caption-padding-y; + padding-bottom: $carousel-caption-padding-y; color: $carousel-caption-color; text-align: center; } |