jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add default color when empty

Browse Source
This commit is contained in:
PascalMarchesseault
2024-07-06 22:12:40 -04:00
parent 69dee64891
commit 52c5a0ef55
1 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/views/main/ProfileBanner.vue
View File

@@ -5,24 +5,28 @@
<div class="flex justify-center text-2xl">Photo de couverture</div> <div class="flex justify-center text-2xl">Photo de couverture</div>
</div> </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"> <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> <div>
<div class="space-x-4 flex justify-center py-2"> <div class="space-x-4 flex justify-center py-2">
<v-btn @click="openColorPicker('top')" <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>
<v-btn @click="openColorPicker('bottom')" <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>
<v-btn @click="openColorPicker('accent')" <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>
<v-btn @click="openColorPicker('menu')" <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> </v-btn>
</div> </div>
</div> </div>
@@ -45,7 +49,7 @@
</div> </div>
<div class="flex justify-center py-4"> <div class="flex justify-center py-4">
<img :src="profilePictureUrl" <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" class="rounded-full max-w-48 max-w-48"
@error="handleProfileImageError" @error="handleProfileImageError"
alt="Profile Image"> alt="Profile Image">