From dd1e70206163f7afb78deb1ad116a2ad2d014319 Mon Sep 17 00:00:00 2001
From: Dominic Villemure <doumvil@hotmail.com>
Date: Mon, 8 Apr 2024 23:52:14 -0400
Subject: [PATCH] #25 Cleaning navigation menu in creatorFolio

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

diff --git a/src/views/main/CreatorFolio.vue b/src/views/main/CreatorFolio.vue
index 6d10d87..0925180 100644
--- a/src/views/main/CreatorFolio.vue
+++ b/src/views/main/CreatorFolio.vue
@@ -112,30 +112,104 @@
                   <v-img src="../../../images/hutopy.png" alt="Description de l'image"
                     style="height: 150px; width: 300px;" class="mx-auto" :elevation="10"></v-img>
                   <v-list dense class="main-background">
-                    <v-list-item-group>
-                      <router-link v-for="(item, index) in navigationItems" :key="index" :to="item.link">
+                    <v-list-item v-for="item in navigationItems">
+                      <router-link :to="item.link">
                         <v-btn text class="d-flex align-start align-center main-background" elevation="0"
                           outlined="false">
                           <v-icon left class="mr-4">{{ item.icon }}</v-icon>
                           {{ item.text }}
                         </v-btn>
                       </router-link>
-                    </v-list-item-group>
-                  </v-list>
-                </v-col>
-                <!-- Tools -->
-                <v-col cols="12" class="px-0">
-                  <v-list dense class="d-flex align-start align-center main-background">
-                    <v-list-item-group>
-                      <router-link v-for="(item, index) in tools" :key="index" :to="item.link">
-                        <v-btn text class="btn-custom" elevation="0" outlined="false">
-                          <v-icon left class="mr-4">{{ item.icon }}</v-icon>
-                          {{ item.text }}
-                        </v-btn>
-                      </router-link>
-                    </v-list-item-group>
+                    </v-list-item>
+                    <v-list-item>
+                      <v-dialog transition="dialog-top-transition" width="auto">
+                        <template v-slot:activator="{ props: activatorProps }">
+                          <v-btn v-bind="activatorProps" text class="d-flex align-start align-center main-background" elevation="0"
+                                 outlined="false">
+                            <v-icon left class="mr-4">mdi-wallet</v-icon>
+                            <p @click="isActive.value = false">Bourse</p>
+                          </v-btn>
+                        </template>
+
+                        <!-- Wallet Modale -->
+                        <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-card-text class="text-h1 pa-12">
+                              <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-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>
+                                      <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: 25px; 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: 25px; margin-top: .5%; max-height: 450px;">
+                            <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-col cols="5" class="text-truncate">Good Job</v-col>
+                            </v-row>
+
+                          </v-card>
+                        </template>
+                      </v-dialog>
+                    </v-list-item>
                   </v-list>
                 </v-col>
+
                 <!-- Log-out -->
                 <v-col cols="12" class="px-0 logout-button">
                   <v-btn text class="d-flex align-start main-background align-center" elevation="0" outlined="false">
@@ -149,96 +223,7 @@
 
 
           </v-row>
-
           <v-row style="height: 1400px;"></v-row>
-
-          <!-- Wallet -->
-          <v-row>
-            <v-dialog transition="dialog-top-transition" width="auto">
-              <template v-slot:activator="{ props: activatorProps }">
-                <v-btn v-bind="activatorProps" text class="text-left" block size="x-large"
-                  style="margin-left: -20%; background-color: #f4f4f4; transform: scale(1.3);" elevation="0">
-                  <v-icon color="black">mdi-wallet</v-icon>
-                  <div @click="isActive.value = false">PORTEFEUILLE</div>
-                </v-btn>
-              </template>
-
-              <!-- Wallet Modale -->
-              <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-card-text class="text-h1 pa-12">
-                    <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-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>
-                            <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: 25px; 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: 25px; margin-top: .5%; max-height: 450px;">
-                  <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-col cols="5" class="text-truncate">Good Job</v-col>
-                  </v-row>
-
-                </v-card>
-              </template>
-            </v-dialog>
-          </v-row>
         </v-col>
 
       </v-col>
@@ -491,6 +476,13 @@ let navigationItems = [
 let tools = [
   { icon: 'mdi-wallet', text: 'Bourse', link: '/portefeuille' },
 ]
+
+
+let items = [
+  {icon: "icon", text: "text"},
+  {icon: "icon2", text: "text2"},
+]
+
 </script>
 
 <style scoped>