Merge pull request #360 from twbs/slider-images

Reduce the file size on slider images

docs/assets/css/docs.css

@@ -731,12 +731,14 @@ code {
 }
 
 .component-example .slider {
-  height: 200px;
+  height: 300px;
+}
+.component-example .slider .slide {
+  height: 300px;
 }
 
 .component-example .slide img {
   width: 100%;
-  height: 200px;
 }
 
 .component-example .slide-text {

docs/components.html

@@ -1149,17 +1149,17 @@ document
         <div class="slider" id="mySlider">
           <div class="slide-group">
             <div class="slide">
-              <img src="/assets/img/slide-1.png" alt="Mountain and sky">
+              <img src="/assets/img/slide-1.jpg" alt="Mountain and sky">
               <span class="slide-text">
                 <span class="icon icon-left-nav"></span>
                 Slide me
               </span>
             </div>
             <div class="slide">
-              <img src="/assets/img/slide-2.png" alt="Giant mecha">
+              <img src="/assets/img/slide-2.jpg" alt="Giant mecha">
             </div>
             <div class="slide">
-              <img src="/assets/img/slide-3.png" alt="Big Ben">
+              <img src="/assets/img/slide-3.jpg" alt="Big Ben">
             </div>
           </div>
         </div>
@@ -1169,17 +1169,17 @@ document
 <div class="slider" id="mySlider">
   <div class="slide-group">
     <div class="slide">
-      <img src="/assets/img/slide-1.png">
+      <img src="/assets/img/slide-1.jpg">
       <span class="slide-text">
         <span class="icon icon-left-nav"></span>
         Slide me
       </span>
     </div>
     <div class="slide">
-      <img src="/assets/img/slide-2.png">
+      <img src="/assets/img/slide-2.jpg">
     </div>
     <div class="slide">
-      <img src="/assets/img/slide-3.png">
+      <img src="/assets/img/slide-3.jpg">
     </div>
   </div>
 </div>

sass/docs.scss

@@ -756,11 +756,14 @@ code {
   margin-bottom: 10px;
 }
 .component-example .slider {
-  height: 200px;
+  height: 300px;
+
+  .slide {
+    height: 300px;
+  }
 }
 .component-example .slide img {
   width: 100%;
-  height: 200px;
 }
 .component-example .slide-text {
   position: absolute;