diff options
author | Radomir Dopieralski <openstack@sheep.art.pl> | 2020-03-02 21:26:30 +0100 |
---|---|---|
committer | Radomir Dopieralski <openstack@sheep.art.pl> | 2020-03-16 14:01:36 +0000 |
commit | 1ba0b953862e953a8af9fc8a0f1c9ff372b169cf (patch) | |
tree | ef1e7d562e0b1f6e24004ba0318eca5b6f60edc6 /xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss | |
parent | ca68078e755659b32c61cdf9766fd1ea83c45485 (diff) | |
download | xstatic-bootstrap-scss-master.tar.gz |
Change-Id: I38c8d1114fd6e6629b4f3a16a85e3e35d8d8d3d6
Diffstat (limited to 'xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss')
-rw-r--r-- | xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss | 51 |
1 files changed, 26 insertions, 25 deletions
diff --git a/xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss b/xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss index 753d881..52a1f7b 100644 --- a/xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss +++ b/xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss @@ -10,12 +10,12 @@ .carousel-inner { position: relative; - overflow: hidden; width: 100%; + overflow: hidden; > .item { - display: none; position: relative; + display: none; @include transition(.6s ease-in-out left); // Account for jankitude on images @@ -93,34 +93,34 @@ .carousel-control { position: absolute; top: 0; - left: 0; bottom: 0; + left: 0; width: $carousel-control-width; - @include opacity($carousel-control-opacity); font-size: $carousel-control-font-size; color: $carousel-control-color; text-align: center; text-shadow: $carousel-text-shadow; background-color: rgba(0, 0, 0, 0); // Fix IE9 click-thru bug + @include opacity($carousel-control-opacity); // We can't have this transition here because WebKit cancels the carousel // animation if you trip this while in the middle of another animation. // Set gradients for backgrounds &.left { - @include gradient-horizontal($start-color: rgba(0,0,0,.5), $end-color: rgba(0,0,0,.0001)); + @include gradient-horizontal($start-color: rgba(0, 0, 0, .5), $end-color: rgba(0, 0, 0, .0001)); } &.right { - left: auto; right: 0; - @include gradient-horizontal($start-color: rgba(0,0,0,.0001), $end-color: rgba(0,0,0,.5)); + left: auto; + @include gradient-horizontal($start-color: rgba(0, 0, 0, .0001), $end-color: rgba(0, 0, 0, .5)); } // Hover/focus state &:hover, &:focus { - outline: 0; color: $carousel-control-color; text-decoration: none; + outline: 0; @include opacity(.9); } @@ -131,9 +131,9 @@ .glyphicon-chevron-right { position: absolute; top: 50%; - margin-top: -10px; z-index: 5; display: inline-block; + margin-top: -10px; } .icon-prev, .glyphicon-chevron-left { @@ -147,21 +147,20 @@ } .icon-prev, .icon-next { - width: 20px; + width: 20px; height: 20px; - line-height: 1; font-family: serif; + line-height: 1; } - .icon-prev { &:before { - content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) + content: "\2039";// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) } } .icon-next { &:before { - content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) + content: "\203a";// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) } } } @@ -177,21 +176,18 @@ left: 50%; z-index: 15; width: 60%; - margin-left: -30%; padding-left: 0; - list-style: none; + margin-left: -30%; text-align: center; + list-style: none; li { display: inline-block; - width: 10px; + width: 10px; height: 10px; margin: 1px; text-indent: -999px; - border: 1px solid $carousel-indicator-border-color; - border-radius: 10px; cursor: pointer; - // IE8-9 hack for event handling // // Internet Explorer 8-9 does not support clicks on elements without a set @@ -202,12 +198,16 @@ // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we // set alpha transparency for the best results possible. background-color: #000 \9; // IE8 - background-color: rgba(0,0,0,0); // IE9 + background-color: rgba(0, 0, 0, 0); // IE9 + + border: 1px solid $carousel-indicator-border-color; + border-radius: 10px; } + .active { - margin: 0; - width: 12px; + width: 12px; height: 12px; + margin: 0; background-color: $carousel-indicator-active-bg; } } @@ -217,15 +217,16 @@ // Hidden by default for smaller viewports .carousel-caption { position: absolute; - left: 15%; right: 15%; bottom: 20px; + left: 15%; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: $carousel-caption-color; text-align: center; text-shadow: $carousel-text-shadow; + & .btn { text-shadow: none; // No shadow for button elements in carousel-caption } @@ -258,8 +259,8 @@ // Show and left align the captions .carousel-caption { - left: 20%; right: 20%; + left: 20%; padding-bottom: 30px; } |