From 720ec213fe409d18aea38b59b92d272650cbe379 Mon Sep 17 00:00:00 2001
From: Chuma McPhoy <chuma.mcphoy@scandichotels.com>
Date: Fri, 7 Jun 2024 15:02:47 +0200
Subject: [PATCH] feat(WEB-314): render current benefit cards with carousel on
 mobile

---
 .../MyPages/Blocks/Benefits/CurrentLevel/current.module.css     | 2 ++
 components/MyPages/Blocks/Benefits/CurrentLevel/index.tsx       | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/components/MyPages/Blocks/Benefits/CurrentLevel/current.module.css b/components/MyPages/Blocks/Benefits/CurrentLevel/current.module.css
index cac4f4013..b8f3348dd 100644
--- a/components/MyPages/Blocks/Benefits/CurrentLevel/current.module.css
+++ b/components/MyPages/Blocks/Benefits/CurrentLevel/current.module.css
@@ -21,6 +21,8 @@
 }
 
 .title {
+  display: flex;
+  flex-direction: column;
   text-wrap: balance;
 }
 .titleValue {
diff --git a/components/MyPages/Blocks/Benefits/CurrentLevel/index.tsx b/components/MyPages/Blocks/Benefits/CurrentLevel/index.tsx
index ca44d30c7..6e1ce60da 100644
--- a/components/MyPages/Blocks/Benefits/CurrentLevel/index.tsx
+++ b/components/MyPages/Blocks/Benefits/CurrentLevel/index.tsx
@@ -37,7 +37,7 @@ export default async function CurrentBenefitsBlock({
     <section className={styles.container}>
       <Header title={title} link={link} subtitle={subtitle} />
 
-      <CardGrid>
+      <CardGrid isMobileCarousel={true}>
         {currentLevel.benefits.map((benefit, idx) => (
           <Link
             href={benefit.href}