josedario87
9cbc5f94c3
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m4s
- Eliminar CataResumenMuestra.vue y CataFormularioMuestra.vue duplicados - Usar componentes existentes en components/cata/ que ya se auto-registran como CataResumenMuestra y CataFormularioMuestra - Resolver conflicto de nombres en Nuxt que impedía el build
209 lines
8.1 KiB
TypeScript
209 lines
8.1 KiB
TypeScript
export default defineAppConfig({
|
|
ui: {
|
|
// ========================================================================
|
|
// COLORES PERSONALIZADOS - MODO CLARO Y OSCURO
|
|
// ========================================================================
|
|
colors: {
|
|
// Modo claro: Paleta de azules (celeste a oscuro)
|
|
primary: {
|
|
50: '#e0f2fe', // Azul muy claro
|
|
100: '#bae6fd', // Azul celeste claro
|
|
200: '#87CEEB', // Azul celeste (SkyBlue)
|
|
300: '#7dd3fc', // Azul celeste medio
|
|
400: '#38bdf8', // Azul medio
|
|
500: '#4682B4', // Azul acero (SteelBlue)
|
|
600: '#0284c7', // Azul más intenso
|
|
700: '#0369a1', // Azul oscuro
|
|
800: '#075985', // Azul muy oscuro
|
|
900: '#00008B', // Azul oscuro intenso (DarkBlue)
|
|
950: '#000066', // Azul casi negro
|
|
},
|
|
},
|
|
|
|
// ========================================================================
|
|
// CONFIGURACIÓN DE VARIABLES CSS PERSONALIZADAS
|
|
// ========================================================================
|
|
variables: {
|
|
light: {
|
|
background: '0 0% 100%', // Blanco puro
|
|
foreground: '0 0% 0%', // Negro puro
|
|
|
|
// Colores primarios para modo claro (azul)
|
|
primary: '203 92% 54%', // #4682B4 (SteelBlue)
|
|
'primary-foreground': '0 0% 0%', // Texto negro sobre azul
|
|
|
|
// Bordes y outlines en azul
|
|
border: '203 50% 70%', // Azul celeste para bordes
|
|
muted: '203 30% 40%', // Azul oscuro para texto secundario
|
|
'muted-foreground': '0 0% 20%', // Gris oscuro
|
|
|
|
// Superficies con outline
|
|
elevated: '0 0% 100%', // Blanco (sin relleno)
|
|
accented: '203 92% 94%', // Azul muy claro para hover
|
|
},
|
|
dark: {
|
|
background: '0 0% 0%', // Negro puro
|
|
foreground: '120 100% 50%', // Verde terminal (#00FF00)
|
|
|
|
// Colores primarios para modo oscuro (verde terminal)
|
|
primary: '120 100% 50%', // #00FF00 (Verde terminal)
|
|
'primary-foreground': '0 0% 0%', // Negro sobre verde
|
|
|
|
// Bordes y outlines en verde
|
|
border: '120 100% 40%', // Verde oscuro para bordes
|
|
muted: '120 80% 30%', // Verde apagado
|
|
'muted-foreground': '120 50% 60%', // Verde claro para texto secundario
|
|
|
|
// Superficies con outline
|
|
elevated: '0 0% 0%', // Negro (sin relleno)
|
|
accented: '120 100% 10%', // Verde muy oscuro para hover
|
|
},
|
|
},
|
|
|
|
// ========================================================================
|
|
// PERSONALIZACIÓN DE COMPONENTES
|
|
// ========================================================================
|
|
|
|
// Accordion: Solo outlines, sin rellenos
|
|
accordion: {
|
|
slots: {
|
|
root: 'w-full',
|
|
item: 'border border-primary/30 last:border-b dark:border-primary/50',
|
|
header: 'flex',
|
|
trigger: 'group flex-1 flex items-center gap-1.5 font-medium text-sm py-3.5 px-4 focus-visible:outline-primary min-w-0 dark:font-mono',
|
|
content: 'data-[state=open]:animate-[accordion-down_200ms_ease-out] data-[state=closed]:animate-[accordion-up_200ms_ease-out] overflow-hidden focus:outline-none',
|
|
body: 'text-sm pb-3.5 px-4',
|
|
leadingIcon: 'shrink-0 size-5',
|
|
trailingIcon: 'shrink-0 size-5 ms-auto group-data-[state=open]:rotate-180 transition-transform duration-200',
|
|
label: 'text-start break-words dark:font-mono',
|
|
},
|
|
},
|
|
|
|
// Tabs: Estilo minimalista con outlines
|
|
tabs: {
|
|
slots: {
|
|
root: 'flex items-center gap-2',
|
|
list: 'relative flex p-0 group border-b border-primary/30 dark:border-primary/50',
|
|
indicator: 'absolute transition-[translate,width] duration-200 border-b-2 border-primary dark:border-primary',
|
|
trigger: [
|
|
'group relative inline-flex items-center min-w-0 px-4 py-2',
|
|
'data-[state=inactive]:text-muted hover:data-[state=inactive]:not-disabled:text-default',
|
|
'font-medium dark:font-mono',
|
|
'transition-colors',
|
|
'border-b-2 border-transparent',
|
|
'data-[state=active]:text-primary data-[state=active]:border-primary',
|
|
],
|
|
leadingIcon: 'shrink-0',
|
|
label: 'truncate dark:font-mono',
|
|
content: 'focus:outline-none w-full py-4',
|
|
},
|
|
variants: {
|
|
orientation: {
|
|
horizontal: {
|
|
root: 'flex-col',
|
|
list: 'w-full',
|
|
indicator: 'left-0 w-(--reka-tabs-indicator-size) translate-x-(--reka-tabs-indicator-position) bottom-0',
|
|
},
|
|
vertical: {
|
|
list: 'flex-col border-r border-b-0',
|
|
indicator: 'top-0 h-(--reka-tabs-indicator-size) translate-y-(--reka-tabs-indicator-position) right-0 border-r-2 border-b-0',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
|
|
// Slider: Personalización para intensidades
|
|
slider: {
|
|
slots: {
|
|
root: 'relative flex items-center select-none touch-none',
|
|
track: 'relative bg-transparent border border-primary/30 dark:border-primary/50 overflow-hidden rounded-full grow',
|
|
range: 'absolute rounded-full bg-primary/20 dark:bg-primary/30',
|
|
thumb: 'rounded-full bg-background ring-2 ring-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:ring-primary',
|
|
},
|
|
},
|
|
|
|
// CheckboxGroup: Estilo outline
|
|
checkboxGroup: {
|
|
slots: {
|
|
root: 'relative',
|
|
fieldset: 'flex gap-x-2',
|
|
legend: 'mb-1 block font-medium text-default dark:font-mono',
|
|
item: 'border border-primary/30 dark:border-primary/50 px-3 py-2 rounded-md has-data-[state=checked]:border-primary dark:has-data-[state=checked]:border-primary',
|
|
},
|
|
},
|
|
|
|
// Button: Estilo outline
|
|
button: {
|
|
slots: {
|
|
base: 'border border-primary/50 dark:border-primary dark:font-mono',
|
|
},
|
|
variants: {
|
|
variant: {
|
|
outline: {
|
|
base: 'bg-transparent border-2 border-primary text-primary hover:bg-primary/10 dark:hover:bg-primary/20',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
|
|
// Card: Solo outlines
|
|
card: {
|
|
slots: {
|
|
root: 'bg-transparent border border-primary/30 dark:border-primary/50 rounded-lg',
|
|
header: 'border-b border-primary/30 dark:border-primary/50 px-4 py-3',
|
|
body: 'px-4 py-3',
|
|
},
|
|
},
|
|
|
|
// Input: Outlines con focus
|
|
input: {
|
|
slots: {
|
|
root: 'bg-transparent border border-primary/50 dark:border-primary focus:ring-2 focus:ring-primary dark:font-mono',
|
|
},
|
|
},
|
|
|
|
// Notifications (Toast): Estilo outline con los colores de la app
|
|
notification: {
|
|
slots: {
|
|
root: 'bg-transparent border-2 border-primary/50 dark:border-primary backdrop-blur-sm',
|
|
wrapper: 'w-full',
|
|
title: 'text-foreground font-semibold dark:font-mono dark:text-shadow',
|
|
description: 'text-foreground/80 dark:font-mono dark:font-light',
|
|
icon: 'shrink-0',
|
|
avatar: 'shrink-0',
|
|
actions: 'flex gap-1.5 shrink-0',
|
|
close: 'shrink-0',
|
|
progress: 'absolute inset-x-0 bottom-0 h-1 z-10',
|
|
},
|
|
variants: {
|
|
color: {
|
|
primary: {
|
|
root: 'dark:shadow-[0_0_12px_rgba(0,255,0,0.3)]',
|
|
progress: 'bg-primary',
|
|
},
|
|
success: {
|
|
root: 'border-green-500/50 dark:border-green-500 dark:shadow-[0_0_12px_rgba(0,255,0,0.3)]',
|
|
progress: 'bg-green-500',
|
|
},
|
|
error: {
|
|
root: 'border-red-500/50 dark:border-red-500 dark:shadow-[0_0_12px_rgba(255,0,0,0.3)]',
|
|
progress: 'bg-red-500',
|
|
},
|
|
warning: {
|
|
root: 'border-yellow-500/50 dark:border-yellow-500 dark:shadow-[0_0_12px_rgba(255,255,0,0.3)]',
|
|
progress: 'bg-yellow-500',
|
|
},
|
|
info: {
|
|
root: 'border-blue-500/50 dark:border-blue-500 dark:shadow-[0_0_12px_rgba(0,150,255,0.3)]',
|
|
progress: 'bg-blue-500',
|
|
},
|
|
neutral: {
|
|
root: 'dark:shadow-[0_0_12px_rgba(100,100,100,0.3)]',
|
|
progress: 'bg-gray-500',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
},
|
|
})
|