Consult AS Technology
dc6ec786d0
- 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
32 lines
1.2 KiB
TypeScript
32 lines
1.2 KiB
TypeScript
import type { ReactNode } from 'react'
|
|
import DarkModeToggle from './DarkModeToggle'
|
|
|
|
interface Props {
|
|
titulo: string
|
|
acciones?: ReactNode
|
|
}
|
|
|
|
/** Barra superior de la app: marca a la izquierda, acciones a la derecha */
|
|
export default function AppHeader({ titulo, acciones }: Props) {
|
|
return (
|
|
<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="flex min-h-14 flex-wrap items-center gap-x-3 gap-y-2 px-4 py-2 sm:px-6 lg:px-8">
|
|
<a
|
|
href="/"
|
|
className="rounded-lg px-2 py-1.5 text-xs font-medium text-[#64748B] dark:text-[#94A3B8] transition-all duration-100 ease-out hover:bg-[#F9FAFB] hover:text-[#111827] dark:text-[#E2E8F0]"
|
|
>
|
|
← Menú
|
|
</a>
|
|
<span className="text-sm font-bold tracking-widest text-[#111827] dark:text-[#E2E8F0]">
|
|
FRASA<span className="text-[#F97316]">.</span>
|
|
</span>
|
|
<h1 className="text-xl font-semibold text-[#111827] dark:text-[#E2E8F0]">{titulo}</h1>
|
|
<div className="ml-auto flex items-center gap-3">
|
|
<DarkModeToggle />
|
|
{acciones}
|
|
</div>
|
|
</div>
|
|
</header>
|
|
)
|
|
}
|