Permalink
Fetching contributors…
Cannot retrieve contributors at this time
97 lines (80 sloc) 2.32 KB
/**
* @copyright 2010-2015, The Titon Project
* @license http://opensource.org/licenses/BSD-3-Clause
* @link http://titon.io
*/
@import "../common";
@include export("carousel") {
#{$carousel-class} {
position: relative;
max-width: 100%;
&.no-next #{$carousel-class-next},
&.no-prev #{$carousel-class-prev} { display: none; }
}
#{$carousel-class-items} {
/* 4:3 ratio */
padding-bottom: 75%;
width: 100%;
max-width: 100%;
overflow: hidden;
position: relative;
> ul {
@include reset-list;
position: absolute;
top: 0;
#{$align-direction}: 0;
transition: left $carousel-transition, top $carousel-transition, right $carousel-transition;
width: 100%;
height: 100%;
> li {
width: 100%;
height: 100%;
position: relative;
> img {
display: block;
width: 100%;
max-width: 100%;
height: auto;
}
}
}
}
//-------------------- Animations --------------------//
#{$carousel-class}.slide {
#{$carousel-class-items} > ul {
> li {
float: $align-direction;
}
@include clear-fix;
}
}
#{$carousel-class}.fade {
#{$carousel-class-items} > ul {
position: relative;
> li {
position: absolute;
top: 0;
#{$align-direction}: 0;
opacity: 0;
z-index: 1;
transition: opacity $carousel-transition, visibility $carousel-transition;
&.show { z-index: 5; }
}
}
}
//-------------------- Modifiers --------------------//
@if index($carousel-modifiers, "wide") {
#{$carousel-class-modifier-wide} {
#{$carousel-class-items} {
padding-bottom: 56.25%; // 16:9 ratio
}
}
}
@if index($carousel-modifiers, "square") {
#{$carousel-class-modifier-square} {
#{$carousel-class-items} {
padding-bottom: 100%; // 1:1 ratio
}
}
}
}