From 38cb28d820ad6d765c52938954b08dcfe9e0e63f Mon Sep 17 00:00:00 2001
From: PascalMarchesseault
 <97350299+PascalMarchesseault@users.noreply.github.com>
Date: Sat, 16 Mar 2024 12:21:55 -0400
Subject: [PATCH] Changs

---
 src/views/main/CreatorFolio.vue | 180 +++++++++++++++++++-------------
 1 file changed, 105 insertions(+), 75 deletions(-)

diff --git a/src/views/main/CreatorFolio.vue b/src/views/main/CreatorFolio.vue
index ef2d8de..4588a2a 100644
--- a/src/views/main/CreatorFolio.vue
+++ b/src/views/main/CreatorFolio.vue
@@ -32,7 +32,7 @@
 
             <RouterLink :to="{ name: 'home' }">
               <v-btn size="x-large"
-                style="background-color: #f4f4f4; min-width: 370px; max-width: 370px; transform: scale(1.03);"
+                style="background-color: #f4f4f4; min-width: 370px; max-width: 370px; transform: scale(1.3);"
                 elevation="0">
                 <v-icon left class="icon-size" style="margin-left: -95%;">mdi-home</v-icon>
                 <div style="margin-left: 10%;"> Accueil</div>
@@ -42,16 +42,16 @@
 
             <RouterLink :to="{ name: 'contact' }">
               <v-btn size="x-large"
-                style="background-color: #f4f4f4; min-width: 370px; max-width: 370px; transform: scale(1.03);"
+                style="background-color: #f4f4f4; min-width: 370px; max-width: 370px; transform: scale(1.3);"
                 elevation="0">
-                <v-icon left class="icon-size" style="margin-left: -1%;">mdi-account-plus</v-icon>
-                <div style="margin-left: 10%;">Ajouter des amis</div>
+                <v-icon left class="icon-size" style="margin-left: -3%;">mdi-account-plus</v-icon>
+                <div style="margin-left: 6%;">Ajouter des amis</div>
               </v-btn>
             </RouterLink>
 
             <RouterLink :to="{ name: 'creatorfolio' }">
               <v-btn size="x-large"
-                style="background-color: #f4f4f4; min-width: 370px; max-width: 370px; transform: scale(1.03);"
+                style="background-color: #f4f4f4; min-width: 370px; max-width: 370px; transform: scale(1.3);"
                 elevation="0">
                 <v-icon left class="icon-size" style="margin-left: -79%;">mdi-newspaper</v-icon>
                 <div style="margin-left: 10%;">Contenu</div>
@@ -59,94 +59,121 @@
             </RouterLink>
 
 
-            <v-container class="elevation-4"
-              style="margin-top: 25%;  border-radius: 25px; height: 700px; background-color: #a40e79;">
+            <v-dialog transition="dialog-top-transition" width="auto">
+              <template v-slot:activator="{ props: activatorProps }">
 
-              <v-container style="font-size: 1.4rem;  border-radius: 25px; height: 665px; background-color:#f4f4f4;">
-
-                <H1 style="margin-bottom: 10%; text-align: center; font-size: 2rem;">PORTEFEUILLE</H1>
-
-                <v-row>
-                  <v-col cols="8">
-                    <h1>Dons reçus :</h1>
-                  </v-col>
-                  <v-col>
-                    0
-                  </v-col>
-                </v-row>
-
-                <v-row>
-                  <v-col cols="8">
-                    <h1>Argent reçu :</h1>
-                  </v-col>
-                  <v-col>
-                    0$
-                  </v-col>
-
-
-                </v-row>
-
-                <v-row>
-                  <v-col cols="8">
-                    <h1>Argent retiré :</h1>
-                  </v-col>
-                  <v-col>
-                    0$
-                  </v-col>
+                <v-btn v-bind="activatorProps" text="Transition from Top" block size="x-large"
+                  style="margin-left: -8%; background-color: #f4f4f4; min-width: 370px; max-width: 370px; transform: scale(1.3);"
+                  elevation="0">
+                  <v-icon color="black">mdi-wallet</v-icon>
+                  <div style="margin-left: 10%;" @click="isActive.value = false">PORTEFEUILLE</div>
+                </v-btn>
 
 
 
 
-                </v-row>
+              </template>
+              <template v-slot:default="{ isActive }">
+                <v-card style="border-radius: 30px;">
+                  <div class="text-center" style=" margin-top: 2%; margin-bottom: 2%;">
+                    <v-icon left size="48">mdi-wallet</v-icon>
+                    <v-toolbar title="PORTEFEUILLE"
+                      style="color: white; width: 750px; background-color: #a30e79; margin-bottom: -6%;"></v-toolbar>
+                  </div>
 
-
-                <v-row>
-                  <v-col cols="8">
-                    <h1>Transaction # :</h1>
-                  </v-col>
-                  <v-col>
-                    0
-                  </v-col>
+                  <v-card-text class="text-h1 pa-12">
 
 
 
-
-                </v-row>
-
-                <v-row style="margin-bottom: 3%; margin-left: 3%;" align="center" justify="center">
-                  <v-btn style="margin-right: 3%;" class="round-btn" @click="previous">
-                    <v-icon>mdi-chevron-left</v-icon>
-                  </v-btn>
-                  <v-col>
-                    <h1 style="text-align: center; margin-top: 7%;">Messages</h1>
-                  </v-col>
-                  <v-col>
-                    <v-btn class="round-btn" @click="next">
-                      <v-icon>mdi-chevron-right</v-icon>
-                    </v-btn>
-                  </v-col>
-                </v-row>
+                    <v-row>
+                      <v-col>
+                        <v-row>
+                          <v-col cols="7">
+                            <h1 style="margin-bottom: 4%; font-size: 1.3rem;">Balance actuelle</h1>
+                            <h1 style="margin-bottom: 4%; font-size: 1.3rem;">Montant reçu</h1>
+                            <h1 style="margin-bottom: 4%; font-size: 1.3rem;">Dernier don</h1>
 
 
 
-                <v-container style="background-color: #a40e79; border-radius: 25px; height: 260px;">
-                  <p
-                    style="color: white; height: 260px; border-radius: 25px;  text-align: justify; margin: 0%                ;">
+                          </v-col>
+                          <v-col>
+                            <h1 style="margin-bottom: 4%; font-size: 1.3rem;">0$</h1>
+                            <h1 style="margin-bottom: 4%; font-size: 1.3rem;">0$</h1>
+                            <h1 style="margin-bottom: 4%; font-size: 1.3rem;">2024-10-04</h1>
 
-                    Tu es le meilleur
-                  </p>
-                </v-container>
+                            <p></p>
+                          </v-col>
+                        </v-row>
 
 
 
+                      </v-col>
+
+                      <v-col>
+                        <v-row>
+                          <v-col cols="8">
+
+                            <h1 style="margin-bottom: 4%; font-size: 1.2rem;">Dons</h1>
+                            <h1 style="margin-bottom: 4%; font-size: 1.2rem;">Montant retiré</h1>
+
+
+                          </v-col>
+                          <v-col>
+                            <h1 style="margin-bottom: 4%; font-size: 1.2rem;">0</h1>
+                            <h1 style="margin-bottom: 4%; font-size: 1.2rem;">0$</h1>
+
+
+                            <p></p>
+                          </v-col>
+                        </v-row>
+                      </v-col>
+
+                    </v-row>
+
+
+                  </v-card-text>
+                  <v-card-actions class="justify-center">
+                    <v-btn text="Fermer" @click="isActive.value = false"></v-btn>
+                  </v-card-actions>
+                </v-card>
+
+                <v-card style="border-radius: 25pxo; margin-top: 3%; height: 30px;">
+                  <v-row>
+                    <v-col style="margin-right: -2%;" cols="1"
+                      class="text-truncate text-center font-weight-bold">T#</v-col>
+                    <v-col style="margin-right: -1%; background-color: #fbccee;" cols="1"
+                      class="text-truncate text-center font-weight-bold">$</v-col>
+                    <v-col cols="2" class="text-truncate text-center font-weight-bold">Date</v-col>
+                    <v-col cols="3" class="text-truncate text-center font-weight-bold"
+                      style="margin-right: 2%; background-color: #fbccee">Name</v-col>
+                    <v-col cols="5" class="text-truncate text-center font-weight-bold">message</v-col>
+                  </v-row>
+                </v-card>
+
+                <v-card style=" border-radius: 25pxo; margin-top: .5%; max-height: 450px;">
 
 
 
-
-              </v-container>
+                  <v-row>
+                    <v-col style="margin-right: -2%;" cols="1" class="text-truncate">1</v-col>
+                    <v-col style="margin-right: -1%; background-color: #fbccee;" cols="1"
+                      class="text-truncate">10$</v-col>
+                    <v-col cols="2" class="text-truncate">20-10-2025</v-col>
+                    <v-col cols="3" class="text-truncate"
+                      style="margin-right: 2%;  background-color: #fbccee">Pascal</v-col>
 
 
-            </v-container>
+
+                    <v-col cols="5" class="text-truncate">Good Job</v-col>
+                  </v-row>
+
+
+
+                </v-card>
+
+              </template>
+            </v-dialog>
+
 
 
           </v-container>
@@ -283,8 +310,11 @@
               style="background-color: rgba(255, 255, 255, 0.1); margin-left: -4%; margin-right: -4%; margin-bottom: -5%;">
               <v-container>
 
-                <iframe width=100% height="650px" src="https://www.youtube.com/embed/CDlj1IUhBqg?si=ot1YPBMKbmviOXvD">
-                </iframe>
+                <iframe style="margin-left: 2.1%;" width=96% height="650px"
+                  src="https://www.youtube.com/embed/pf95whtA_xs?start=0" title="Guillaumem" frameborder="0"
+                  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                  allowfullscreen></iframe>
+
 
 
 
@@ -597,7 +627,7 @@ export default {
   margin-left: 15%;
   margin-top: -7%;
   border: 4px solid white;
-  z-index: 9999;
+  z-index: 200;
 
 }