add more infos to overview, fix redo lessons button, add readings to review for clarification

client/src/App.vue

@@ -1,5 +1,67 @@
 <template lang="pug">
   v-app.zen-app.overflow-hidden
+    v-navigation-drawer(
+      v-if="store.token || viewState === 'zooming'"
+      v-model="drawer"
+      temporary
+      location="right"
+      color="#1e1e24"
+      class="border-none"
+      width="280"
+    )
+      .d-flex.flex-column.h-100.pa-4
+        .d-flex.align-center.mb-6.px-2
+          img.mr-3(:src="logo" height="32" width="32" alt="Logo")
+          span.text-h6.font-weight-bold {{ $t('nav.menu') }}
+
+        v-list.pa-0(nav bg-color="transparent")
+          v-list-item.mb-2(
+            to="/"
+            rounded="lg"
+            :active="$route.path === '/'"
+          )
+            template(v-slot:prepend)
+              v-icon(color="#00cec9" icon="mdi-view-dashboard")
+            v-list-item-title.font-weight-bold {{ $t('nav.dashboard') }}
+
+          v-list-item.mb-2(
+            to="/collection"
+            rounded="lg"
+            :active="$route.path === '/collection'"
+          )
+            template(v-slot:prepend)
+              v-icon(color="#00cec9" icon="mdi-bookshelf")
+            v-list-item-title.font-weight-bold {{ $t('nav.collection') }}
+
+        v-divider.my-4.border-subtle
+
+        .d-flex.flex-column.gap-2
+          v-btn.justify-start.px-4(
+            variant="text"
+            block
+            color="grey-lighten-1"
+            @click="showSettings = true; drawer = false"
+          )
+            v-icon(start icon="mdi-cog")
+            | {{ $t('nav.settings') }}
+
+          v-btn.justify-start.px-4(
+            variant="text"
+            block
+            color="grey-lighten-1"
+            :loading="syncing"
+            @click="manualSync"
+          )
+            v-icon(start icon="mdi-sync")
+            | {{ $t('nav.sync') }}
+
+          v-btn.justify-start.px-4.text-red-lighten-2(
+            variant="text"
+            block
+            @click="handleLogout"
+          )
+            v-icon(start icon="mdi-logout")
+            | {{ $t('nav.logout') }}
     .parallax-bg(
       :style="parallaxStyle"
       :class="{ 'zooming': viewState === 'zooming' }"
@@ -22,67 +84,6 @@
       v-if="store.token || viewState === 'zooming'"
       :class="{ 'app-entering': viewState === 'zooming', 'app-visible': viewState === 'app' }"
     )
-      v-navigation-drawer(
-        v-model="drawer"
-        temporary
-        location="right"
-        color="#1e1e24"
-        class="border-none"
-        width="280"
-      )
-        .d-flex.flex-column.h-100.pa-4
-          .d-flex.align-center.mb-6.px-2
-            img.mr-3(:src="logo" height="32" width="32" alt="Logo")
-            span.text-h6.font-weight-bold {{ $t('nav.menu') }}
-
-          v-list.pa-0(nav bg-color="transparent")
-            v-list-item.mb-2(
-              to="/"
-              rounded="lg"
-              :active="$route.path === '/'"
-            )
-              template(v-slot:prepend)
-                v-icon(color="#00cec9" icon="mdi-view-dashboard")
-              v-list-item-title.font-weight-bold {{ $t('nav.dashboard') }}
-
-            v-list-item.mb-2(
-              to="/collection"
-              rounded="lg"
-              :active="$route.path === '/collection'"
-            )
-              template(v-slot:prepend)
-                v-icon(color="#00cec9" icon="mdi-bookshelf")
-              v-list-item-title.font-weight-bold {{ $t('nav.collection') }}
-
-          v-divider.my-4.border-subtle
-
-          .d-flex.flex-column.gap-2
-            v-btn.justify-start.px-4(
-              variant="text"
-              block
-              color="grey-lighten-1"
-              @click="showSettings = true; drawer = false"
-            )
-              v-icon(start icon="mdi-cog")
-              | {{ $t('nav.settings') }}
-
-            v-btn.justify-start.px-4(
-              variant="text"
-              block
-              color="grey-lighten-1"
-              :loading="syncing"
-              @click="manualSync"
-            )
-              v-icon(start icon="mdi-sync")
-              | {{ $t('nav.sync') }}
-
-            v-btn.justify-start.px-4.text-red-lighten-2(
-              variant="text"
-              block
-              @click="handleLogout"
-            )
-              v-icon(start icon="mdi-logout")
-              | {{ $t('nav.logout') }}
 
       v-app-bar.px-2.app-bar-blur.safe-area-header(
         flat