tom.biard
/
ScienceQuest
3
0
Fork 2
Code Issues 3 Pull Requests Packages Projects 1 Releases Wiki Activity

faire un dropdown (dropstart) "Mon compte" dans la barre

Browse Source
front
Gwenael PLANCHON 1 year ago
parent 497d727f06
commit 50df738902
1 changed files with 76 additions and 58 deletions
Show Stats Download Patch File Download Diff File

32
science-quest/src/components/Titre.vue
Unescape View File

@ -31,10 +31,12 @@ export default{
<nav class="navbar navbar-expand-lg bg-body-tertiary"> <nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid"> <div class="container-fluid">
<router-link class="navbar-brand" to="/">{{ nomApp }}</router-link> <router-link class="navbar-brand" to="/">{{ nomApp }}</router-link>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span> <span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" id="navbarSupportedContent"> <div class="collapse navbar-collapse" id="navbarSupportedContent">
<!-- cote gauche -->
<ul class="navbar-nav me-auto mb-2 mb-lg-0"> <ul class="navbar-nav me-auto mb-2 mb-lg-0">
<!--li class="nav-item"> <!--li class="nav-item">
TODO : trouver un moyen de gerer la page courante TODO : trouver un moyen de gerer la page courante
@ -53,23 +55,39 @@ export default{
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><router-link class="dropdown-item" to="/pendu">Pendu</router-link></li> <li><router-link class="dropdown-item" to="/pendu">Pendu</router-link></li>
<li><router-link class="dropdown-item" to="/kahoot">Kahoot</router-link></li> <li><router-link class="dropdown-item" to="/kahoot">Kahoot</router-link></li>
<li><hr class="dropdown-divider"></li> <li>
<hr class="dropdown-divider">
</li>
<li><router-link class="dropdown-item disabled" to="/qui_est_ce">Qui-est-ce</router-link></li> <li><router-link class="dropdown-item disabled" to="/qui_est_ce">Qui-est-ce</router-link></li>
</ul> </ul>
</li> </li>
</ul> </ul>
</div> <!-- cote droit -->
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<button id="boutondarkmode" class="btn" v-on:click="changerDarkMode">💡</button> <button id="boutondarkmode" class="btn" v-on:click="changerDarkMode">💡</button>
<li class="nav-item dropstart">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
{{ utilisateur ? utilisateur?.pseudo : "Mon compte" }}
</a>
<ul class="dropdown-menu">
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
<div v-if="!estConnecte"> <div v-if="!estConnecte">
<router-link class="nav-link" to="/login">Se connecter</router-link> <li><router-link class="dropdown-item" to="/login">Se connecter</router-link></li>
<li><router-link class="dropdown-item" to="/login">Se connecter en tant qu'invité</router-link></li>
</div> </div>
<li>
<hr class="dropdown-divider">
</li>
<li><router-link class="dropdown-item disabled" to="/qui_est_ce">Qui-est-ce</router-link></li>
</ul>
</li>
<div v-if="estConnecte"> <div v-if="estConnecte">
<router-link class="nav-link" to="/profil">{{ utilisateur.pseudo }}</router-link> <router-link class="nav-link" to="/profil">{{ utilisateur.pseudo }}</router-link>
</div> </div>
</ul>
</div>
</div> </div>
</nav> </nav>
</template> </template>
<style scoped> <style scoped></style>
</style>
Write Preview
Loading…
Cancel
Save