feat(ui): make dashboard responsive for iPhone and mobile devices
- Add Sheet primitive component for mobile drawers - Add MobileNav with hamburger menu for dashboard layout - Hide desktop sidebars on mobile; show mobile header - Make dashboard header responsive with stacked layout on small screens - Hide selector text on mobile, show icons only - Convert fixed-width filters to responsive widths (CFDI, Clientes, Admin, Documentos, Alertas) - Cap dialog widths to 95vw on mobile (CFDI viewer, Documentos, Reportes, Contribuyentes, Facturación) - Make calendar grid smaller and use single-letter weekdays on mobile - Update viewport to include viewport-fit=cover for Samsung safe areas
This commit is contained in:
@@ -205,9 +205,9 @@ export default function ClientesPage() {
|
||||
<Calendar className="h-5 w-5 text-muted-foreground" />
|
||||
<div className="flex items-center gap-2 text-sm">
|
||||
<span className="text-muted-foreground">Periodo:</span>
|
||||
<Input type="date" value={from} onChange={(e) => setFrom(e.target.value)} className="w-[150px]" />
|
||||
<Input type="date" value={from} onChange={(e) => setFrom(e.target.value)} className="w-full sm:w-[150px]" />
|
||||
<span className="text-muted-foreground">a</span>
|
||||
<Input type="date" value={to} onChange={(e) => setTo(e.target.value)} className="w-[150px]" />
|
||||
<Input type="date" value={to} onChange={(e) => setTo(e.target.value)} className="w-full sm:w-[150px]" />
|
||||
</div>
|
||||
</div>
|
||||
<Button onClick={() => setShowForm(true)}>
|
||||
@@ -369,7 +369,7 @@ export default function ClientesPage() {
|
||||
onClick={() => setUsuariosTenantId(null)}
|
||||
>
|
||||
<div
|
||||
className="bg-background rounded-lg max-w-2xl w-full max-h-[80vh] overflow-y-auto"
|
||||
className="bg-background rounded-lg max-w-[95vw] md:max-w-2xl w-full max-h-[80vh] overflow-y-auto"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
<div className="p-6 border-b flex items-center justify-between">
|
||||
|
||||
Reference in New Issue
Block a user