Initial Commit - Plugin v1.0.0

assets/images/icon-dot-empty.svg

@@ -0,0 +1,3 @@
+<symbol id="icon-dot-empty" data-name="icon-dot-empty" viewBox="0 0 69.114 69.114">
+  <polygon points="3.536 34.557 34.557 3.536 65.579 34.557 34.557 65.579 3.536 34.557" fill="none" stroke="#caa345" stroke-miterlimit="10" stroke-width="5"/>
+</symbol>

assets/images/icon-dot-plain.svg

@@ -0,0 +1,5 @@
+<svg>
+  <symbol id="icon-dot-plain" data-name="icon-dot-plain" viewBox="0 0 69.114 69.114" preserveAspectRatio="none">
+    <polygon points="3.536 34.557 34.557 3.536 65.579 34.557 34.557 65.579 3.536 34.557" stroke-miterlimit="10" stroke-width="5"/>
+  </symbol>
+</svg>

assets/scripts/slider.js

@@ -0,0 +1,16 @@
+jQuery(function($) {
+
+  const plainDotSVG = '<svg class="icon icon-dot-plain d-block" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-dot-plain"></use></svg>';
+  const emptyDotSVG = '<svg class="icon icon-dot-empty d-block" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-dot-empty"></use></svg>';
+
+  $(document).ready(function() {
+    $('#ratings-slider').on('slide.bs.carousel', function (e) {
+      const fromElmt = $('.carousel-indicators li:eq('+e.from+')');
+      const toElmt = $('.carousel-indicators li:eq('+e.to+')');
+      fromElmt.find('svg').remove();
+      fromElmt.append(emptyDotSVG);
+      toElmt.find('svg').remove()
+      toElmt.append(plainDotSVG);
+		});
+  });
+});

assets/styles/slider.css

@@ -0,0 +1,27 @@
+#ratings-slider .slider-bg {
+  position: absolute;
+  z-index: -2;
+  height: 100%;
+  -o-object-fit: cover;
+    object-fit: cover;
+}
+
+#ratings-slider .carousel-caption {
+  font-style: italic;
+  top: 50%;
+  bottom: unset;
+  left: 50%;
+  right: unset;
+  transform: translate(-50%, -50%);
+  width: 80%;
+}
+
+#ratings-slider .carousel-indicators li {
+  background-color: transparent;
+  width: 35px;
+  height: 35px;
+}
+.reviews .carousel .carousel-inner .carousel-item {
+  min-height: 300px;
+}
+