From 04537286966cdc6a8a87c78fab78d9b93c083099 Mon Sep 17 00:00:00 2001
From: Arvid Norlin <arvid.norlin@scandichotels.com>
Date: Mon, 19 Aug 2024 16:29:22 +0200
Subject: [PATCH] chore: make pagination scale somewhat better on small devices
 awaiting design feedback on ellipsises

---
 .../JourneyTable/Pagination/pagination.module.css     | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/components/MyPages/Blocks/Points/EarnAndBurn/JourneyTable/Pagination/pagination.module.css b/components/MyPages/Blocks/Points/EarnAndBurn/JourneyTable/Pagination/pagination.module.css
index 493e06854..a18253c62 100644
--- a/components/MyPages/Blocks/Points/EarnAndBurn/JourneyTable/Pagination/pagination.module.css
+++ b/components/MyPages/Blocks/Points/EarnAndBurn/JourneyTable/Pagination/pagination.module.css
@@ -1,11 +1,13 @@
 .pagination {
   display: flex;
-  justify-content: center;
+  justify-content: left;
   padding: var(--Spacing-x2);
   background-color: var(--Base-Surface-Primary-light-Normal);
   border-radius: var(--Corner-radius-Rounded);
   margin: auto;
   gap: var(--Spacing-x5);
+  max-width: 100%;
+  overflow-x: auto;
 }
 
 .paginationButton {
@@ -19,6 +21,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
+  flex-shrink: 0;
 }
 
 .chevronLeft {
@@ -31,3 +34,9 @@
   background-color: var(--Base-Text-Accent);
   border-radius: var(--Corner-radius-Rounded);
 }
+
+@media screen and (min-width: 768px) {
+  .pagination {
+    justify-content: center;
+  }
+}