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

#25 Cleaning navigation menu in creatorFolio

Browse Source
This commit is contained in:
Dominic Villemure
2024-04-08 23:52:14 -04:00
parent 45146d12b4
commit dd1e702061
1 changed files with 97 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
src/views/main/CreatorFolio.vue
View File

@@ -112,54 +112,22 @@
<v-img src="../../../images/hutopy.png" alt="Description de l'image" <v-img src="../../../images/hutopy.png" alt="Description de l'image"
style="height: 150px; width: 300px;" class="mx-auto" :elevation="10"></v-img> style="height: 150px; width: 300px;" class="mx-auto" :elevation="10"></v-img>
<v-list dense class="main-background"> <v-list dense class="main-background">
<v-list-item-group> <v-list-item v-for="item in navigationItems">
<router-link v-for="(item, index) in navigationItems" :key="index" :to="item.link"> <router-link :to="item.link">
<v-btn text class="d-flex align-start align-center main-background" elevation="0" <v-btn text class="d-flex align-start align-center main-background" elevation="0"
outlined="false"> outlined="false">
<v-icon left class="mr-4">{{ item.icon }}</v-icon> <v-icon left class="mr-4">{{ item.icon }}</v-icon>
{{ item.text }} {{ item.text }}
</v-btn> </v-btn>
</router-link> </router-link>
</v-list-item-group> </v-list-item>
</v-list> <v-list-item>
</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>
</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">
<v-icon left class="mr-4">mdi-logout</v-icon>
Déconnexion
</v-btn>
</v-col>
</v-container>
</v-col>
</v-row>
<v-row style="height: 1400px;"></v-row>
<!-- Wallet -->
<v-row>
<v-dialog transition="dialog-top-transition" width="auto"> <v-dialog transition="dialog-top-transition" width="auto">
<template v-slot:activator="{ props: activatorProps }"> <template v-slot:activator="{ props: activatorProps }">
<v-btn v-bind="activatorProps" text class="text-left" block size="x-large" <v-btn v-bind="activatorProps" text class="d-flex align-start align-center main-background" elevation="0"
style="margin-left: -20%; background-color: #f4f4f4; transform: scale(1.3);" elevation="0"> outlined="false">
<v-icon color="black">mdi-wallet</v-icon> <v-icon left class="mr-4">mdi-wallet</v-icon>
<div @click="isActive.value = false">PORTEFEUILLE</div> <p @click="isActive.value = false">Bourse</p>
</v-btn> </v-btn>
</template> </template>
@@ -238,7 +206,24 @@
</v-card> </v-card>
</template> </template>
</v-dialog> </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">
<v-icon left class="mr-4">mdi-logout</v-icon>
Déconnexion
</v-btn>
</v-col>
</v-container>
</v-col>
</v-row> </v-row>
<v-row style="height: 1400px;"></v-row>
</v-col> </v-col>
</v-col> </v-col>
@@ -491,6 +476,13 @@ let navigationItems = [
let tools = [ let tools = [
{ icon: 'mdi-wallet', text: 'Bourse', link: '/portefeuille' }, { icon: 'mdi-wallet', text: 'Bourse', link: '/portefeuille' },
] ]
let items = [
{icon: "icon", text: "text"},
{icon: "icon2", text: "text2"},
]
</script> </script>
<style scoped> <style scoped>