[FEATURE] add bootstrap slider element

dev/js/bootstrap.js

@@ -3,7 +3,7 @@
 @import '../bower_components/bootstrap/js/transition.js';
 @import '../bower_components/bootstrap/js/alert.js';
 @import '../bower_components/bootstrap/js/button.js';
-// @import '../bower_components/bootstrap/js/carousel.js';
+@import '../bower_components/bootstrap/js/carousel.js';
 @import '../bower_components/bootstrap/js/collapse.js';
 // @import '../bower_components/bootstrap/js/dropdown.js';
 // @import '../bower_components/bootstrap/js/modal.js';

dev/styles/bootstrap.less

@@ -43,7 +43,7 @@
 // @import "../bower_components/bootstrap/less/modals.less";
 // @import "../bower_components/bootstrap/less/tooltip.less";
 // @import "../bower_components/bootstrap/less/popovers.less";
-// @import "../bower_components/bootstrap/less/carousel.less";
+@import "../bower_components/bootstrap/less/carousel.less";
 
 // Utility classes
 @import "../bower_components/bootstrap/less/utilities.less";

dev/templates/parts/content/contentElements/bootstrapSlider.hbs

@@ -0,0 +1,48 @@
+<div id="carousel-178" class="carousel image-slider slide" data-interval="5000" data-ride="carousel">
+    <!-- Slider pagination -->
+    <ol class="carousel-indicators">
+        <li data-target="#carousel-178" data-slide-to="0" class="active"></li>
+        <li data-target="#carousel-178" data-slide-to="1" class=""></li>
+        <li data-target="#carousel-178" data-slide-to="2" class=""></li>
+    </ol>
+
+    <!-- Slides -->
+    <div class="carousel-inner" role="listbox">
+        <div class="item active">
+            <img src="images/temp-carousel-1.jpg" alt="" title="bootstrap-slider first image" />
+            <div class="img-slider__caption">
+                <h2 class="img-slider__caption-header">The bootstrap slider is in!</h2>
+                <p class="img-slider__caption-p">Celebrate the bootstrap slider!</p>
+                <a href="#" class="img-slider__caption-link">Details</a>
+            </div>
+        </div>
+
+        <div class="item">
+            <img src="images/temp-carousel-2.jpg" alt="" title="bootstrap-slider second image" />
+            <div class="img-slider__caption">
+                <h2 class="img-slider__caption-header">The bootstrap slider is in!</h2>
+                <p class="img-slider__caption-p">Celebrate the bootstrap slider!</p>
+                <a href="#" class="img-slider__caption-link">Details</a>
+            </div>
+        </div>
+
+        <div class="item">
+            <img src="images/temp-carousel-3.jpg" alt="" title="bootstrap-slider third image" />
+            <div class="img-slider__caption">
+                <h2 class="img-slider__caption-header">The bootstrap slider is in!</h2>
+                <p class="img-slider__caption-p">Celebrate the bootstrap slider!</p>
+                <a href="#" class="img-slider__caption-link">Details</a>
+            </div>
+        </div>
+    </div>
+
+    <!-- Next, Prev Arrows -->
+    <div class="container carousel-control-wrapper">
+        <a class="carousel-control left" href="#carousel-178" role="button" data-slide="prev">
+            <span class="swiper-button-prev swiper-button-white"></span>
+        </a>
+        <a class="carousel-control right" href="#carousel-178" role="button" data-slide="next">
+            <span class="swiper-button-next swiper-button-white"></span>
+        </a>
+    </div>
+</div>