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

fix(tabbar): hacer barra de pestañas compacta y scrollable

Browse Source 
- Nombres de tabs acortados: Leads, Oportunidades, Apartados, Escrituración, Tablero
- Barra scrollable en móvil (overflow-x-auto)
- Botones Exportar y Kanban más compactos (px-2 py-1 text-[11px])
- Sin wrap: todo en una fila con scroll horizontal
This commit is contained in:
Consult AS Technology
2026-09-08 09:15:55 +00:00
parent 8f39b7178c
commit 350455ddba
1 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
apps/mi-dia/src/pages/MiDiaPage.tsx
View File

@@ -520,14 +520,14 @@ function TabsCrm({
onExportar?: () => void
}) {
const tabs: { id: TabCrm; titulo: string }[] = [
{ id: 'leads', titulo: 'Mis leads' },
{ id: 'oportunidades', titulo: 'Mis oportunidades' },
{ id: 'apartados', titulo: 'Mis apartados' },
{ id: 'leads', titulo: 'Leads' },
{ id: 'oportunidades', titulo: 'Oportunidades' },
{ id: 'apartados', titulo: 'Apartados' },
{ id: 'escrituracion', titulo: 'Escrituración' },
{ id: 'tablero', titulo: 'Mi tablero' },
{ id: 'tablero', titulo: 'Tablero' },
]
return (
<div className="mb-4 flex flex-wrap gap-1 rounded-xl border border-[#E5E7EB] bg-white p-1 dark:border-[#1E293B] dark:bg-[#1E293B] shadow-sm md:flex-nowrap md:gap-2" role="tablist">
<div className="mb-4 flex items-center gap-1 overflow-x-auto rounded-xl border border-[#E5E7EB] bg-white p-1 dark:border-[#1E293B] dark:bg-[#1E293B] shadow-sm" role="tablist">
{tabs.map((tab) => {
const activo = tab.id === activa
return (
@@ -556,7 +556,7 @@ function TabsCrm({
<button
type="button"
onClick={onExportar}
className="rounded-lg border border-[#D1D5DB] bg-white px-3 py-1.5 text-xs font-medium text-[#374151] shadow-sm transition-all hover:bg-[#F9FAFB] dark:border-[#334155] dark:bg-[#0F172A] dark:text-[#CBD5E1] dark:hover:bg-[#1E293B]"
className="shrink-0 rounded-lg border border-[#D1D5DB] bg-white px-2 py-1 text-[11px] font-medium text-[#374151] shadow-sm transition-all hover:bg-[#F9FAFB] dark:border-[#334155] dark:bg-[#0F172A] dark:text-[#CBD5E1] dark:hover:bg-[#1E293B]"
>
📥 Exportar
</button>
@@ -564,9 +564,9 @@ function TabsCrm({
<button
type="button"
onClick={onToggleKanban}
className="rounded-lg border border-[#D1D5DB] bg-white px-3 py-1.5 text-xs font-medium text-[#374151] shadow-sm transition-all hover:bg-[#F9FAFB] dark:border-[#334155] dark:bg-[#0F172A] dark:text-[#CBD5E1] dark:hover:bg-[#1E293B]"
className="shrink-0 rounded-lg border border-[#D1D5DB] bg-white px-2 py-1 text-[11px] font-medium text-[#374151] shadow-sm transition-all hover:bg-[#F9FAFB] dark:border-[#334155] dark:bg-[#0F172A] dark:text-[#CBD5E1] dark:hover:bg-[#1E293B]"
>
{vistaKanban ? '📋 Lista' : '📊 Kanban'}
{vistaKanban ? 'Lista' : 'Kanban'}
</button>
</div>
)}