Changes

components/product/ProductSlider/ProductSlider.module.css

@@ -33,55 +33,26 @@
   margin-right: -1px;
 }
 
+.thumb {
+  @apply transition-transform transition-colors ease-linear duration-75 overflow-hidden
+  inline-block cursor-pointer;
+  width: 275px;
+}
+
+.thumb:focus,
+.thumb.selected {
+  @apply bg-white;
+}
+
+.thumb:hover {
+  transform: scale(1.02);
+  background-color: rgba(255, 255, 255, 0.08);
+}
+
 .album {
   @apply bg-violet-dark;
-  overflow: auto;
+  overflow-y: hidden;
+  overflow-x: auto;
   white-space: nowrap;
-}
-
-.album > * {
-  @apply cursor-pointer;
-  display: inline-block;
-  width: 300px;
-}
-
-.album > div:hover {
-  @apply bg-violet-light;
-}
-
-.positionIndicatorsContainer {
-  @apply hidden;
-
-  @screen sm {
-    @apply block absolute bottom-6 left-1/2;
-    transform: translateX(-50%);
-  }
-}
-
-.positionIndicator {
-  @apply rounded-full p-2;
-}
-
-.dot {
-  @apply bg-hover-1 transition w-3 h-3 rounded-full;
-}
-
-.positionIndicator:hover .dot {
-  @apply bg-hover-2;
-}
-
-.positionIndicator:focus {
-  @apply outline-none;
-}
-
-.positionIndicator:focus .dot {
-  @apply shadow-outline-normal;
-}
-
-.positionIndicatorActive .dot {
-  @apply bg-white;
-}
-
-.positionIndicatorActive:hover .dot {
-  @apply bg-white;
+  height: 275px;
 }