fix(responsive): layout 100% width en todas las resoluciones

- Eliminado max-w-[1280px] de todas las apps (mi-dia, landing, cotizador, cobranza, dashboards, alta-clientes)
- Kanban: sin restricción de ancho, columnas min-w-[220px]
- Grids: xl:grid-cols-4/5 para pantallas grandes
- CSS base: -webkit-text-size-adjust + min-h-screen
- 6 apps construidas
This commit is contained in:
2026-09-08 08:36:53 +00:00
parent 52429c9f14
commit dc6ec786d0
22 changed files with 59 additions and 41 deletions

View File

@@ -43,7 +43,7 @@ export default function MiTablero({ alCambiarAcciones }: { alCambiarAcciones: (a
const funnel = resumen ? funnelMisLeads(resumen.misLeads) : []
return (
<main className="mx-auto max-w-[1280px] px-4 py-8 sm:px-6">
<main className="px-4 py-8 sm:px-6 lg:px-8">
<div className="mb-8">
<h1 className="text-xl font-semibold text-[#111827] dark:text-[#E2E8F0]">Mi tablero</h1>
{resumen && (
@@ -70,7 +70,7 @@ export default function MiTablero({ alCambiarAcciones }: { alCambiarAcciones: (a
{resumen && (
<>
<section aria-label="Mis indicadores" className="grid gap-4 grid-cols-2 lg:grid-cols-4">
<section aria-label="Mis indicadores" className="grid gap-4 grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5">
<KpiCard
titulo="Mis leads activos"
valor={resumen.misLeads.length}

View File

@@ -88,7 +88,7 @@ export default function TableroGeneral({
const sinCobranza = resumen !== null && resumen.cobranza.planesAlCorriente + resumen.cobranza.planesConVencidos === 0
return (
<main className="mx-auto max-w-[1280px] px-4 py-8 sm:px-6">
<main className="px-4 py-8 sm:px-6 lg:px-8">
<div className="mb-8">
<h1 className="text-xl font-semibold text-[#111827] dark:text-[#E2E8F0]">Tablero comercial</h1>
{resumen && (
@@ -109,7 +109,7 @@ export default function TableroGeneral({
{resumen && (
<>
<section aria-label="Indicadores clave" className="grid gap-4 grid-cols-2 lg:grid-cols-4">
<section aria-label="Indicadores clave" className="grid gap-4 grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5">
<KpiCard
titulo="Leads totales"
valor={resumen.leads.total}

View File

@@ -24,8 +24,11 @@
}
@layer base {
html {
-webkit-text-size-adjust: 100%;
}
body {
@apply bg-[#F8FAFC] text-[#111827] antialiased;
@apply min-h-screen bg-[#F8FAFC] text-[#111827] antialiased;
}
*:focus-visible {

View File

@@ -47,7 +47,7 @@ export default function DashboardPage() {
<div>
<BannerModoLocal />
<header className="sticky top-0 z-10 border-b border-[#E5E7EB] bg-white/95 backdrop-blur dark:border-[#1E293B] dark:bg-[#1E293B]/95">
<div className="mx-auto flex min-h-14 max-w-[1280px] flex-wrap items-center justify-between gap-x-4 gap-y-2 px-4 py-2 sm:px-6">
<div className="flex min-h-14 flex-wrap items-center justify-between gap-x-4 gap-y-2 px-4 py-2 sm:px-6 lg:px-8">
<div className="flex items-center gap-2.5">
<a
href="/"
@@ -100,7 +100,7 @@ export default function DashboardPage() {
</div>
</header>
{vista === null ? (
<main className="mx-auto max-w-[1280px] px-4 py-16 sm:px-6">
<main className="px-4 py-16 sm:px-6 lg:px-8">
<p className="text-sm text-[#64748B] dark:text-[#94A3B8]">Tu rol no tiene tableros asignados por ahora.</p>
</main>
) : vista === 'mia' ? (