From 91de6eb56eff24b4042d0eb378ab7b5e3571061b Mon Sep 17 00:00:00 2001 From: alexm Date: Mon, 2 Oct 2023 14:54:00 +0200 Subject: [PATCH] refs #6067 feat: outLayout verifyEmail --- src/assets/{logo.svg => salix.svg} | 0 src/assets/salix_dark.svg | 32 ++++ src/assets/{logo_icon.svg => salix_icon.svg} | 0 src/assets/vn.svg | 158 ++++++++++++++++++ src/assets/vn_dark.svg | 161 +++++++++++++++++++ src/assets/vn_icon.svg | 72 +++++++++ src/components/NavBar.vue | 2 +- src/components/ui/VnLogo.vue | 24 +++ src/css/quasar.variables.scss | 1 + src/layouts/OutLayout.vue | 13 +- src/pages/Login/LoginMain.vue | 25 +-- src/pages/Login/TwoFactor.vue | 15 +- src/pages/Login/VerifyEmail.vue | 117 ++++++++++++++ src/router/index.js | 2 +- src/router/routes.js | 6 + 15 files changed, 603 insertions(+), 25 deletions(-) rename src/assets/{logo.svg => salix.svg} (100%) create mode 100644 src/assets/salix_dark.svg rename src/assets/{logo_icon.svg => salix_icon.svg} (100%) create mode 100644 src/assets/vn.svg create mode 100644 src/assets/vn_dark.svg create mode 100644 src/assets/vn_icon.svg create mode 100644 src/components/ui/VnLogo.vue create mode 100644 src/pages/Login/VerifyEmail.vue diff --git a/src/assets/logo.svg b/src/assets/salix.svg similarity index 100% rename from src/assets/logo.svg rename to src/assets/salix.svg diff --git a/src/assets/salix_dark.svg b/src/assets/salix_dark.svg new file mode 100644 index 000000000..10de3af4f --- /dev/null +++ b/src/assets/salix_dark.svg @@ -0,0 +1,32 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/logo_icon.svg b/src/assets/salix_icon.svg similarity index 100% rename from src/assets/logo_icon.svg rename to src/assets/salix_icon.svg diff --git a/src/assets/vn.svg b/src/assets/vn.svg new file mode 100644 index 000000000..23b6df49c --- /dev/null +++ b/src/assets/vn.svg @@ -0,0 +1,158 @@ + +image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/vn_dark.svg b/src/assets/vn_dark.svg new file mode 100644 index 000000000..4d53b7b39 --- /dev/null +++ b/src/assets/vn_dark.svg @@ -0,0 +1,161 @@ + +image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/vn_icon.svg b/src/assets/vn_icon.svg new file mode 100644 index 000000000..738c8157c --- /dev/null +++ b/src/assets/vn_icon.svg @@ -0,0 +1,72 @@ + + + +image/svg+xml \ No newline at end of file diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue index 7d09b09b8..4e3e241b8 100644 --- a/src/components/NavBar.vue +++ b/src/components/NavBar.vue @@ -47,7 +47,7 @@ const pinnedModulesRef = ref(); > diff --git a/src/components/ui/VnLogo.vue b/src/components/ui/VnLogo.vue new file mode 100644 index 000000000..3b955289d --- /dev/null +++ b/src/components/ui/VnLogo.vue @@ -0,0 +1,24 @@ + + + diff --git a/src/css/quasar.variables.scss b/src/css/quasar.variables.scss index 808bf3468..6a3700561 100644 --- a/src/css/quasar.variables.scss +++ b/src/css/quasar.variables.scss @@ -21,6 +21,7 @@ $positive: #21ba45; $negative: #c10015; $info: #31ccec; $warning: #f2c037; +$vnColor: #8ebb27; // Pendiente de cuadrar con la base de datos $success: $positive; diff --git a/src/layouts/OutLayout.vue b/src/layouts/OutLayout.vue index 6ea14622f..f21e6e568 100644 --- a/src/layouts/OutLayout.vue +++ b/src/layouts/OutLayout.vue @@ -80,7 +80,7 @@ const langs = ['en', 'es'];
- +
@@ -97,15 +97,4 @@ const langs = ['en', 'es']; min-height: inherit; flex-direction: column; } - -.formCard { - max-width: 350px; - min-width: 300px; -} - -@media (max-width: $breakpoint-xs-max) { - .formCard { - min-width: 100%; - } -} diff --git a/src/pages/Login/LoginMain.vue b/src/pages/Login/LoginMain.vue index 7c0bbbd44..2e4fd91ca 100644 --- a/src/pages/Login/LoginMain.vue +++ b/src/pages/Login/LoginMain.vue @@ -8,6 +8,8 @@ import axios from 'axios'; import { useSession } from 'src/composables/useSession'; import { useLogin } from 'src/composables/useLogin'; +import VnLogo from 'components/ui/VnLogo.vue'; + const quasar = useQuasar(); const session = useSession(); const loginCache = useLogin(); @@ -64,14 +66,8 @@ async function onSubmit() { - + diff --git a/src/pages/Login/TwoFactor.vue b/src/pages/Login/TwoFactor.vue index f14e85418..1c99e8dec 100644 --- a/src/pages/Login/TwoFactor.vue +++ b/src/pages/Login/TwoFactor.vue @@ -48,7 +48,7 @@ async function onSubmit() { } - + diff --git a/src/pages/Login/VerifyEmail.vue b/src/pages/Login/VerifyEmail.vue new file mode 100644 index 000000000..b07b2a9c4 --- /dev/null +++ b/src/pages/Login/VerifyEmail.vue @@ -0,0 +1,117 @@ + + + + + { + "en": { + "verifyEmail": "Your email has been successfully verified. You can now log in to enjoy all the features of our platform.", + "goToShop": "Go to the shop", + "logIn": "Log In" + }, + "es": { + "verifyEmail": "Su correo electrónico ha sido verificado con éxito. Ahora puede iniciar sesión para disfrutar de todas las funcionalidades de nuestra plataforma.", + "goToShop": "Ir a la tienda", + "logIn": "Iniciar sesión" + }, + "fr": { + "verifyEmail": "Votre courrier électronique a été vérifié avec succès. Vous pouvez maintenant vous connecter pour profiter de toutes les fonctionnalités de notre plateforme.", + "goToShop": "Aller à la boutique", + "logIn": "Se connecter" + }, + "pt": { + "verifyEmail": "Seu e-mail foi verificado com sucesso. Agora você pode fazer o login para aproveitar todas as funcionalidades da nossa plataforma.", + "goToShop": "Ir para a loja", + "logIn": "Fazer login" + }, + "it": { + "verifyEmail": "La tua email è stata verificata con successo. Ora puoi accedere per godere di tutte le funzionalità della nostra piattaforma.", + "goToShop": "Vai al negozio", + "logIn": "Accedi" + } + } + + + diff --git a/src/router/index.js b/src/router/index.js index cccf9af6d..ca560e9c9 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -45,7 +45,7 @@ export { Router }; export default route(function (/* { store, ssrContext } */) { Router.beforeEach(async (to, from, next) => { const { isLoggedIn } = session; - const outLayout = ['Login', 'TwoFactor']; + const outLayout = ['Login', 'TwoFactor', 'VerifyEmail']; if (!isLoggedIn() && !outLayout.includes(to.name)) { return next({ name: 'Login', query: { redirect: to.fullPath } }); } diff --git a/src/router/routes.js b/src/router/routes.js index 4425996b0..e3aa22a06 100644 --- a/src/router/routes.js +++ b/src/router/routes.js @@ -23,6 +23,12 @@ const routes = [ meta: { title: 'twoFactor' }, component: () => import('../pages/Login/TwoFactor.vue'), }, + { + path: '/verifyEmail', + name: 'VerifyEmail', + meta: { title: 'verifyEmail' }, + component: () => import('../pages/Login/VerifyEmail.vue'), + }, ], }, {