This commit introduces module-specific accent colors and further integrates
the primary and secondary theme colors throughout the application's UI components.
Key features:
- Four new customizable accent colors, one for each main module:
- Empleados
- Tareas
- Planillas
- Asistencias
- These accent colors are configurable in the Settings view and persist in local storage.
- Broader application of global primary and secondary colors to common UI elements like navigation bars.
- Module-specific components now use their designated accent color for key visual elements (e.g., primary buttons, titles, icons, borders), providing better visual differentiation between modules.
Changes include:
- Extended `ui/src/stores/useUi.js` to manage state for the four new module accent colors, including actions and local storage persistence.
- Added a "Module Accent Colors" section with color pickers to `ui/src/views/SettingsView.vue`.
- Updated `ui/src/App.vue` to expose these module accent colors as CSS variables (e.g., `--accent-color-empleados`).
- Systematically updated styles in general UI components (`ui/src/components/ui/`) and all module-specific components (`ui/src/components/{module}/` and `ui/src/views/{module}/`) to utilize the new global and module-specific theme colors.
- Updated unit tests for `useUi.js` and component tests for `SettingsView.vue` to cover the new accent color functionality. A bug related to color input event handling in `SettingsView.vue` was identified and fixed during this process.
This enhancement provides a more visually distinct and customizable experience across different sections of the application.
23 lines
490 B
JavaScript
23 lines
490 B
JavaScript
/// <reference types="vitest" />
|
|
import { defineConfig } from 'vite'
|
|
import tailwindcss from '@tailwindcss/vite'
|
|
import vue from '@vitejs/plugin-vue'
|
|
import path from 'node:path'
|
|
|
|
export default defineConfig({
|
|
plugins: [
|
|
vue(),
|
|
tailwindcss(),
|
|
],
|
|
resolve: {
|
|
alias: {
|
|
'@': path.resolve(__dirname, 'src'), // ← apunta a /ui/src
|
|
},
|
|
},
|
|
test: {
|
|
globals: true,
|
|
environment: 'jsdom',
|
|
setupFiles: [], // Can add setup files here if needed later
|
|
},
|
|
})
|