From 9da0bb2def0671b58d5c804718d966756d59d09d Mon Sep 17 00:00:00 2001
From: chancem <grmoore18@gmail.com>
Date: Sat, 2 Sep 2023 15:59:53 -0700
Subject: [PATCH 1/2] Expand clickable area, add gradient to define it

---
 themes/jb/assets/css/layout/show-slider.scss | 46 +++++++++++++++++++-
 1 file changed, 44 insertions(+), 2 deletions(-)

diff --git a/themes/jb/assets/css/layout/show-slider.scss b/themes/jb/assets/css/layout/show-slider.scss
index 9e2e71c77..6e5d82710 100644
--- a/themes/jb/assets/css/layout/show-slider.scss
+++ b/themes/jb/assets/css/layout/show-slider.scss
@@ -1,7 +1,7 @@
 
 .show-img {
- height: 168px !important;
- width: 300px !important
+//  height: 168px !important;
+//  width: 300px !important
 }
 
 .show-card {
@@ -11,14 +11,56 @@
 .show-slider {
   margin-bottom: 2rem;
   display: block;
+  border-radius: 12px;
 }
 
+.swiper-button-prev,
+.swiper-button-next {
+  top: 0;
+  width: 50px;
+  margin-top: 0;
+  height: 100%;
+
+  &.swiper-button-disabled:before {
+    display: none;
+  }
+}
 .swiper-button-prev {
   color: white;
+  left: 0;
+
+  &:before {
+    content: '';
+    background: linear-gradient(90deg, #333333dd, transparent);
+    inset: 0;
+    position: absolute;
+    z-index: -1;
+    opacity: .75;
+    transition: opacity .5s ease-in-out;
+
+  }
+  &:hover:before {
+    opacity: 1;
+  }
 }
 
 .swiper-button-next {
   color: white;
+  right: 0;
+
+  &:before {
+    content: '';
+    background: linear-gradient(-90deg, #333333dd, transparent);
+    inset: 0;
+    position: absolute;
+    z-index: -1;
+    opacity: .75;
+    transition: opacity .5s ease-in-out;
+
+  }
+  &:hover:before {
+    opacity: 1;
+  }
 }
 
 .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {

From 056f0892bf88fa2dbd15c077e2f749c5edc28fa5 Mon Sep 17 00:00:00 2001
From: chancem <grmoore18@gmail.com>
Date: Tue, 5 Sep 2023 14:28:30 -0700
Subject: [PATCH 2/2] Change commented values to reflect actual sizes

---
 themes/jb/assets/css/layout/show-slider.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/themes/jb/assets/css/layout/show-slider.scss b/themes/jb/assets/css/layout/show-slider.scss
index 6e5d82710..94b87e4ec 100644
--- a/themes/jb/assets/css/layout/show-slider.scss
+++ b/themes/jb/assets/css/layout/show-slider.scss
@@ -1,7 +1,7 @@
 
 .show-img {
-//  height: 168px !important;
-//  width: 300px !important
+//  height: 170px !important;
+//  width: 303px !important
 }
 
 .show-card {