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

All the modals are created, only the connection remains to be done.

Browse Source
This commit is contained in:
PascalMarchesseault
2024-07-27 10:10:50 -04:00
parent 8f9dee1b5f
commit 63d8689757
6 changed files with 34 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/views/Profile/Dialogs/PageInformations/BannerPicker.vue
View File

@@ -1,18 +1,25 @@
<template>
<div class="p-4">
<h2 class="text-lg font-semibold mb-4">Sélectionne ta bannière</h2>
<h2 class="text-2xl font-semibold mb-4 flex justify-center">Sélectionne ta bannière</h2>
<div class="mb-5">
<img
@click="openModal('BannerPicker')"
src="/images/hutopymedia/banners/tutorialbanner.png"
class="w-full transition duration-200 ease-in-out transform hover:brightness-125"
class="w-full transition duration-200 ease-in-out transform"
alt="Tutorial Banner"
>
</div>
<v-file-input
variant="outlined"
accept="image/*"
label="File input"
></v-file-input>
<div class="flex justify-end space-x-4">
<v-btn variant="plain" color="black">Annuler</v-btn>
<v-btn color="#A6147D">Enregistrer</v-btn>
</div>
</div>
</template>

2
src/views/Profile/Dialogs/PageInformations/ColorBorder.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<h2 class="title text-2xl">Couleur contour</h2>
<h2 class="title font-semibold text-2xl">Couleur contour</h2>
<div class="flex justify-center"><v-color-picker></v-color-picker></div>

2
src/views/Profile/Dialogs/PageInformations/ColorBottomBanner.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<h2 class="title text-2xl">Couleur de la bannière inférieur</h2>
<h2 class="title font-semibold text-2xl">Couleur de la bannière inférieur</h2>
<div class="flex justify-center"><v-color-picker></v-color-picker></div>

2
src/views/Profile/Dialogs/PageInformations/ColorMenu.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<h2 class="title text-2xl">Couleur des Menus</h2>
<h2 class="title font-semibold text-2xl">Couleur des Menus</h2>
<div class="flex justify-center"><v-color-picker></v-color-picker></div>

2
src/views/Profile/Dialogs/PageInformations/ColorTopBanner.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<h2 class="title text-2xl">Couleur de la bannière supérieure</h2>
<h2 class="title font-semibold text-2xl">Couleur de la bannière supérieure</h2>
<div class="flex justify-center"><v-color-picker></v-color-picker></div>

22
src/views/Profile/Dialogs/PageInformations/ProfilePicturePicker.vue
View File

@@ -1,11 +1,29 @@
<template>
<div class="p-4">
<h2 class="text-lg font-semibold mb-4">Choisir Image de profil</h2>
<input type="file" @change="onFileChange" accept="image/*" class="mb-4" />
<h2 class="text-2xl font-semibold mb-4 flex justify-center">Choisir Image de profil</h2>
<div class="flex justify-center mb-5">
<img
@click="openModal('ProfilePicturePicker')"
class=" custom-border active:bg-gray-600 shadow flex items-center transition duration-200 ease-in-out w-48 h-48 rounded-full"
src="/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile01.png"
alt="Profile Image"
>
</div>
<v-file-input
variant="outlined"
accept="image/*"
label="File input"
></v-file-input>
<div v-if="bannerUrl" class="mt-4">
<h3 class="text-md font-semibold mb-2">Aperçu de la bannière:</h3>
<img :src="bannerUrl" alt="Banner Preview" class="w-full h-auto rounded shadow" />
</div>
<div class="flex justify-end space-x-4">
<v-btn variant="plain" color="black">Annuler</v-btn>
<v-btn color="#A6147D">Enregistrer</v-btn>
</div>
</div>
</template>