Drommo
Componente · Sidebars

Sidebar Administración Empresarial Azul

Prompt

Crea una sidebar «Administración Empresarial Azul» lista para producción usando React, Next.js, TypeScript, Tailwind CSS, shadcn/ui Sidebar, Framer Motion e iconos Lucide. Usa un layout minimal al lado izquierdo para un producto admin, con color principal #38bdf8, secundario #818cf8 y fondo #071325. Incluye marca, selector de workspace, búsqueda, navegación agrupada, ruta activa, elementos anidados colapsables, badges, favoritos, menú de usuario y acción de footer. Soporta expandido, colapsado solo iconos, expansión hover, carga, vacío, permisos y drawer móvil. Persiste la preferencia de escritorio sin hydration mismatch. Añade landmarks nav, tooltips en modo icono, aria-expanded/controls, teclado, Escape, focus trap/restauración, objetivos de 44px y contraste WCAG AA. Evita controles anidados inválidos. Anima transform/opacity, respeta movimiento reducido y evita saltos de contenido. Devuelve datos tipados, componentes reutilizables, integración de layout, dependencias y pruebas.

Tipo
Componente · Sidebars
Tecnología
React, Next.js, TypeScript, Tailwind CSS
  • Sidebar
  • admin
  • minimal
  • left
  • Collapsible
Crear en Drommo

«Crear en Drommo» abre un chat en el modo correcto con el prompt ya escrito. No se envía hasta que tú lo mandes.

Ideas parecidas