style: reskin NovaSpark en las 7 apps

Del look editorial (verde #1B4332, esquinas a 0, botones en mayusculas)
al sistema NovaSpark: primario azul #2563EB, detalle naranja #F97316,
fondo #F8FAFC con tarjetas blancas rounded-xl + shadow-sm, chips
rounded-full semanticos, focus ring azul, transiciones 100-200ms.
Incluye headers de tabla en los PDFs (cotizador y estado de cuenta).
This commit is contained in:
2026-09-03 02:35:34 +00:00
parent 89fcd1c579
commit 599dce2629
78 changed files with 842 additions and 828 deletions

View File

@@ -5,8 +5,8 @@ import { EstadoVacio, TituloSeccion } from './comunes'
import { funnelMisLeads, type ResumenMiDia } from '../lib/mi-tablero'
import { fetchResumenMiDia } from '../services/mi-dia'
// Misma paleta del funnel del tablero general
const COLORES_FUNNEL = ['#a3a3a3', '#737373', '#52796f', '#1B4332']
// Misma paleta del funnel del tablero general (NovaSpark: azules + neutros)
const COLORES_FUNNEL = ['#94A3B8', '#64748B', '#3B82F6', '#2563EB']
/**
* "Mi tablero": KPIs personales del vendedor logueado (mis leads, actividades,
@@ -40,10 +40,10 @@ export default function MiTablero() {
<main className="mx-auto max-w-6xl px-4 py-8">
<div className="mb-8 flex items-end justify-between">
<div>
<p className="text-xs font-bold uppercase tracking-widest text-accent">FRASA Desarrollos</p>
<h1 className="mt-2 text-3xl font-light text-neutral-900">Mi tablero</h1>
<p className="text-xs font-semibold uppercase tracking-wider text-accent">FRASA Desarrollos</p>
<h1 className="mt-2 text-3xl font-light text-[#111827]">Mi tablero</h1>
{resumen && (
<p className="mt-1 text-xs text-neutral-400">
<p className="mt-1 text-xs text-[#64748B]">
Actualizado: {new Date(resumen.generadoEn).toLocaleString('es-MX')}
</p>
)}
@@ -52,20 +52,20 @@ export default function MiTablero() {
type="button"
onClick={() => void cargar()}
disabled={cargando}
className="border border-accent px-5 py-2 text-xs font-bold uppercase tracking-widest text-accent transition-colors duration-150 hover:bg-accent hover:text-white disabled:opacity-50"
className="rounded-lg border border-[#D1D5DB] bg-white px-5 py-2 text-xs font-medium text-accent shadow-sm transition-all duration-100 ease-out hover:bg-blue-50 disabled:opacity-50"
>
{cargando ? 'Actualizando…' : 'Actualizar'}
</button>
</div>
{error && (
<p role="alert" className="mb-8 border border-amber-700 px-4 py-3 text-xs font-bold uppercase tracking-widest text-amber-700">
<p role="alert" className="mb-8 rounded-lg bg-amber-50 px-4 py-3 text-xs font-medium text-amber-700">
Sin datos del API — {error}
</p>
)}
{resumen?.sinMapeoMonday && (
<p className="mb-8 border border-amber-700 px-4 py-3 text-xs font-bold uppercase tracking-widest text-amber-700">
<p className="mb-8 rounded-lg bg-amber-50 px-4 py-3 text-xs font-medium text-amber-700">
Tu usuario aún no está ligado a Monday: las listas personales aparecen vacías
</p>
)}