Manage login and logout in mobile view

front/src/AppNavBar.vue

@@ -33,7 +33,7 @@
           </a>
           <BarcodeModal size-class="is-medium"/>
         </div>
-        <a role="button" class="navbar-burger" aria-label="menu"
+        <a v-if="authStore.user" role="button" class="navbar-burger" aria-label="menu"
                                                :class="isMenuActive ? 'is-active' : '' " :aria-expanded="isMenuActive"
                                                @click="isMenuActive = !isMenuActive">
           <span aria-hidden="true"></span>
@@ -54,6 +54,14 @@
         <RouterLink v-if="authStore.user" to="/add" class="navbar-item" activeClass="is-active">
           {{ $t('navbar.addbook')}}
         </RouterLink>
+        <div v-if="authStore.user" class="navbar-item is-hidden-desktop">
+          <a @click="logout">
+            {{ $t('navbar.logout')}}
+            <span class="icon" :title="$t('navbar.logout')">
+              <b-icon-power />
+            </span>
+          </a>
+        </div>
       </div>
       <div class="navbar-end is-hidden-touch">
         <div v-if="authStore.user" class="navbar-item">

front/src/Home.vue

@@ -10,7 +10,15 @@
     {{ $t('home.welcomeuser', {username: authStore.user.username}) }}
   </div>
   <div v-else>
-    {{ $t('home.welcome') }}
+    <p>{{ $t('home.welcome') }}</p>
+    <div class="mt-5 is-hidden-desktop">
+      <RouterLink to="/signup" class="button is-primary mx-2">
+      <strong>{{ $t('navbar.signup')}}</strong>
+      </RouterLink>
+      <RouterLink to="/login" class="button is-light mx-2">
+      {{ $t('navbar.login')}}
+      </RouterLink>
+    </div>
   </div>
 </template>
 

front/src/LogIn.vue

@@ -45,6 +45,7 @@
   <div v-if="formError" class="notification is-danger">
     <p>{{formError}}</p>
   </div>
+  <h1 class="title">{{$t('login.title')}}</h1>
   <form class="box" @submit.prevent="onSubmit">
     <div class="field">
       <label class="label">{{$t('login.username')}}</label>

front/src/SignUp.vue

@@ -39,6 +39,7 @@
   <div v-if="formError" class="notification is-danger">
     <p>{{formError}}</p>
   </div>
+  <h1 class="title">{{$t('signup.title')}}</h1>
   <form class="box" @submit.prevent="onSubmit">
     <div class="field">
       <label class="label">{{$t('signup.username')}}</label>

front/src/locales/en.json

@@ -20,11 +20,13 @@
     "coverupload":"Upload cover"
   },
   "signup": {
+    "title":"Sign up",
     "username":"Username",
     "password":"Password",
     "signup":"Sign up"
   },
   "login": {
+    "title":"Log in",
     "username":"Username",
     "password":"Password",
     "login":"Log in"

front/src/locales/fr.json

@@ -20,14 +20,16 @@
     "coverupload":"Téléverser la couverture"
   },
   "signup": {
+    "title":"Inscription",
     "username":"Nom d'utilisateur",
     "password":"Mot de passe",
     "signup":"S'inscrire"
   },
   "login": {
+    "title":"Connexion",
     "username":"Nom d'utilisateur",
     "password":"Mot de passe",
-    "login":"Connexion"
+    "login":"Se connecter"
   },
   "bookbrowser": {
     "error": "Erreur pendant le chargement des livres: {error}",