From 52c5a0ef55a5320921b1f721b762bf7efc61966c Mon Sep 17 00:00:00 2001
From: PascalMarchesseault
 <97350299+PascalMarchesseault@users.noreply.github.com>
Date: Sat, 6 Jul 2024 22:12:40 -0400
Subject: [PATCH] Add default color when empty

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

diff --git a/src/views/main/ProfileBanner.vue b/src/views/main/ProfileBanner.vue
index ccbb3c2..7526195 100644
--- a/src/views/main/ProfileBanner.vue
+++ b/src/views/main/ProfileBanner.vue
@@ -5,24 +5,28 @@
         <div class="flex justify-center text-2xl">Photo de couverture</div>
       </div>
       <div>
-        <div :style="{ backgroundColor: user.profileColors.bannerTop }" class="flex h-4"></div>
+        <div :style="{ backgroundColor: user.profileColors.bannerTop || '#6B0065' }" class="flex h-4"></div>
         <img :src="bannerImageUrl" alt="Banner Image" @error="handleBannerImageError" class="w-full object-cover">
-        <div :style="{ backgroundColor: user.profileColors.bannerBottom }" class="h-4">
+        <div :style="{ backgroundColor: user.profileColors.bannerBottom || '#A30E79' }" class="h-4">
 
         </div>
         <div>
           <div class="space-x-4 flex justify-center py-2">
             <v-btn @click="openColorPicker('top')"
-                   :style="{ backgroundColor: user.profileColors.bannerTop, color: getTextColor(user.profileColors.bannerTop) }">Haut
+                   :style="{ backgroundColor: user.profileColors.bannerTop || '#6B0065', color: getTextColor(user.profileColors.bannerTop || '#6B0065') }">
+              Haut
             </v-btn>
             <v-btn @click="openColorPicker('bottom')"
-                   :style="{ backgroundColor: user.profileColors.bannerBottom, color: getTextColor(user.profileColors.bannerBottom) }">Bas
+                   :style="{ backgroundColor: user.profileColors.bannerBottom || '#A30E79', color: getTextColor(user.profileColors.bannerBottom || '#A30E79') }">
+              Bas
             </v-btn>
             <v-btn @click="openColorPicker('accent')"
-                   :style="{ backgroundColor: user.profileColors.accent, color: getTextColor(user.profileColors.accent) }">Accent1
+                   :style="{ backgroundColor: user.profileColors.accent || '#23393B', color: getTextColor(user.profileColors.accent || '#23393B') }">
+              Accent1
             </v-btn>
             <v-btn @click="openColorPicker('menu')"
-                   :style="{ backgroundColor: user.profileColors.menu, color: getTextColor(user.profileColors.menu) }">Menu
+                   :style="{ backgroundColor: user.profileColors.menu || '#800080', color: getTextColor(user.profileColors.menu || '#800080') }">
+              Menu
             </v-btn>
           </div>
         </div>
@@ -45,7 +49,7 @@
       </div>
       <div class="flex justify-center  py-4">
         <img :src="profilePictureUrl"
-             :style="{ borderColor: user.profileColors.accent, borderWidth: '3px', borderStyle: 'solid' }"
+             :style="{ borderColor: user.profileColors.accent  || '#23393B' , borderWidth: '3px', borderStyle: 'solid' }"
              class="rounded-full max-w-48 max-w-48"
              @error="handleProfileImageError"
              alt="Profile Image">