Sha256: ca1d05bcf1f21bce00aa5bf531ac07b820f2a7a9b17e52f8e2b6656a4049d708
Contents?: true
Size: 1.82 KB
Versions: 3
Compression:
Stored size: 1.82 KB
Contents
//
// Carousel
// --------------------------------------------------
.carousel
position: relative
margin-bottom: $baseLineHeight
line-height: 1
.carousel-inner
overflow: hidden
width: 100%
position: relative
.carousel-inner
> .item
display: none
position: relative
+ctb-transition(0.6s ease-in-out left)
// Account for jankitude on images
> .item > img
display: block
line-height: 1
> .active,
> .next,
> .prev
display: block
> .active
left: 0
> .next,
> .prev
position: absolute
top: 0
width: 100%
> .next
left: 100%
> .prev
left: -100%
> .next.left,
> .prev.right
left: 0
> .active.left
left: -100%
> .active.right
left: 100%
// Left/right controls for nav
// ---------------------------
.carousel-control
position: absolute
top: 40%
left: 15px
width: 40px
height: 40px
margin-top: -20px
font-size: 60px
font-weight: 100
line-height: 30px
color: $white
text-align: center
background: $grayDarker
border: 3px solid $white
+ctb-border-radius(23px)
+ctb-opacity(50)
// we can't have this transition here
// because webkit cancels the carousel
// animation if you trip this while
// in the middle of another animation
// ;_;
// @include ctb-transition(opacity .2s linear);
// Reposition the right one
&.right
left: auto
right: 15px
// Hover state
&:hover
color: $white
text-decoration: none
+ctb-opacity(90)
// Caption for text below images
// -----------------------------
.carousel-caption
position: absolute
left: 0
right: 0
bottom: 0
padding: 15px
background: $grayDark
background: rgba(0, 0, 0, 0.75)
.carousel-caption h4,
.carousel-caption p
color: $white
line-height: $baseLineHeight
.carousel-caption h4
margin: 0 0 5px
.carousel-caption p
margin-bottom: 0
Version data entries
3 entries across 3 versions & 1 rubygems