From f2f5e26581b5cfe12358f78799b3882c181b5f03 Mon Sep 17 00:00:00 2001
From: PascalMarchesseault
 <97350299+PascalMarchesseault@users.noreply.github.com>
Date: Sun, 28 Jul 2024 21:02:58 -0400
Subject: [PATCH] Improve mobile scroll btn.

---
 src/views/main/Profile.vue | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/views/main/Profile.vue b/src/views/main/Profile.vue
index 009bd03..1be129f 100644
--- a/src/views/main/Profile.vue
+++ b/src/views/main/Profile.vue
@@ -5,12 +5,14 @@
       <div class="sticky top-0 z-30 bg-[#f4f4f4]">
         <div class="flex flex-col items-center md:items-start md:pl-4 mt-16">
           <h1 class="text-2xl py-4 font-bold text-center md:text-left">Gérer votre compte Hutopy</h1>
+          
           <div class="relative flex items-center md:mt-0 w-full">
             <!-- Navigation buttons for small screens -->
             <button @click="scrollLeftFunc"
-                    class="rounded p-1 absolute left-2 z-10 md:hidden text-white bg-fuchsia-800">
-              <v-icon>mdi-chevron-left-box</v-icon>
+                    class="rounded p-1 absolute left-2 z-10 md:hidden text-fuchsia-800 bg-[#f4f4f4] text-2xl ">
+              <v-icon>mdi-chevron-left</v-icon>
             </button>
+            
             <div
                 ref="scrollContainer"
                 class="flex md:flex-col space-x-2 space-y-0 md:space-x-0 md:space-y-2 p-4 items-center md:items-start overflow-x-scroll md:overflow-x-visible mx-2 md:mx-0 custom-scroll min-w-[400px] px-1"
@@ -36,10 +38,11 @@
               </v-btn>
             </div>
             <button @click="scrollRightFunc"
-                    class="rounded p-1 absolute right-2 z-10 md:hidden text-white bg-fuchsia-800">
-              <v-icon>mdi-chevron-right-box</v-icon>
+                    class="rounded p-1 absolute right-2 z-10 md:hidden text-fuchsia-800 bg-[#f4f4f4] text-2xl">
+              <v-icon>mdi-chevron-right</v-icon>
             </button>
           </div>
+        
         </div>
       </div>
     </div>