@@ -92,14 +92,15 @@ button {
9292 .carousel .control-disabled .control-arrow {
9393 opacity : 0 ;
9494 filter : alpha (opacity=0);
95- cursor : inherit; }
96- .carousel .control-left .control-arrow {
95+ cursor : inherit;
96+ display : none; }
97+ .carousel .control-prev .control-arrow {
9798 left : 0 ; }
98- .carousel .control-left .control-arrow : before {
99+ .carousel .control-prev .control-arrow : before {
99100 content : '\e803' ; }
100- .carousel .control-right .control-arrow {
101+ .carousel .control-next .control-arrow {
101102 right : 0 ; }
102- .carousel .control-right .control-arrow : before {
103+ .carousel .control-next .control-arrow : before {
103104 content : '\e802' ; }
104105
105106.carousel {
@@ -119,8 +120,7 @@ button {
119120 margin-top : -13px ;
120121 font-size : 18px ; }
121122 .carousel .thumbs-wrapper {
122- position : relative;
123- margin : 0 20px ;
123+ margin : 20px ;
124124 overflow : hidden; }
125125 .carousel .thumbs {
126126 -webkit-transition : all 0.15s ease-in;
@@ -174,40 +174,74 @@ button {
174174 overflow : hidden;
175175 margin : auto;
176176 width : 100% ; }
177+ .carousel .slider-wrapper .axis-horizontal .slider {
178+ display : flex;
179+ display : -webkit-flex; }
180+ .carousel .slider-wrapper .axis-horizontal .slide {
181+ flex-direction : column;
182+ flex-flow : column; }
183+ .carousel .slider-wrapper .axis-vertical .slider {
184+ display : inline-block; }
185+ .carousel .slider-wrapper .axis-vertical .slide {
186+ position : relative;
187+ display : block;
188+ margin : 0 ; }
177189 .carousel .slider {
178- -webkit-transition : all 0.35s ease-in;
179- -moz-transition : all 0.35s ease-in;
180- -ms-transition : all 0.35s ease-in;
181- -o-transition : all 0.35s ease-in;
182- transition : all 0.35s ease-in;
183- -webkit-transform : translate3d (0 , 0 , 0 );
184- -moz-transform : translate3d (0 , 0 , 0 );
185- -ms-transform : translate3d (0 , 0 , 0 );
186- -o-transform : translate3d (0 , 0 , 0 );
187- transform : translate3d (0 , 0 , 0 );
188- display : flex;
189190 position : relative;
190191 list-style : none; }
191- .carousel .slider .swiping {
192- -webkit-transition : none 0 ease-in;
193- -moz-transition : none 0 ease-in;
194- -ms-transition : none 0 ease-in;
195- -o-transition : none 0 ease-in;
196- transition : none 0 ease-in; }
192+ .carousel .slider .animated {
193+ -webkit-transition : all 0.35 s ease-in-out ;
194+ -moz-transition : all 0.35 s ease-in-out ;
195+ -ms-transition : all 0.35 s ease-in-out ;
196+ -o-transition : all 0.35 s ease-in-out ;
197+ transition : all 0.35 s ease-in-out ; }
197198 .carousel .slide {
198- flex-direction : column;
199- flex-flow : column;
200199 min-width : 100% ;
201- margin : 0 ; }
200+ margin : 0 ;
201+ padding-bottom : 32px ; }
202202 .carousel .slide img {
203203 width : 100% ;
204204 vertical-align : top; }
205+ .carousel .slide .legend {
206+ -webkit-transition : all 0.5s ease-in-out;
207+ -moz-transition : all 0.5s ease-in-out;
208+ -ms-transition : all 0.5s ease-in-out;
209+ -o-transition : all 0.5s ease-in-out;
210+ transition : all 0.5s ease-in-out;
211+ position : absolute;
212+ bottom : 0 ;
213+ width : 100% ;
214+ background : # 000 ;
215+ color : # fff ;
216+ padding : 10px ;
217+ font-size : 12px ;
218+ text-align : center; }
219+ @media (min-width : 960px ) {
220+ .carousel .slide {
221+ padding-bottom : 0 ; }
222+ .carousel .slide .legend {
223+ bottom : 40px ;
224+ margin-left : 10% ;
225+ width : 80% ;
226+ background : rgba (0 , 0 , 0 , 0.3 );
227+ color : rgba (255 , 255 , 255 , 0.6 );
228+ border-radius : 5px ;
229+ padding : 10px ;
230+ opacity : 0 ; }
231+ .carousel .slide .selected .legend {
232+ opacity : 1 ; }
233+ .carousel .slide : hover .legend {
234+ background : rgba (0 , 0 , 0 , 0.5 );
235+ color : rgba (255 , 255 , 255 , 0.9 ); } }
205236 .carousel .control-dots {
206237 position : absolute;
207- bottom : 0 ;
238+ bottom : 32 px ;
208239 margin : 10px 0 ;
209240 text-align : center;
210241 width : 100% ; }
242+ @media (min-width : 960px ) {
243+ .carousel .control-dots {
244+ bottom : 0 ; } }
211245 .carousel .control-dots .dot {
212246 -webkit-transition : opacity 0.25s ease-in;
213247 -moz-transition : opacity 0.25s ease-in;
0 commit comments