diff --git a/app/plugins/vuetify.js b/app/plugins/vuetify.js index e8740a3..6d2d7af 100644 --- a/app/plugins/vuetify.js +++ b/app/plugins/vuetify.js @@ -48,6 +48,75 @@ const darkTheme = { }, }; +const minimalLightTheme = { + dark: false, + colors: { + background: "#FFFFFF", + surface: "#F5F5F5", + primary: "#7C90DB", // Azul suave + "primary-darken-1": "#6A7EC9", + secondary: "#E0E0E0", // Gris neutro + "secondary-darken-1": "#C7C7C7", + accent: "#A5C4D4", // Azul pastel + error: "#FF6B6B", // Rojo coral suave + info: "#88C9F2", + success: "#77DD77", // Verde menta + warning: "#FFD166", // Amarillo pastel + "on-primary": "#2D3748", // Gris oscuro + "on-surface": "#2D3748", + }, + variables: { + "border-color": "#E2E8F0", + "border-opacity": 0.16, + }, +}; + +const minimalDarkTheme = { + dark: true, + colors: { + background: "#1E2B3A", + surface: "#2C3E50", + primary: "#8A9EFF", // Azul lavanda (inalterado) + "primary-darken-1": "#778CEB", + secondary: "#4A5568", // Gris azulado (reemplaza grises neutros) + "secondary-darken-1": "#3C4758", + accent: "#A7BED3", // Azul polvo (inalterado) + error: "#FF8A8A", + info: "#90CAF9", + success: "#81C784", + warning: "#FFD54F", + "on-primary": "#F7FAFC", // Blanco casi puro (mejor contraste) + "on-surface": "#E2E8F0", // Gris claro azulado + }, + variables: { + "border-color": "#4A5568", // Coordinado con secondary + "border-opacity": 0.3, + }, +}; + +const softDarkTheme = { + dark: true, + colors: { + background: "#2C3E50", // Gris-azul medio (como cielo nocturno) + surface: "#34495E", // 15% más claro que el fondo + primary: "#7F9CF5", // Azul lavanda más claro + "primary-darken-1": "#6B8BEA", + secondary: "#4B5563", // Gris neutro cálido + "secondary-darken-1": "#3E4A5A", + accent: "#94A3B8", // Gris-azul claro (para detalles) + error: "#FCA5A5", // Rojo suave + info: "#93C5FD", // Azul cielo + success: "#86EFAC", // Verde menta claro + warning: "#FCD34D", // Amarillo miel + "on-primary": "#F8FAFC", // Blanco niebla + "on-surface": "#E5E7EB", // Gris muy claro + }, + variables: { + "border-color": "#475569", // Borde sutil + "border-opacity": 0.25, + }, +}; + export default defineNuxtPlugin((nuxtApp) => { const vuetify = createVuetify({ components, @@ -55,8 +124,8 @@ export default defineNuxtPlugin((nuxtApp) => { theme: { defaultTheme: "light", themes: { - light: lightTheme, - dark: darkTheme, + light: minimalLightTheme, + dark: softDarkTheme, }, variations: { colors: ["primary", "secondary"],