summaryrefslogtreecommitdiff
path: root/xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss
diff options
context:
space:
mode:
Diffstat (limited to 'xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss')
-rw-r--r--xstatic/pkg/bootstrap_scss/data/scss/bootstrap/_carousel.scss51
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;
}