소스 검색

style: :lipstick: ajustes layout login e pagina de email telefone para envio do codigo

ajustes layout login e pagina de email telefone para envio do codigo
Gustavo Zanatta 8 시간 전
부모
커밋
795ac0e930

+ 4 - 4
package.json

@@ -1,9 +1,9 @@
 {
-  "name": "quasar-skeleton",
+  "name": "diarista-cliente-app",
   "version": "0.0.1",
-  "description": "A skeleton for future projects",
-  "productName": "Quasar App",
-  "author": "Denis <denis.gnl@gmail.com>",
+  "description": "Aplicativo para o cliente do Diarista",
+  "productName": "Diarista Cliente App",
+  "author": "zntt <zanattagg@gmail.com>",
   "type": "module",
   "private": true,
   "scripts": {

BIN
public/favicon.ico


BIN
public/icons/favicon-128x128.png


BIN
public/icons/favicon-16x16.png


BIN
public/icons/favicon-32x32.png


BIN
public/icons/favicon-96x96.png


파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 6 - 0
public/logo_diaria_branco.svg


+ 221 - 0
quasar.config.js.temporary.compiled.1773333788777.mjs

@@ -0,0 +1,221 @@
+/* eslint-disable */
+/**
+ * THIS FILE IS GENERATED AUTOMATICALLY.
+ * 1. DO NOT edit this file directly as it won't do anything.
+ * 2. EDIT the original quasar.config file INSTEAD.
+ * 3. DO NOT git commit this file. It should be ignored.
+ *
+ * This file is still here because there was an error in
+ * the original quasar.config file and this allows you to
+ * investigate the Node.js stack error.
+ *
+ * After you fix the original file, this file will be
+ * deleted automatically.
+ **/
+
+
+// quasar.config.js
+import { defineConfig } from "@quasar/app-vite/wrappers";
+import { fileURLToPath } from "node:url";
+var __quasar_inject_import_meta_url__ = "file:///home/softpar/projetos/spas/sfp_front_vue_diarista_cliente/quasar.config.js";
+var quasar_config_default = defineConfig((ctx) => {
+  return {
+    bin: {
+      linuxAndroidStudio: "/snap/bin/android-studio"
+    },
+    // https://v2.quasar.dev/quasar-cli-vite/prefetch-feature
+    // preFetch: true,
+    // app boot file (/src/boot)
+    // --> boot files are part of "main.js"
+    // https://v2.quasar.dev/quasar-cli-vite/boot-files
+    boot: [
+      "axios",
+      "i18n",
+      "defaultPropsComponents"
+      // "socket.io",
+    ],
+    // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
+    css: ["app.scss"],
+    // https://github.com/quasarframework/quasar/tree/dev/extras
+    extras: [
+      // 'ionicons-v4',
+      "mdi-v7",
+      // 'fontawesome-v6',
+      // 'eva-icons',
+      // 'themify',
+      // "line-awesome",
+      // 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both!
+      "roboto-font",
+      // optional, you are not bound to it
+      "material-icons"
+      // optional, you are not bound to it
+    ],
+    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#build
+    build: {
+      target: {
+        browser: ["es2022", "firefox115", "chrome115", "safari14"],
+        node: "node22"
+      },
+      vueRouterMode: "history",
+      // available values: 'hash', 'history'
+      // vueRouterBase,
+      // vueDevtools,
+      // vueOptionsAPI: false,
+      // rebuildCache: true, // rebuilds Vite/linter/etc cache on startup
+      // publicPath: '/',
+      // analyze: true,
+      env: {
+        API_URL: ctx.dev ? "http://localhost:3000" : "http://localhost:3000",
+        PASSWORD: ctx.dev ? "S@ft2080." : "",
+        WEBSOCKET_API: ctx.dev ? "http://localhost:4321/" : "http://localhost:4321/",
+        WEBSOCKET_PATH: ctx.dev ? "/socket.io" : "/socket.io",
+        WEBSOCKET_ROOM: ctx.dev ? "LARAVEL" : "LARAVEL",
+        WEBSOCKET_API_KEY: "7wArC/kl0nTbt4zBu0agw.NXLyjA96I6x1XmBcuokwPqfo3/CIxzqYw.PTthh5eqa08Uf4ubFlOqatpShoz1CRRID9pZReEFvBk3il6E9u"
+      },
+      // rawDefine: {}
+      // ignorePublicFolder: true,
+      // minify: false,
+      // polyfillModulePreload: true,
+      // distDir
+      // extendViteConf (viteConf) {},
+      // viteVuePluginOptions: {},
+      vitePlugins: [
+        [
+          "@intlify/unplugin-vue-i18n/vite",
+          {
+            include: [fileURLToPath(new URL("./src/i18n", __quasar_inject_import_meta_url__))],
+            ssr: ctx.modeName === "ssr"
+          }
+        ],
+        [
+          "vite-plugin-checker",
+          {
+            eslint: {
+              lintCommand: 'eslint -c ./eslint.config.js "./src*/**/*.{js,mjs,cjs,vue}"',
+              useFlatConfig: true
+            }
+          },
+          { server: false }
+        ]
+      ]
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#devServer
+    devServer: {
+      // https: true
+      open: true
+      // opens browser window automatically
+    },
+    // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#framework
+    framework: {
+      lang: "pt-BR",
+      config: {
+        dark: "auto",
+        notify: {
+          position: "top-right"
+        }
+      },
+      // iconSet: 'material-icons', // Quasar icon set
+      // lang: 'en-US', // Quasar language pack
+      // For special cases outside of where the auto-import strategy can have an impact
+      // (like functional components as one of the examples),
+      // you can manually specify Quasar components/directives to be available everywhere:
+      //
+      // components: [],
+      // directives: [],
+      // Quasar plugins
+      plugins: ["Dialog", "Notify", "Loading", "Cookies", "Dark"]
+    },
+    // animations: 'all', // --- includes all animations
+    // https://v2.quasar.dev/options/animations
+    animations: [],
+    // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#property-sourcefiles
+    // sourceFiles: {
+    //   rootComponent: 'src/App.vue',
+    //   router: 'src/router/index',
+    //   store: 'src/store/index',
+    //   pwaRegisterServiceWorker: 'src-pwa/register-service-worker',
+    //   pwaServiceWorker: 'src-pwa/custom-service-worker',
+    //   pwaManifestFile: 'src-pwa/manifest.json',
+    //   electronMain: 'src-electron/electron-main',
+    //   electronPreload: 'src-electron/electron-preload'
+    //   bexManifestFile: 'src-bex/manifest.json
+    // },
+    // https://v2.quasar.dev/quasar-cli-vite/developing-ssr/configuring-ssr
+    ssr: {
+      prodPort: 3e3,
+      // The default port that the production server should use
+      // (gets superseded if process.env.PORT is specified at runtime)
+      middlewares: [
+        "render"
+        // keep this as last one
+      ],
+      // extendPackageJson (json) {},
+      // extendSSRWebserverConf (esbuildConf) {},
+      // manualStoreSerialization: true,
+      // manualStoreSsrContextInjection: true,
+      // manualStoreHydration: true,
+      // manualPostHydrationTrigger: true,
+      pwa: false
+      // pwaOfflineHtmlFilename: 'offline.html', // do NOT use index.html as name!
+      // will mess up SSR
+      // pwaExtendGenerateSWOptions (cfg) {},
+      // pwaExtendInjectManifestOptions (cfg) {}
+    },
+    // https://v2.quasar.dev/quasar-cli-vite/developing-pwa/configuring-pwa
+    pwa: {
+      workboxMode: "GenerateSW"
+      // 'GenerateSW' or 'InjectManifest'
+      // swFilename: 'sw.js',
+      // manifestFilename: 'manifest.json'
+      // extendManifestJson (json) {},
+      // useCredentialsForManifestTag: true,
+      // injectPwaMetaTags: false,
+      // extendPWACustomSWConf (esbuildConf) {},
+      // extendGenerateSWOptions (cfg) {},
+      // extendInjectManifestOptions (cfg) {}
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-cordova-apps/configuring-cordova
+    cordova: {
+      // noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-capacitor-apps/configuring-capacitor
+    capacitor: {
+      hideSplashscreen: true
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-electron-apps/configuring-electron
+    electron: {
+      // extendElectronMainConf (esbuildConf) {},
+      // extendElectronPreloadConf (esbuildConf) {},
+      // extendPackageJson (json) {},
+      // Electron preload scripts (if any) from /src-electron, WITHOUT file extension
+      preloadScripts: ["electron-preload"],
+      // specify the debugging port to use for the Electron app when running in development mode
+      inspectPort: 5858,
+      bundler: "packager",
+      // 'packager' or 'builder'
+      packager: {
+        // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options
+        // OS X / Mac App Store
+        // appBundleId: '',
+        // appCategoryType: '',
+        // osxSign: '',
+        // protocol: 'myapp://path',
+        // Windows only
+        // win32metadata: { ... }
+      },
+      builder: {
+        // https://www.electron.build/configuration/configuration
+        appId: "quasar-skeleton"
+      }
+    },
+    // Full list of options: https://v2.quasar.dev/quasar-cli-vite/developing-browser-extensions/configuring-bex
+    bex: {
+      // extendBexScriptsConf (esbuildConf) {},
+      // extendBexManifestJson (json) {},
+      contentScripts: ["my-content-script"]
+    }
+  };
+});
+export {
+  quasar_config_default as default
+};

+ 4 - 2
src/App.vue

@@ -5,6 +5,7 @@
 <script setup>
 import { useQuasar } from "quasar";
 import { StatusBar } from "@capacitor/status-bar";
+import { Capacitor } from "@capacitor/core";
 import { watch, onBeforeMount } from "vue";
 import { useI18n } from "vue-i18n";
 import { Preferences } from "@capacitor/preferences";
@@ -35,10 +36,11 @@ watch(
 );
 
 onBeforeMount(async () => {
-  await StatusBar.show();
+  const isNative = Capacitor.isNativePlatform();
+  if (isNative) await StatusBar.show();
   const { value: themePref } = await Preferences.get({ key: "theme" });
   const theme = themePref || systemTheme;
-  await StatusBar.setStyle({ style: theme.toUpperCase() });
+  if (isNative) await StatusBar.setStyle({ style: theme.toUpperCase() });
   const { value: localePref } = await Preferences.get({ key: "locale" });
   const userLocale = localePref || window.navigator.language;
   console.log(theme, userLocale);

+ 9 - 0
src/assets/background-login.svg

@@ -0,0 +1,9 @@
+<svg width="320" height="695" viewBox="0 0 320 695" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="-1" width="321" height="701" fill="url(#paint0_linear_1128_16578)" fill-opacity="0.9"/>
+<defs>
+<linearGradient id="paint0_linear_1128_16578" x1="159.5" y1="0" x2="159.5" y2="701" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E37FFC"/>
+<stop offset="1" stop-color="#4B80EF"/>
+</linearGradient>
+</defs>
+</svg>

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 6 - 0
src/assets/foto_diarista_login.svg


파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 6 - 0
src/assets/logo-diarista.svg


BIN
src/assets/logo.png


+ 37 - 0
src/assets/logo_diaria_campos_login.svg

@@ -0,0 +1,37 @@
+<svg width="143" height="44" viewBox="0 0 143 44" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M49.9305 16.932C49.0792 16.1473 48.6523 15.1626 48.6523 13.9755C48.6523 12.7884 49.0792 11.757 49.9305 10.9589C50.7819 10.1609 51.9112 9.76074 53.3161 9.76074C54.721 9.76074 55.8103 10.1609 56.6617 10.9589C57.5131 11.7592 57.9399 12.764 57.9399 13.9755C57.9399 15.187 57.5131 16.1451 56.6617 16.932C55.8103 17.719 54.6944 18.1102 53.3161 18.1102C51.9379 18.1102 50.7819 17.7167 49.9305 16.932ZM57.2486 23.063V40.6444C57.2486 42.1938 55.9926 43.4476 54.4454 43.4476H52.1068C50.5574 43.4476 49.3037 42.1916 49.3037 40.6444V23.063C49.3037 21.5136 50.5596 20.2598 52.1068 20.2598H54.4454C55.9948 20.2598 57.2486 21.5158 57.2486 23.063Z" fill="url(#paint0_linear_2187_20250)"/>
+<path d="M61.7704 25.5506C62.6218 23.7588 63.7844 22.3828 65.2582 21.4158C66.7298 20.4511 68.3726 19.9687 70.1843 19.9687C71.7515 19.9687 73.1031 20.2866 74.239 20.9201C74.6858 21.1691 75.0926 21.4536 75.4616 21.7715C76.0152 22.2494 76.8755 21.8493 76.8755 21.118C76.8755 20.6445 77.26 20.2599 77.7335 20.2599H83.9623C84.4358 20.2599 84.8203 20.6445 84.8203 21.118V42.5896C84.8203 43.0631 84.4358 43.4477 83.9623 43.4477H77.7335C77.26 43.4477 76.8755 43.0631 76.8755 42.5896V42.5829C76.8755 41.8538 76.0174 41.4492 75.4639 41.9272C75.0904 42.2495 74.6747 42.5362 74.219 42.7874C73.0697 43.421 71.7248 43.7389 70.1843 43.7389C68.3726 43.7389 66.7298 43.2565 65.2582 42.2917C63.7844 41.3269 62.6218 39.942 61.7704 38.137C60.919 36.3319 60.4922 34.2312 60.4922 31.8327C60.4922 29.4341 60.919 27.34 61.7704 25.5483V25.5506ZM77.9136 14.8536L69.4952 18.2192C68.9306 18.4437 68.317 18.0303 68.317 17.4212V13.7422C68.317 13.4065 68.5127 13.1019 68.8172 12.9619L77.2356 9.08281C77.8047 8.8205 78.4538 9.2362 78.4538 9.86307V14.0578C78.4538 14.409 78.2404 14.7247 77.9136 14.8559V14.8536ZM75.6773 28.3204C74.8792 27.4667 73.8989 27.0399 72.7385 27.0399C71.5781 27.0399 70.5622 27.4601 69.7797 28.3004C68.995 29.1406 68.6038 30.3188 68.6038 31.8349C68.6038 33.3509 68.995 34.5002 69.7797 35.3694C70.5645 36.2364 71.5492 36.6721 72.7385 36.6721C73.9278 36.6721 74.8815 36.2452 75.6773 35.3916C76.4731 34.538 76.8732 33.3532 76.8732 31.8371C76.8732 30.321 76.4753 29.1784 75.6773 28.3226V28.3204Z" fill="url(#paint1_linear_2187_20250)"/>
+<path d="M100.552 21.2093C101.436 20.6713 102.368 20.3201 103.346 20.1578C104.026 20.0445 104.646 20.578 104.646 21.2671V27.5692C104.646 28.1894 104.144 28.6918 103.524 28.6918H102.417C100.687 28.6918 99.4025 29.0364 98.5644 29.7255C97.7264 30.4146 97.3084 31.6128 97.3084 33.3222V42.3275C97.3084 42.9477 96.806 43.4501 96.1858 43.4501H90.4839C89.8637 43.4501 89.3613 42.9477 89.3613 42.3275V21.3805C89.3613 20.7603 89.8637 20.2579 90.4839 20.2579H96.1858C96.806 20.2579 97.3084 20.7603 97.3084 21.3805C97.3084 22.343 98.4421 22.861 99.1646 22.2274C99.5981 21.8473 100.06 21.5072 100.552 21.2093Z" fill="url(#paint2_linear_2187_20250)"/>
+<path d="M108.114 16.932C107.263 16.1473 106.836 15.1626 106.836 13.9755C106.836 12.7884 107.263 11.757 108.114 10.9589C108.966 10.1609 110.095 9.76074 111.5 9.76074C112.905 9.76074 113.994 10.1609 114.845 10.9589C115.697 11.7592 116.124 12.764 116.124 13.9755C116.124 15.187 115.697 16.1451 114.845 16.932C113.994 17.719 112.878 18.1102 111.5 18.1102C110.121 18.1102 108.966 17.7167 108.114 16.932ZM115.432 23.1252V40.5822C115.432 42.1649 114.15 43.4498 112.565 43.4498H110.35C108.768 43.4498 107.483 42.1672 107.483 40.5822V23.1252C107.483 21.5425 108.765 20.2576 110.35 20.2576H112.565C114.147 20.2576 115.432 21.5402 115.432 23.1252Z" fill="url(#paint3_linear_2187_20250)"/>
+<path d="M119.95 25.5496C120.801 23.7579 121.964 22.3819 123.438 21.4149C124.91 20.4502 126.552 19.9678 128.364 19.9678C129.931 19.9678 131.283 20.2857 132.419 20.9192C132.866 21.1682 133.272 21.4527 133.641 21.7706C134.195 22.2485 135.055 21.8484 135.055 21.117C135.055 20.6436 135.44 20.259 135.913 20.259H142.142C142.615 20.259 143 20.6436 143 21.117V42.5887C143 43.0622 142.615 43.4468 142.142 43.4468H135.913C135.44 43.4468 135.055 43.0622 135.055 42.5887V42.582C135.055 41.8529 134.197 41.4483 133.644 41.9262C133.27 42.2486 132.854 42.5353 132.399 42.7865C131.249 43.4201 129.905 43.738 128.364 43.738C126.552 43.738 124.91 43.2556 123.438 42.2908C121.964 41.326 120.801 39.9411 119.95 38.1361C119.099 36.331 118.672 34.2303 118.672 31.8318C118.672 29.4332 119.099 27.3391 119.95 25.5474V25.5496ZM133.857 28.3195C133.059 27.4658 132.079 27.039 130.918 27.039C129.758 27.039 128.742 27.4592 127.959 28.2995C127.175 29.1397 126.783 30.3179 126.783 31.834C126.783 33.35 127.175 34.4993 127.959 35.3685C128.744 36.2354 129.729 36.6712 130.918 36.6712C132.107 36.6712 133.061 36.2443 133.857 35.3907C134.653 34.5371 135.053 33.3523 135.053 31.8362C135.053 30.3201 134.655 29.1775 133.857 28.3217V28.3195Z" fill="url(#paint4_linear_2187_20250)"/>
+<path d="M24.2126 0H3.96176C0.439968 0 -1.32425 4.25476 1.16472 6.74298L4.02382 9.59867C4.86604 10.4399 6.00968 10.9136 7.19987 10.9136H24.2104C29.8001 10.9136 34.3326 15.4407 34.3326 21.0237V22.3829C34.3326 25.4688 32.9207 28.2404 30.711 30.0733C30.0882 30.5891 29.902 31.4635 30.2833 32.1763L32.012 35.4239C32.3533 36.0459 31.6264 36.7034 31.039 36.3049L26.4778 32.7453C26.163 32.4996 25.7685 32.3689 25.3696 32.3911C24.9972 32.411 24.6626 32.3778 24.1883 32.3778H7.19987C6.00746 32.3778 4.86604 32.8515 4.02382 33.6927L1.31986 36.3935C-1.22895 38.9392 0.577382 43.2914 4.18118 43.2914H24.2038C35.8308 43.2914 45.2592 33.8765 45.2592 22.2611V21.0259C45.2592 9.41493 35.8352 0.00442669 24.2126 0.00442669V0Z" fill="url(#paint5_linear_2187_20250)"/>
+<path d="M10.9242 17.9377L11.6106 19.39C11.6676 19.511 11.7773 19.5932 11.9045 19.6138L13.4396 19.8467C13.7598 19.8946 13.887 20.3034 13.6568 20.5386L12.5449 21.6711C12.4528 21.7648 12.4111 21.8995 12.433 22.0296L12.6962 23.6303C12.751 23.9614 12.4155 24.2149 12.1304 24.0573L10.7597 23.3038C10.6457 23.2421 10.5097 23.2421 10.3956 23.3038L9.02496 24.0573C8.73986 24.2149 8.40431 23.9614 8.45695 23.6303L8.72012 22.0296C8.74205 21.8972 8.70038 21.7648 8.60827 21.6711L7.49638 20.5386C7.2661 20.3034 7.3933 19.8946 7.71349 19.8467L9.24865 19.6138C9.37585 19.5955 9.48551 19.511 9.54253 19.39L10.2268 17.9377C10.3693 17.634 10.7838 17.634 10.9264 17.9377H10.9242Z" fill="#FE7FFF"/>
+<path d="M19.2875 17.9377L19.9739 19.39C20.0309 19.511 20.1406 19.5932 20.2678 19.6138L21.8029 19.8467C22.1231 19.8946 22.2503 20.3034 22.02 20.5386L20.9081 21.6711C20.816 21.7648 20.7744 21.8995 20.7963 22.0296L21.0595 23.6303C21.1143 23.9614 20.7788 24.2149 20.4937 24.0573L19.123 23.3038C19.0089 23.2421 18.873 23.2421 18.7589 23.3038L17.3882 24.0573C17.1031 24.2149 16.7676 23.9614 16.8202 23.6303L17.0834 22.0296C17.1053 21.8972 17.0637 21.7648 16.9716 21.6711L15.8597 20.5386C15.6294 20.3034 15.7566 19.8946 16.0768 19.8467L17.6119 19.6138C17.7391 19.5955 17.8488 19.511 17.9058 19.39L18.5901 17.9377C18.7326 17.634 19.1471 17.634 19.2896 17.9377H19.2875Z" fill="#FE7FFF"/>
+<path d="M27.6507 17.9377L28.3372 19.39C28.3942 19.511 28.5038 19.5932 28.631 19.6138L30.1662 19.8467C30.4864 19.8946 30.6136 20.3034 30.3833 20.5386L29.2714 21.6711C29.1793 21.7648 29.1377 21.8995 29.1596 22.0296L29.4228 23.6303C29.4776 23.9614 29.142 24.2149 28.8569 24.0573L27.4863 23.3038C27.3722 23.2421 27.2362 23.2421 27.1222 23.3038L25.7515 24.0573C25.4664 24.2149 25.1309 23.9614 25.1835 23.6303L25.4467 22.0296C25.4686 21.8972 25.4269 21.7648 25.3348 21.6711L24.2229 20.5386C23.9927 20.3034 24.1199 19.8946 24.4401 19.8467L25.9752 19.6138C26.1024 19.5955 26.2121 19.511 26.2691 19.39L26.9533 17.9377C27.0959 17.634 27.5104 17.634 27.6529 17.9377H27.6507Z" fill="#FE7FFF"/>
+<defs>
+<linearGradient id="paint0_linear_2187_20250" x1="48.6546" y1="26.6042" x2="57.9377" y2="26.6042" gradientUnits="userSpaceOnUse">
+<stop stop-color="#3D80EE"/>
+<stop offset="1" stop-color="#2F80ED"/>
+</linearGradient>
+<linearGradient id="paint1_linear_2187_20250" x1="60.4922" y1="26.3686" x2="84.8203" y2="26.3686" gradientUnits="userSpaceOnUse">
+<stop stop-color="#3D80EE"/>
+<stop offset="1" stop-color="#2F80ED"/>
+</linearGradient>
+<linearGradient id="paint2_linear_2187_20250" x1="89.3613" y1="31.7973" x2="104.646" y2="31.7973" gradientUnits="userSpaceOnUse">
+<stop stop-color="#3D80EE"/>
+<stop offset="1" stop-color="#2F80ED"/>
+</linearGradient>
+<linearGradient id="paint3_linear_2187_20250" x1="106.836" y1="-16.2613" x2="116.121" y2="-16.2613" gradientUnits="userSpaceOnUse">
+<stop stop-color="#3D80EE"/>
+<stop offset="1" stop-color="#2F80ED"/>
+</linearGradient>
+<linearGradient id="paint4_linear_2187_20250" x1="118.674" y1="31.854" x2="143" y2="31.854" gradientUnits="userSpaceOnUse">
+<stop stop-color="#3D80EE"/>
+<stop offset="1" stop-color="#2F80ED"/>
+</linearGradient>
+<linearGradient id="paint5_linear_2187_20250" x1="0.00112925" y1="21.6435" x2="45.2592" y2="21.6435" gradientUnits="userSpaceOnUse">
+<stop stop-color="#3D80EE"/>
+<stop offset="1" stop-color="#2F80ED"/>
+</linearGradient>
+</defs>
+</svg>

+ 12 - 0
src/assets/logo_diaria_login.svg

@@ -0,0 +1,12 @@
+<svg width="155" height="148" viewBox="0 0 155 148" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M36.9291 114.049C35.8501 113.054 35.3105 111.807 35.3105 110.304C35.3105 108.802 35.8501 107.495 36.9291 106.484C38.0082 105.472 39.435 104.965 41.2174 104.965C42.9999 104.965 44.3747 105.472 45.4538 106.484C46.5328 107.495 47.0724 108.77 47.0724 110.304C47.0724 111.839 46.5328 113.054 45.4538 114.049C44.3747 115.044 42.9639 115.54 41.2174 115.54C39.4709 115.54 38.0082 115.044 36.9291 114.049ZM46.1971 121.814V144.083C46.1971 146.045 44.6065 147.636 42.6442 147.636H39.6828C37.7205 147.636 36.1298 146.045 36.1298 144.083V121.814C36.1298 119.852 37.7205 118.261 39.6828 118.261H42.6442C44.6065 118.261 46.1971 119.852 46.1971 121.814Z" fill="white"/>
+<path d="M51.9233 124.964C53.0024 122.694 54.4731 120.951 56.3395 119.728C58.2058 118.505 60.284 117.894 62.5781 117.894C64.5643 117.894 66.2749 118.297 67.7136 119.097C68.2811 119.412 68.7967 119.772 69.2603 120.176C69.9597 120.783 71.0507 120.276 71.0507 119.349C71.0507 118.749 71.5383 118.261 72.1378 118.261H80.0269C80.6264 118.261 81.114 118.749 81.114 119.349V146.545C81.114 147.144 80.6264 147.632 80.0269 147.632H72.1378C71.5383 147.632 71.0507 147.144 71.0507 146.545V146.537C71.0507 145.614 69.9637 145.102 69.2643 145.706C68.7927 146.113 68.2651 146.477 67.6856 146.797C66.2309 147.6 64.5284 148 62.5781 148C60.284 148 58.2058 147.388 56.3395 146.165C54.4731 144.942 53.0024 143.192 51.9233 140.902C50.8442 138.616 50.3047 135.954 50.3047 132.917C50.3047 129.879 50.8442 127.23 51.9233 124.96V124.964ZM72.3696 111.415L61.7068 115.676C60.9914 115.959 60.2161 115.436 60.2161 114.665V110.005C60.2161 109.581 60.4639 109.193 60.8476 109.017L71.5103 104.106C72.2297 103.774 73.053 104.302 73.053 105.093V110.404C73.053 110.848 72.7812 111.248 72.3696 111.415ZM69.536 128.473C68.5249 127.39 67.286 126.85 65.8113 126.85C64.3365 126.85 63.0536 127.382 62.0625 128.449C61.0674 129.512 60.5718 131.006 60.5718 132.925C60.5718 134.843 61.0674 136.302 62.0625 137.401C63.0536 138.5 64.3046 139.051 65.8113 139.051C67.318 139.051 68.5249 138.512 69.536 137.429C70.5472 136.346 71.0507 134.847 71.0507 132.925C71.0507 131.002 70.5472 129.556 69.536 128.473Z" fill="white"/>
+<path d="M101.041 119.469C102.164 118.79 103.343 118.346 104.582 118.139C105.445 117.995 106.228 118.67 106.228 119.545V127.526C106.228 128.31 105.593 128.949 104.806 128.949H103.403C101.213 128.949 99.5862 129.385 98.5231 130.256C97.4601 131.127 96.9325 132.646 96.9325 134.812V146.218C96.9325 147.002 96.2971 147.641 95.5097 147.641H88.288C87.5047 147.641 86.8652 147.006 86.8652 146.218V119.689C86.8652 118.906 87.5007 118.266 88.288 118.266H95.5097C96.2931 118.266 96.9325 118.902 96.9325 119.689C96.9325 120.908 98.3673 121.564 99.2825 120.76C99.834 120.277 100.417 119.849 101.041 119.469Z" fill="white"/>
+<path d="M110.619 114.049C109.54 113.054 109 111.807 109 110.304C109 108.802 109.54 107.495 110.619 106.484C111.698 105.472 113.124 104.965 114.907 104.965C116.689 104.965 118.064 105.472 119.143 106.484C120.222 107.495 120.762 108.77 120.762 110.304C120.762 111.839 120.222 113.054 119.143 114.049C118.064 115.044 116.653 115.54 114.907 115.54C113.16 115.54 111.698 115.044 110.619 114.049ZM119.887 121.894V144.003C119.887 146.009 118.26 147.636 116.254 147.636H113.452C111.446 147.636 109.819 146.009 109.819 144.003V121.894C109.819 119.888 111.446 118.261 113.452 118.261H116.254C118.26 118.261 119.887 119.888 119.887 121.894Z" fill="white"/>
+<path d="M125.613 124.963C126.692 122.693 128.163 120.951 130.029 119.728C131.895 118.505 133.973 117.894 136.268 117.894C138.254 117.894 139.964 118.297 141.403 119.097C141.971 119.412 142.486 119.772 142.95 120.176C143.649 120.783 144.74 120.275 144.74 119.348C144.74 118.749 145.228 118.261 145.827 118.261H153.716C154.316 118.261 154.803 118.749 154.803 119.348V146.545C154.803 147.144 154.316 147.632 153.716 147.632H145.827C145.228 147.632 144.74 147.144 144.74 146.545V146.537C144.74 145.614 143.653 145.102 142.954 145.705C142.482 146.113 141.955 146.477 141.375 146.797C139.92 147.6 138.218 147.999 136.268 147.999C133.973 147.999 131.895 147.388 130.029 146.165C128.163 144.942 126.692 143.192 125.613 140.902C124.534 138.616 123.994 135.954 123.994 132.917C123.994 129.879 124.534 127.229 125.613 124.959V124.963ZM143.225 128.472C142.214 127.389 140.975 126.85 139.501 126.85C138.026 126.85 136.743 127.381 135.752 128.448C134.757 129.511 134.261 131.006 134.261 132.925C134.261 134.843 134.757 136.302 135.752 137.401C136.743 138.5 137.994 139.051 139.501 139.051C141.007 139.051 142.214 138.512 143.225 137.429C144.237 136.346 144.74 134.847 144.74 132.925C144.74 131.002 144.237 129.555 143.225 128.472Z" fill="white"/>
+<path d="M1.6186 124.964C2.69766 122.694 4.17638 120.951 6.05875 119.728C7.94112 118.505 10.0313 117.894 12.3253 117.894C14.1757 117.894 15.8263 118.286 17.281 119.073C17.8805 119.397 18.424 119.768 18.9156 120.188C19.615 120.787 20.6941 120.268 20.6941 119.349V109.977C20.6941 109.377 21.1817 108.89 21.7811 108.89H29.7223C30.3217 108.89 30.8093 109.377 30.8093 109.977V146.545C30.8093 147.145 30.3217 147.632 29.7223 147.632H21.7811C21.1817 147.632 20.6941 147.145 20.6941 146.545C20.6941 145.618 19.603 145.11 18.9036 145.718C18.44 146.121 17.9205 146.481 17.357 146.797C15.9182 147.6 14.2237 148 12.2734 148C9.97936 148 7.90116 147.388 6.03477 146.165C4.16839 144.942 2.69766 143.192 1.6186 140.902C0.539531 138.616 0 135.954 0 132.917C0 129.879 0.539531 127.23 1.6186 124.96V124.964ZM19.2313 128.473C18.2202 127.39 16.9813 126.85 15.5066 126.85C14.0318 126.85 12.749 127.382 11.7578 128.449C10.7627 129.512 10.2671 131.006 10.2671 132.925C10.2671 134.843 10.7627 136.302 11.7578 137.401C12.749 138.5 13.9999 139.052 15.5066 139.052C17.0133 139.052 18.2202 138.512 19.2313 137.429C20.2425 136.346 20.746 134.847 20.746 132.925C20.746 131.002 20.2425 129.556 19.2313 128.473Z" fill="white"/>
+<path d="M80.471 0H39.4306C31.0818 0 26.9014 10.0953 32.8043 15.9981L37.3444 20.5382C39.2068 22.4006 41.7326 23.4477 44.3663 23.4477H80.467C92.6285 23.4477 102.484 33.3032 102.484 45.4646V48.0943C102.484 54.6607 99.5105 60.5635 94.8466 64.5081C93.4318 65.7031 93.0282 67.7134 93.8994 69.3479L97.5003 76.1181C98.2317 77.4529 96.673 78.8677 95.4141 78.0124L85.7065 70.427C84.9671 69.8475 84.0399 69.5718 83.1008 69.6077C82.3534 69.6357 81.662 69.5758 80.7068 69.5758H44.3623C41.7286 69.5758 39.2028 70.6228 37.3404 72.4852L33.2359 76.5897C27.1732 82.6524 31.4655 93.0234 40.042 93.0234H80.451C105.569 93.0234 125.932 72.6611 125.932 47.5428V45.4646C125.932 20.3544 105.577 0 80.467 0H80.471Z" fill="white"/>
+<path d="M51.9488 38.4668L53.4355 41.4921C53.5594 41.7439 53.7952 41.9158 54.071 41.9557L57.4001 42.4433C58.0915 42.5432 58.3713 43.3945 57.8677 43.8861L55.4538 46.248C55.254 46.4438 55.166 46.7236 55.21 46.9954L55.7775 50.3285C55.8974 51.0199 55.17 51.5474 54.5466 51.2197L51.5731 49.6491C51.3254 49.5172 51.0296 49.5172 50.7818 49.6491L47.8084 51.2197C47.1889 51.5474 46.4616 51.0199 46.5775 50.3285L47.145 46.9954C47.1929 46.7196 47.101 46.4438 46.9012 46.248L44.4873 43.8861C43.9877 43.3945 44.2635 42.5432 44.9589 42.4433L48.292 41.9557C48.5677 41.9158 48.8075 41.7399 48.9274 41.4921L50.4141 38.4668C50.7259 37.8353 51.6251 37.8353 51.9328 38.4668H51.9488Z" fill="white"/>
+<path d="M70.2203 38.4668L71.707 41.4921C71.8309 41.7439 72.0667 41.9158 72.3425 41.9557L75.6716 42.4433C76.363 42.5432 76.6427 43.3945 76.1392 43.8861L73.7253 46.248C73.5254 46.4438 73.4375 46.7236 73.4815 46.9954L74.049 50.3285C74.1689 51.0199 73.4415 51.5474 72.8181 51.2197L69.8446 49.6491C69.5968 49.5172 69.3011 49.5172 69.0533 49.6491L66.0799 51.2197C65.4604 51.5474 64.7331 51.0199 64.849 50.3285L65.4165 46.9954C65.4644 46.7196 65.3725 46.4438 65.1727 46.248L62.7588 43.8861C62.2592 43.3945 62.535 42.5432 63.2304 42.4433L66.5635 41.9557C66.8392 41.9158 67.079 41.7399 67.1989 41.4921L68.6856 38.4668C68.9974 37.8353 69.8966 37.8353 70.2043 38.4668H70.2203Z" fill="white"/>
+<path d="M88.4879 38.4668L89.9746 41.4921C90.0985 41.7439 90.3343 41.9158 90.6101 41.9557L93.9392 42.4433C94.6306 42.5432 94.9103 43.3945 94.4068 43.8861L91.9929 46.248C91.793 46.4438 91.7051 46.7236 91.7491 46.9954L92.3166 50.3285C92.4365 51.0199 91.7091 51.5474 91.0856 51.2197L88.1122 49.6491C87.8644 49.5172 87.5687 49.5172 87.3209 49.6491L84.3475 51.2197C83.728 51.5474 83.0006 51.0199 83.1165 50.3285L83.684 46.9954C83.732 46.7196 83.6401 46.4438 83.4403 46.248L81.0263 43.8861C80.5268 43.3945 80.8025 42.5432 81.4979 42.4433L84.831 41.9557C85.1068 41.9158 85.3466 41.7399 85.4665 41.4921L86.9532 38.4668C87.2649 37.8353 88.1642 37.8353 88.4719 38.4668H88.4879Z" fill="white"/>
+</svg>

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 6 - 0
src/assets/logo_small.svg


+ 24 - 9
src/css/app.scss

@@ -54,17 +54,17 @@ body.body--light {
   background: #{map.get($colors, "page")} !important;
 }
 
-body.body--dark {
-  .q-drawer:has(.detached-container) {
-    background: #{map.get($colors-dark, "surface")} !important;
-  }
+// body.body--dark {
+//   .q-drawer:has(.detached-container) {
+//     background: #{map.get($colors-dark, "surface")} !important;
+//   }
 
-  .q-menu {
-    background: #{map.get($colors-dark, "surface")};
-  }
+//   .q-menu {
+//     background: #{map.get($colors-dark, "surface")};
+//   }
 
-  background: #{map.get($colors-dark, "page")};
-}
+//   background: #{map.get($colors-dark, "page")};
+// }
 
 .q-card__actions .q-btn {
   padding: 10px 16px;
@@ -99,3 +99,18 @@ input[type="number"]::-webkit-outer-spin-button {
     display: none;
   }
 }
+
+.q-field .q-field__control {
+  border: 1.5px solid #e4e4e4 !important;
+  border-radius: 4px !important;
+  height: 44px !important;
+  transition: border-color 0.36s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.q-btn {
+  font-family: "Inter", sans-serif;
+  font-weight: 700;
+  font-size: 15px;
+  color: #ffffff;
+  text-transform: lowercase;
+}

+ 153 - 136
src/css/quasar.variables.scss

@@ -1,148 +1,165 @@
-// Quasar SCSS Variables with Material Design Color System
+// Quasar SCSS Variables with Custom Color System
 // --------------------------------------------------
 
 // Primary Theme Colors
-$primary: #1976d2; // Material Blue 700
-$secondary: #9c27b0; // Material Purple 500
-$accent: #e91e63; // Material Pink 500
+$primary: #8B5CF6; // Vibrant Purple (main brand color)
+$secondary: #EC4899; // Pink/Magenta (secondary brand color)
+$accent: #F59E0B; // Amber/Orange (accent highlights)
 
 // Dark Theme Base Colors
 $dark: #1d1d1d;
 
 // Status Colors
-$positive: #2e7d32; // Material Green 800
-$negative: #d32f2f; // Material Red 700
-$info: #0288d1; // Material Light Blue 700
-$warning: #ed6c02; // Material Orange 800
+$positive: #10B981; // Emerald Green (success, online status)
+$negative: #EF4444; // Red (errors, alerts)
+$info: #3B82F6; // Blue (informational)
+$warning: #F59E0B; // Amber (warnings)
 
 // Extended Color System with Light/Dark Variants
 $colors: (
-  // Primary Colors and Variants
-  "primary": #1976d2,
-  // Base - Blue 700
-  "primary-light": #42a5f5,
-  // Light - Blue 400
-  "primary-dark": #1565c0,
-
-  // Dark - Blue 800
-  // Secondary Colors and Variants
-  "secondary": #9c27b0,
-  // Base - Purple 500
-  "secondary-light": #ba68c8,
-  // Light - Purple 300
-  "secondary-dark": #7b1fa2,
-
-  // Terceary Colors and Variants
-  "terciary": #ff9800,
-  // Base - Orange 500
-  "terciary-light": #ffb74d,
-  // Light - Orange 300
-  "terciary-dark": #f57c00,
-
-  // Dark - Purple 700
+  // Primary Colors and Variants (Purple Theme)
+  "primary": #8B5CF6,
+  // Base - Vibrant Purple
+  "primary-light": #A78BFA,
+  // Light Purple
+  "primary-dark": #7C3AED,
+  // Dark Purple
+  "primary-button": #9A7FF6,
+  // Slightly lighter purple for buttons
+
+  // Secondary Colors and Variants (Pink/Magenta Theme)
+  "secondary": #EC4899,
+  // Base - Pink
+  "secondary-light": #F9A8D4,
+  // Light Pink
+  "secondary-dark": #DB2777,
+  // Dark Pink
+
+  // Tertiary Colors and Variants (Amber/Orange Accent)
+  "terciary": #F59E0B,
+  // Base - Amber
+  "terciary-light": #FCD34D,
+  // Light Amber
+  "terciary-dark": #D97706,
+  // Dark Amber
+
   // Background Colors
-  "page": #f1f1f1,
+  "page": #F9FAFB,
+  // Very Light Gray (App Background)
 
-  // Surface Colors
-  "surface": #ffffff,
-  "surface-light": #f5f5f5,
-  "surface-dark": #f1f1f1,
+  // Surface Colors (Cards, Panels)
+  "surface": #FFFFFF,
+  // Pure White
+  "surface-light": #F9FAFB,
+  // Very Light Gray
+  "surface-dark": #F3F4F6,
+  // Light Gray
 
-  //text color
-  "text": #000000,
+  // Text Colors
+  "text": #555555,
+  // Very Dark Gray (almost black)
 
   // Status Colors with Variants
-  "success": #2e7d32,
-  // Green 800
-  "success-light": #4caf50,
-  // Green 500
-  "success-dark": #1b5e20,
-
-  // Green 900
-  "error": #d32f2f,
-  // Red 700
-  "error-light": #ef5350,
-  // Red 400
-  "error-dark": #c62828,
-
-  // Red 800
-  "warning": #ed6c02,
-  // Orange 800
-  "warning-light": #ff9800,
-  // Orange 500
-  "warning-dark": #e65100,
-
-  // Orange 900
-  "info": #0288d1,
-  // Light Blue 700
-  "info-light": #03a9f4,
-  // Light Blue 500
-  "info-dark": #01579b
+  "success": #10B981,
+  // Emerald Green
+  "success-light": #34D399,
+  // Light Green
+  "success-dark": #059669,
+  // Dark Green
+
+  "error": #EF4444,
+  // Red
+  "error-light": #F87171,
+  // Light Red
+  "error-dark": #DC2626,
+  // Dark Red
+
+  "warning": #F59E0B,
+  // Amber
+  "warning-light": #FCD34D,
+  // Light Amber
+  "warning-dark": #D97706,
+  // Dark Amber
+
+  "info": #3B82F6,
+  // Blue
+  "info-light": #60A5FA,
+  // Light Blue
+  "info-dark": #2563EB
+  // Dark Blue
 );
 
 // Dark Theme Color Overrides
-$colors-dark: (
-  // Primary Colors and Variants
-  "primary": #1976d2,
-  // Base - Blue 700
-  "primary-light": #42a5f5,
-  // Blue 50
-  "primary-dark": #1565c0,
-
-  "dark": #1d1d1d,
-
-  // Blue 400
-  // Secondary Colors - Lighter in Dark Mode
-  "secondary": #ce93d8,
-  // Purple 200
-  "secondary-light": #f3e5f5,
-  // Purple 50
-  "secondary-dark": #ab47bc,
-
-  //Terceary Colors - Lighter in Dark Mode
-  "terciary": #ffd191,
-  // Yellow 200
-  "terciary-light": #ffecb3,
-  // Yellow 50
-  "terciary-dark": #ffab40,
-
-  "page": #121212,
-
-  "surface": #1d1d1d,
-  "surface-light": #333333,
-  "surface-dark": #121212,
-
-  "text": #ffffff,
-
-  // Black Background
-  // Status Colors - Adjusted for Dark Mode
-  "success": #66bb6a,
-  // Green 400
-  "success-light": #81c784,
-  // Green 300
-  "success-dark": #388e3c,
-
-  // Green 700
-  "error": #f44336,
-  // Red 500
-  "error-light": #e57373,
-  // Red 300
-  "error-dark": #d32f2f,
-
-  // Red 700
-  "warning": #ffa726,
-  // Orange 400
-  "warning-light": #ffb74d,
-  // Orange 300
-  "warning-dark": #f57c00,
-
-  // Orange 700
-  "info": #29b6f6,
-  // Light Blue 400
-  "info-light": #4fc3f7,
-  // Light Blue 300
-  "info-dark": #0288d1 // Light Blue 700
-);
+// $colors-dark: (
+//   // Primary Colors and Variants (Purple - adjusted for dark mode)
+//   "primary": #8B5CF6,
+//   // Vibrant Purple (same as light)
+//   "primary-light": #A78BFA,
+//   // Light Purple
+//   "primary-dark": #6D28D9,
+//   // Darker Purple for dark mode
+
+//   "dark": #1d1d1d,
+
+//   // Secondary Colors (Pink - adjusted for dark mode)
+//   "secondary": #F472B6,
+//   // Lighter Pink for dark mode
+//   "secondary-light": #FBCFE8,
+//   // Very Light Pink
+//   "secondary-dark": #DB2777,
+//   // Dark Pink
+
+//   // Tertiary Colors (Amber - adjusted for dark mode)
+//   "terciary": #FBBF24,
+//   // Lighter Amber for dark mode
+//   "terciary-light": #FDE68A,
+//   // Very Light Amber
+//   "terciary-dark": #F59E0B,
+//   // Amber
+
+//   // Dark Mode Backgrounds
+//   "page": #0F172A,
+//   // Very Dark Blue-Gray
+
+//   "surface": #1E293B,
+//   // Dark Blue-Gray (Cards)
+//   "surface-light": #334155,
+//   // Medium Blue-Gray
+//   "surface-dark": #0F172A,
+//   // Very Dark Blue-Gray
+
+//   "text": #F1F5F9,
+//   // Almost White
+
+//   // Status Colors - Adjusted for Dark Mode
+//   "success": #34D399,
+//   // Lighter Emerald for visibility
+//   "success-light": #6EE7B7,
+//   // Very Light Green
+//   "success-dark": #10B981,
+//   // Emerald
+
+//   "error": #F87171,
+//   // Lighter Red for visibility
+//   "error-light": #FCA5A5,
+//   // Very Light Red
+//   "error-dark": #EF4444,
+//   // Red
+
+//   "warning": #FBBF24,
+//   // Lighter Amber for visibility
+//   "warning-light": #FDE68A,
+//   // Very Light Amber
+//   "warning-dark": #F59E0B,
+//   // Amber
+
+//   "info": #60A5FA,
+//   // Lighter Blue for visibility
+//   "info-light": #93C5FD,
+//   // Very Light Blue
+//   "info-dark": #3B82F6
+//   // Blue
+// );
 
 // Generate color utility classes for light theme
 @each $name, $color in $colors {
@@ -155,13 +172,13 @@ $colors-dark: (
 }
 
 // Generate color utility classes for dark theme
-.body--dark {
-  @each $name, $color in $colors-dark {
-    .text-#{$name} {
-      color: $color !important;
-    }
-    .bg-#{$name} {
-      background: $color !important;
-    }
-  }
-}
+// .body--dark {
+//   @each $name, $color in $colors-dark {
+//     .text-#{$name} {
+//       color: $color !important;
+//     }
+//     .bg-#{$name} {
+//       background: $color !important;
+//     }
+//   }
+// }

+ 3 - 0
src/i18n/locales/en.json

@@ -36,6 +36,7 @@
       "complement": "Complement",
       "postal_code": "Postal Code",
       "phone": "Phone",
+      "celular": "Cell Phone",
       "document": "Document",
       "document_type": "Document Type",
       "cpf": "CPF",
@@ -129,6 +130,8 @@
     "login": "Login",
     "logout": "Logout",
     "registration": "Registration",
+    "confirm": "Confirm",
+    "continue": "Continue",
     "confirm_password": "Confirm Password",
     "agreed_terms": "I agree with the terms",
     "agreed_privacy": "I agree with the privacy policy"

+ 3 - 0
src/i18n/locales/es.json

@@ -36,6 +36,7 @@
       "complement": "Complemento",
       "postal_code": "Código postal",
       "phone": "Teléfono",
+      "celular": "Celular",
       "document": "Documento",
       "document_type": "Tipo de documento",
       "cpf": "CPF",
@@ -129,6 +130,8 @@
     "login": "Iniciar sesión",
     "logout": "Cerrar sesión",
     "registration": "Registro",
+    "confirm": "Confirmar",
+    "continue": "Continuar",
     "confirm_password": "Confirmar contraseña",
     "agreed_terms": "Acepto los términos",
     "agreed_privacy": "Acepto la política de privacidad"

+ 3 - 0
src/i18n/locales/pt.json

@@ -36,6 +36,7 @@
       "complement": "Complemento",
       "postal_code": "Código Postal",
       "phone": "Telefone",
+      "celular": "Celular",
       "document": "Documento",
       "document_type": "Tipo de Documento",
       "cpf": "CPF",
@@ -129,6 +130,8 @@
     "login": "Login",
     "logout": "Sair",
     "registration": "Cadastro",
+    "confirm": "Confirmar",
+    "continue": "Continuar",
     "confirm_password": "Confirmar Senha",
     "agreed_terms": "Eu concordo com os termos",
     "agreed_privacy": "Eu concordo com a política de privacidade"

+ 139 - 72
src/pages/LoginPage.vue

@@ -1,46 +1,69 @@
 <template>
-  <q-page padding class="login-page">
-    <q-card flat class="login-card q-pa-md q-pt-xl bg-surface">
-      <div class="text-center">
-        <q-img :src="Logo" style="max-width: 250px" />
-        <div class="text-h6">{{ $t("common.ui.messages.welcome") }}</div>
+  <q-page :padding="clicked" class="login-page bg-surface-dark">
+    <Transition name="fade-slide" mode="out-in">
+    <q-card v-if="clicked" key="login" flat class="login-card q-pa-md q-pt-xl bg-surface-dark column">
+      <div class="text-center col-4">
+        <q-img :src="LogoDiariaCampos" style="max-width: 200px" />
       </div>
-
+      <!-- <q-space></q-space> -->
       <q-form
         ref="loginForm"
-        class="q-pa-md"
+        class="col column"
         autocorrect="off"
         autocapitalize="off"
         autocomplete="off"
         spellcheck="false"
-        @submit="submitLogin"
+        @submit="submitCode"
       >
-        <q-card-section class="q-mt-sm">
+        <q-card-section>
+          <div class="text-text">
+            <span class="text-weight-medium">{{ $t('common.terms.email') }}</span>
+          </div>
           <q-input
             v-model="email"
-            filled
-            type="email"
-            label="Email"
-            lazy-rules
-            autofocus
-            :rules="[inputRules.required, inputRules.email]"
+            no-error-icon
+            outlined
+            rounded
+            class="bg-surface q-mt-sm"
+            input-class="text-text"
+            :placeholder="$t('common.terms.email')"
+            hide-bottom-space
           />
-
-          <DefaultPasswordInput
-            v-model="password"
-            :rules="[inputRules.required, inputRules.min(6)]"
+          <div class="col-12 row q-py-lg">
+            <div class="col-5 q-my-auto">
+              <q-separator
+                class="q-my-sm bg-grey-4"
+              />
+            </div>
+            <span class="col text-center text-text">{{ $t('common.ui.misc.or') }}</span>
+            <div class="col-5 q-my-auto">
+              <q-separator
+                class="q-my-sm bg-grey-4"
+              />          
+            </div>
+          </div>
+          <div class="text-text">
+            <span class="text-weight-medium">{{ $t('common.terms.phone') }}</span>
+            <span class="text-weight-light">{{ ' (' + $t('common.terms.celular') + ')' }}</span>
+          </div>
+          <q-input
+            v-model="phone"
+            no-error-icon
+            class="bg-surface q-mt-sm"
+            :placeholder="$t('common.terms.phone')"
+            input-class="text-text"
+            hide-bottom-space
           />
-
-          <q-checkbox v-model="checkbox" label="Lembrar email" />
         </q-card-section>
-
-        <q-card-actions align="right">
+      <q-space></q-space>
+        <q-card-actions align="center">
           <q-btn
-            color="primary"
-            :label="$t('auth.login')"
-            size="md"
-            padding="md"
+            color="primary-button"
+            :label="$t('auth.continue')"
+            rounded
+            padding="12px 16px"
             type="submit"
+            class="col-12"
             :loading="submitting"
           >
             <template #loading>
@@ -50,82 +73,126 @@
         </q-card-actions>
       </q-form>
     </q-card>
+    <q-card v-else-if="!clicked" key="splash" class="bg-login" @click="clicked = true">
+      <img :src="BackgroundLogin" class="layer-background" />
+      <img :src="FotoDiarista" class="layer-photo" />
+      <img :src="LogoLogin" class="layer-logo" />
+    </q-card>
+    </Transition>
   </q-page>
 </template>
 
 <script setup>
 import { ref, onMounted } from "vue";
-import { useAuth } from "src/composables/useAuth";
-import { useRouter } from "vue-router";
-import { useInputRules } from "src/composables/useInputRules";
+// import { useAuth } from "src/composables/useAuth";
+// import { useRouter } from "vue-router";
+// import { useInputRules } from "src/composables/useInputRules";
 
-import Logo from "src/assets/logo.png";
-import DefaultPasswordInput from "src/components/defaults/DefaultPasswordInput.vue";
-import { Preferences } from "@capacitor/preferences";
+import LogoDiariaCampos from "src/assets/logo_diaria_campos_login.svg";
+import BackgroundLogin from "src/assets/background-login.svg";
+import FotoDiarista from "src/assets/foto_diarista_login.svg";
+import LogoLogin from "src/assets/logo_diaria_login.svg";
+// import { Preferences } from "@capacitor/preferences";
 
-const router = useRouter();
+// const router = useRouter();
 
-const { inputRules } = useInputRules();
+// const { inputRules } = useInputRules();
 const email = ref("");
-const password = ref(process.env.PASSWORD);
+const phone = ref("");
 const submitting = ref(false);
 const loginForm = ref(null);
-const checkbox = ref(false);
+// const checkbox = ref(false);
+const clicked = ref(false);
 
-const submitLogin = async () => {
-  try {
-    submitting.value = true;
+// const submitLogin = async () => {
+//   try {
+//     submitting.value = true;
 
-    const validate = await loginForm.value.validate();
+//     const validate = await loginForm.value.validate();
 
-    if (!validate) {
-      return;
-    }
+//     if (!validate) {
+//       return;
+//     }
 
-    const { value: email_storage } = await Preferences.get({ key: "email" });
+//     await useAuth().login(email.value, phone.value);
 
-    if (email_storage && !checkbox.value) {
-      await Preferences.remove({ key: "email" });
-    }
-    if (checkbox.value) {
-      await Preferences.set({ key: "email", value: email.value });
-    }
+//     submitting.value = false;
 
-    await useAuth().login(email.value, password.value);
+//     router.push({ name: "DashboardPage" });
+//   } catch (error) {
+//     console.error(error);
+//     submitting.value = false;
+//   }
+// };
 
-    submitting.value = false;
-
-    router.push({ name: "DashboardPage" });
-  } catch (error) {
-    console.error(error);
-    submitting.value = false;
-  }
-};
+const submitCode = () => {
+  console.log("submit code", email.value, phone.value);
+}
 
 onMounted(async () => {
-  const { value: email_storage } = await Preferences.get({ key: "email" });
-
-  if (email_storage) {
-    checkbox.value = true;
-    email.value = email_storage;
-  }
-
-  if (process.env.DEV && process.env.SENHA) {
-    password.value = process.env.SENHA;
-  }
 });
 </script>
 
 <style lang="scss" scoped>
+.fade-slide-enter-active,
+.fade-slide-leave-active {
+  transition: opacity 0.4s ease, transform 0.4s ease;
+}
+
+.fade-slide-enter-from {
+  opacity: 0;
+  transform: translateY(5px);
+}
+
+.fade-slide-leave-to {
+  opacity: 0;
+  transform: translateY(-5px);
+}
+
 .login-page {
   display: flex;
   justify-content: center;
   align-items: center;
 
   .login-card {
-    width: 100%;
+    width: 100vw;
     max-width: 500px;
-    border-radius: 12px;
+    height: 90vh;
+    max-height: 800px;
+  }
+}
+
+.bg-login {
+  position: relative;
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
+
+  .layer-background {
+    position: absolute;
+    inset: 0;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  .layer-photo {
+    position: absolute;
+    inset: 0;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    opacity: 0.15;
+    mix-blend-mode: multiply;
+  }
+
+  .layer-logo {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 180px;
+    z-index: 1;
   }
 }
 </style>

이 변경점에서 너무 많은 파일들이 변경되어 몇몇 파일들은 표시되지 않았습니다.