From f7abbf9f76f6c43df6e53aac5675f9502b12380d Mon Sep 17 00:00:00 2001
From: Aaron Chan <42254254+aaronchan32@users.noreply.github.com>
Date: Sun, 2 Jun 2024 15:33:27 -0700
Subject: [PATCH] fix: tablet testimonial

---
 .../ThemesSlider/ThemeSlide/ThemeSlide.scss   |  6 ++++-
 .../components/ThemesSlider/ThemesSlider.scss | 24 ++++++++++++-------
 2 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/src/app/components/ThemesSlider/ThemeSlide/ThemeSlide.scss b/src/app/components/ThemesSlider/ThemeSlide/ThemeSlide.scss
index 038d9ee..cccf507 100644
--- a/src/app/components/ThemesSlider/ThemeSlide/ThemeSlide.scss
+++ b/src/app/components/ThemesSlider/ThemeSlide/ThemeSlide.scss
@@ -8,8 +8,12 @@
   display: flex;
   flex-direction: column;
   justify-content: space-between;
-  min-height: 420px;
   max-height: 575px;
+  min-height: 420px;
+
+  @media ($mobile-breakpoint < width < $tablet-breakpoint) {
+    min-height: 500px;
+  }
 
   .top-section {
     h3 {
diff --git a/src/app/components/ThemesSlider/ThemesSlider.scss b/src/app/components/ThemesSlider/ThemesSlider.scss
index 9f1b893..01e9db7 100644
--- a/src/app/components/ThemesSlider/ThemesSlider.scss
+++ b/src/app/components/ThemesSlider/ThemesSlider.scss
@@ -66,12 +66,12 @@
       background: $hide-slides-gradient;
     }
 
-    .arrows {
-      display: flex;
-      gap: 2px;
-      grid-area: 1 / 1 / 2 / 2;
-      padding: 10px;
-    }
+    // .arrows {
+    //   display: flex;
+    //   gap: 2px;
+    //   grid-area: 1 / 1 / 2 / 2;
+    //   padding: 10px;
+    // }
   }
 
   @media ($mobile-breakpoint < width < 1400px) {
@@ -91,7 +91,7 @@
     height: 100%;
 
     .keen-slider {
-      height: 100%;
+      height: calc(100% - 3rem);
     }
 
     & {
@@ -99,10 +99,18 @@
         100vw - clamp(250px, 200px + 11vw, 470px) - 2 *
           $main-padding-desktop-inline
       );
+    }
+  }
 
-      border: none;
+  @media (min-width: 1400px) {
+    height: 100%;
+
+    .keen-slider {
+      height: 100%;
     }
 
+    border: none;
+
     .dots {
       display: none;
     }