Display the nav bar on every view except first account creation

CHANGELOG.md

@@ -16,6 +16,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 - If the browser uses a dark theme, the default theme is also set to dark
+- Display the navigation bar on every view, except the creation of the first account
+
+### Fixed
+- The account deletion view is now emphasized the same way it was before
 
 
 ## [0.4.0] - 2023-09-26

src/views/AboutView.vue

@@ -4,6 +4,7 @@ import { version } from '../../package.json';
 import ButtonGroupComponent from '../components/ButtonGroupComponent.vue';
 import LayoutComponent from '../components/LayoutComponent.vue';
 import ExternalLinkComponent from '../components/ExternalLinkComponent.vue';
+import NavBarComponent from '../components/NavBarComponent.vue';
 
 const router = useRouter();
 const repoUrl = 'https://git.what.tf/rodolphe/sake-app';
@@ -14,6 +15,7 @@ const toMainView = () => {
 </script>
 
 <template>
+	<NavBarComponent />
 	<LayoutComponent>
 		<h1>{{ $t("about.title") }}</h1>
 		<h4>{{ $t("about.name") }}</h4>

src/views/AddAccountView.vue

@@ -8,6 +8,7 @@ import { Modal } from 'bootstrap';
 import base32Encode from 'base32-encode';
 import ButtonGroupComponent from '../components/ButtonGroupComponent.vue';
 import LayoutComponent from '../components/LayoutComponent.vue';
+import NavBarComponent from '../components/NavBarComponent.vue';
 import wasmFile from "../../node_modules/@sec-ant/zxing-wasm/dist/reader/zxing_reader.wasm?url";
 
 const accounts = useStorage('sake-accounts', []);
@@ -175,6 +176,7 @@ const resetErrorMessage = () => {
 </script>
 
 <template>
+	<NavBarComponent v-if="!cancellDisabled" />
 	<LayoutComponent>
 		<h1>{{ $t("addAccount.title") }}</h1>
 

src/views/ConfigView.vue

@@ -6,6 +6,7 @@ import { useI18n } from 'vue-i18n';
 import { useStorage } from '@vueuse/core';
 import ButtonGroupComponent from '../components/ButtonGroupComponent.vue';
 import LayoutComponent from '../components/LayoutComponent.vue';
+import NavBarComponent from '../components/NavBarComponent.vue';
 
 const router = useRouter();
 const stored_locale = useStorage('sake-locale', '');
@@ -28,6 +29,7 @@ watch(colorMode, async (newColorMode) => {
 </script>
 
 <template>
+	<NavBarComponent />
 	<LayoutComponent>
 		<h1>{{ $t("config.title") }}</h1>
 

src/views/DeleteAccountView.vue

@@ -3,6 +3,7 @@ import { useRoute, useRouter } from 'vue-router';
 import { useStorage } from '@vueuse/core';
 import ButtonGroupComponent from '../components/ButtonGroupComponent.vue';
 import LayoutComponent from '../components/LayoutComponent.vue';
+import NavBarComponent from '../components/NavBarComponent.vue';
 
 const accounts = useStorage('sake-accounts', []);
 const router = useRouter();
@@ -19,11 +20,12 @@ const toMainView = () => {
 </script>
 
 <template>
+	<NavBarComponent />
 	<LayoutComponent>
 		<h1>{{ $t("deleteAccount.title") }}</h1>
 
 		<p>{{ $t("deleteAccount.account") }}</p>
-		<p class="has-text-weight-semibold is-size-5">{{ account.localPart }}@{{ account.domain }}</p>
+		<p class="fw-semibold fs-5">{{ account.localPart }}@{{ account.domain }}</p>
 		<p>{{ $t("deleteAccount.confirm") }}</p>
 
 		<ButtonGroupComponent>

src/views/ManageAccountsView.vue

@@ -5,6 +5,7 @@ import { RouterLink, useRouter } from 'vue-router';
 import { useStorage } from '@vueuse/core';
 import ButtonGroupComponent from '../components/ButtonGroupComponent.vue';
 import LayoutComponent from '../components/LayoutComponent.vue';
+import NavBarComponent from '../components/NavBarComponent.vue';
 
 const router = useRouter();
 const accounts = useStorage('sake-accounts', []);
@@ -25,6 +26,7 @@ const toMainView = () => {
 </script>
 
 <template>
+	<NavBarComponent />
 	<LayoutComponent>
 		<h1>{{ $t("manageAccounts.title") }}</h1>