1.1 --- a/bootstrap-source/bootstrap-3.0.3/less/carousel.less Sat Jan 18 12:34:36 2014 +0100
1.2 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000
1.3 @@ -1,232 +0,0 @@
1.4 -//
1.5 -// Carousel
1.6 -// --------------------------------------------------
1.7 -
1.8 -
1.9 -// Wrapper for the slide container and indicators
1.10 -.carousel {
1.11 - position: relative;
1.12 -}
1.13 -
1.14 -.carousel-inner {
1.15 - position: relative;
1.16 - overflow: hidden;
1.17 - width: 100%;
1.18 -
1.19 - > .item {
1.20 - display: none;
1.21 - position: relative;
1.22 - .transition(.6s ease-in-out left);
1.23 -
1.24 - // Account for jankitude on images
1.25 - > img,
1.26 - > a > img {
1.27 - .img-responsive();
1.28 - line-height: 1;
1.29 - }
1.30 - }
1.31 -
1.32 - > .active,
1.33 - > .next,
1.34 - > .prev { display: block; }
1.35 -
1.36 - > .active {
1.37 - left: 0;
1.38 - }
1.39 -
1.40 - > .next,
1.41 - > .prev {
1.42 - position: absolute;
1.43 - top: 0;
1.44 - width: 100%;
1.45 - }
1.46 -
1.47 - > .next {
1.48 - left: 100%;
1.49 - }
1.50 - > .prev {
1.51 - left: -100%;
1.52 - }
1.53 - > .next.left,
1.54 - > .prev.right {
1.55 - left: 0;
1.56 - }
1.57 -
1.58 - > .active.left {
1.59 - left: -100%;
1.60 - }
1.61 - > .active.right {
1.62 - left: 100%;
1.63 - }
1.64 -
1.65 -}
1.66 -
1.67 -// Left/right controls for nav
1.68 -// ---------------------------
1.69 -
1.70 -.carousel-control {
1.71 - position: absolute;
1.72 - top: 0;
1.73 - left: 0;
1.74 - bottom: 0;
1.75 - width: @carousel-control-width;
1.76 - .opacity(@carousel-control-opacity);
1.77 - font-size: @carousel-control-font-size;
1.78 - color: @carousel-control-color;
1.79 - text-align: center;
1.80 - text-shadow: @carousel-text-shadow;
1.81 - // We can't have this transition here because WebKit cancels the carousel
1.82 - // animation if you trip this while in the middle of another animation.
1.83 -
1.84 - // Set gradients for backgrounds
1.85 - &.left {
1.86 - #gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001));
1.87 - }
1.88 - &.right {
1.89 - left: auto;
1.90 - right: 0;
1.91 - #gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5));
1.92 - }
1.93 -
1.94 - // Hover/focus state
1.95 - &:hover,
1.96 - &:focus {
1.97 - outline: none;
1.98 - color: @carousel-control-color;
1.99 - text-decoration: none;
1.100 - .opacity(.9);
1.101 - }
1.102 -
1.103 - // Toggles
1.104 - .icon-prev,
1.105 - .icon-next,
1.106 - .glyphicon-chevron-left,
1.107 - .glyphicon-chevron-right {
1.108 - position: absolute;
1.109 - top: 50%;
1.110 - z-index: 5;
1.111 - display: inline-block;
1.112 - }
1.113 - .icon-prev,
1.114 - .glyphicon-chevron-left {
1.115 - left: 50%;
1.116 - }
1.117 - .icon-next,
1.118 - .glyphicon-chevron-right {
1.119 - right: 50%;
1.120 - }
1.121 - .icon-prev,
1.122 - .icon-next {
1.123 - width: 20px;
1.124 - height: 20px;
1.125 - margin-top: -10px;
1.126 - margin-left: -10px;
1.127 - font-family: serif;
1.128 - }
1.129 -
1.130 - .icon-prev {
1.131 - &:before {
1.132 - content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
1.133 - }
1.134 - }
1.135 - .icon-next {
1.136 - &:before {
1.137 - content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)
1.138 - }
1.139 - }
1.140 -}
1.141 -
1.142 -// Optional indicator pips
1.143 -//
1.144 -// Add an unordered list with the following class and add a list item for each
1.145 -// slide your carousel holds.
1.146 -
1.147 -.carousel-indicators {
1.148 - position: absolute;
1.149 - bottom: 10px;
1.150 - left: 50%;
1.151 - z-index: 15;
1.152 - width: 60%;
1.153 - margin-left: -30%;
1.154 - padding-left: 0;
1.155 - list-style: none;
1.156 - text-align: center;
1.157 -
1.158 - li {
1.159 - display: inline-block;
1.160 - width: 10px;
1.161 - height: 10px;
1.162 - margin: 1px;
1.163 - text-indent: -999px;
1.164 - border: 1px solid @carousel-indicator-border-color;
1.165 - border-radius: 10px;
1.166 - cursor: pointer;
1.167 -
1.168 - // IE8-9 hack for event handling
1.169 - //
1.170 - // Internet Explorer 8-9 does not support clicks on elements without a set
1.171 - // `background-color`. We cannot use `filter` since that's not viewed as a
1.172 - // background color by the browser. Thus, a hack is needed.
1.173 - //
1.174 - // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we
1.175 - // set alpha transparency for the best results possible.
1.176 - background-color: #000 \9; // IE8
1.177 - background-color: rgba(0,0,0,0); // IE9
1.178 - }
1.179 - .active {
1.180 - margin: 0;
1.181 - width: 12px;
1.182 - height: 12px;
1.183 - background-color: @carousel-indicator-active-bg;
1.184 - }
1.185 -}
1.186 -
1.187 -// Optional captions
1.188 -// -----------------------------
1.189 -// Hidden by default for smaller viewports
1.190 -.carousel-caption {
1.191 - position: absolute;
1.192 - left: 15%;
1.193 - right: 15%;
1.194 - bottom: 20px;
1.195 - z-index: 10;
1.196 - padding-top: 20px;
1.197 - padding-bottom: 20px;
1.198 - color: @carousel-caption-color;
1.199 - text-align: center;
1.200 - text-shadow: @carousel-text-shadow;
1.201 - & .btn {
1.202 - text-shadow: none; // No shadow for button elements in carousel-caption
1.203 - }
1.204 -}
1.205 -
1.206 -
1.207 -// Scale up controls for tablets and up
1.208 -@media screen and (min-width: @screen-sm-min) {
1.209 -
1.210 - // Scale up the controls a smidge
1.211 - .carousel-control {
1.212 - .glyphicons-chevron-left,
1.213 - .glyphicons-chevron-right,
1.214 - .icon-prev,
1.215 - .icon-next {
1.216 - width: 30px;
1.217 - height: 30px;
1.218 - margin-top: -15px;
1.219 - margin-left: -15px;
1.220 - font-size: 30px;
1.221 - }
1.222 - }
1.223 -
1.224 - // Show and left align the captions
1.225 - .carousel-caption {
1.226 - left: 20%;
1.227 - right: 20%;
1.228 - padding-bottom: 30px;
1.229 - }
1.230 -
1.231 - // Move up the indicators
1.232 - .carousel-indicators {
1.233 - bottom: 20px;
1.234 - }
1.235 -}