consultoria-as/FRASA-CAS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: reskin NovaSpark en las 7 apps

Browse Source 
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:
Consult AS Technology
2026-09-03 02:35:34 +00:00
parent 89fcd1c579
commit 599dce2629
78 changed files with 842 additions and 828 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
apps/agente-ia/src/pages/ChatPage.tsx
View File

@@ -69,17 +69,18 @@ export default function ChatPage() {
}
return (
<div className="flex min-h-screen flex-col bg-white text-neutral-900">
<header className="border-b border-neutral-200">
<div className="flex min-h-screen flex-col bg-[#F8FAFC] text-[#111827]">
<header className="border-b border-[#E5E7EB] bg-white">
<div className="mx-auto flex w-full max-w-3xl items-center justify-between px-4 py-4">
<span className="text-sm tracking-widest">
<span className="font-bold">FRASA</span>{' '}
<span className="font-light text-neutral-500">ASISTENTE IA</span>
<span className="text-sm tracking-wide">
<span className="font-bold">FRASA</span>
<span className="text-[#F97316]"> · </span>
<span className="font-light text-[#64748B]">ASISTENTE IA</span>
</span>
<button
type="button"
onClick={nuevaConversacion}
className="border border-accent px-5 py-2.5 text-xs font-bold uppercase tracking-widest text-accent transition-colors duration-150 hover:bg-accent hover:text-white"
className="rounded-lg border border-[#D1D5DB] bg-white px-5 py-2.5 text-xs font-medium text-[#374151] shadow-sm transition-all duration-100 ease-out hover:bg-[#F9FAFB]"
>
Nueva conversación
</button>
@@ -88,19 +89,23 @@ export default function ChatPage() {
<main className="mx-auto flex w-full max-w-3xl flex-1 flex-col px-4 py-8">
{sinConexion && (
<p className="mb-6 text-xs text-amber-700">
<p className="mb-6 rounded-lg bg-amber-50 px-4 py-3 text-xs font-medium text-amber-700">
Sin conexión al API del asistente. Revisa que el servicio esté disponible e inténtalo de
nuevo.
</p>
)}
{error && <p className="mb-6 text-xs text-red-700">{error}</p>}
{error && (
<p className="mb-6 rounded-lg bg-red-50 px-4 py-3 text-xs font-medium text-red-700">
{error}
</p>
)}
{mensajes.length === 0 && !escribiendo ? (
<div className="flex flex-1 flex-col items-center justify-center gap-4 text-center">
<p className="text-xs font-bold uppercase tracking-widest text-neutral-500">
<p className="text-xs font-semibold uppercase tracking-wider text-[#64748B]">
Asistente interno
</p>
<p className="max-w-md text-2xl font-light text-neutral-900">
<p className="max-w-md text-2xl font-light text-[#111827]">
Pregunta sobre el catálogo DIAGONAL, las propuestas del cotizador, el proceso de venta
o las políticas de Frasa.
</p>
@@ -112,7 +117,7 @@ export default function ChatPage() {
))}
{escribiendo && (
<div className="flex justify-start">
<p className="bg-neutral-100 px-4 py-3 text-xs font-bold uppercase tracking-widest text-neutral-500">
<p className="rounded-full bg-white px-4 py-2 text-xs font-medium text-[#64748B] shadow-sm">
Escribiendo…
</p>
</div>
@@ -122,7 +127,7 @@ export default function ChatPage() {
)}
</main>
<footer className="border-t border-neutral-200">
<footer className="border-t border-[#E5E7EB] bg-white">
<form
className="mx-auto flex w-full max-w-3xl items-stretch gap-4 px-4 py-4"
onSubmit={(e) => {
@@ -140,12 +145,12 @@ export default function ChatPage() {
onChange={(e) => setEntrada(e.target.value)}
placeholder="Escribe tu pregunta…"
autoComplete="off"
className="flex-1 border border-neutral-300 px-4 py-3 text-sm placeholder:text-neutral-400"
className="flex-1 rounded-lg border border-[#D1D5DB] bg-white px-4 py-3 text-sm placeholder:text-[#94A3B8] transition-colors focus:border-accent focus:outline-none focus:ring-2 focus:ring-accent/20"
/>
<button
type="submit"
disabled={escribiendo || entrada.trim().length === 0}
className="bg-accent px-6 py-3 text-xs font-bold uppercase tracking-widest text-white transition-opacity duration-150 hover:opacity-90 disabled:opacity-40"
className="rounded-lg bg-accent px-6 py-3 text-sm font-medium text-white shadow-sm transition-all duration-100 ease-out hover:bg-accent-hover disabled:opacity-40"
>
Enviar
</button>