fix: fix hovers in patient

This commit is contained in:
M-Gabrielly 2025-12-03 22:34:51 -03:00
parent ead38e1132
commit a83dc5e347
3 changed files with 23 additions and 23 deletions

View File

@ -1762,7 +1762,7 @@ export default function PacientePage() {
</div> </div>
{/* Grid de 3 colunas (2 + 1) */} {/* Grid de 3 colunas (2 + 1) */}
<div className="grid grid-cols-1 md:grid-cols-1 lg:grid-cols-3 gap-4 sm:gap-5 md:gap-6"> <div className="grid grid-cols-1 lg:grid-cols-3 gap-4 sm:gap-5 md:gap-6">
{/* Coluna Esquerda - Informações Pessoais */} {/* Coluna Esquerda - Informações Pessoais */}
<div className="lg:col-span-2 space-y-4 sm:space-y-5 md:space-y-6"> <div className="lg:col-span-2 space-y-4 sm:space-y-5 md:space-y-6">
{/* Informações Pessoais */} {/* Informações Pessoais */}
@ -1925,35 +1925,35 @@ export default function PacientePage() {
<ProtectedRoute requiredUserType={["paciente"]}> <ProtectedRoute requiredUserType={["paciente"]}>
<div className="container mx-auto px-2 sm:px-4 py-6 sm:py-8"> <div className="container mx-auto px-2 sm:px-4 py-6 sm:py-8">
{/* Header com informações do paciente */} {/* Header com informações do paciente */}
<header className="sticky top-0 z-40 bg-card shadow-md rounded-lg border border-border p-3 sm:p-4 md:p-4 mb-4 sm:mb-6 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3 sm:gap-4"> <header className="sticky top-0 z-40 bg-card shadow-md rounded-lg border border-border p-2 sm:p-3 md:p-4 mb-4 sm:mb-6 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between sm:gap-4">
<div className="flex items-center gap-2 sm:gap-4"> <div className="flex items-center gap-2 sm:gap-3 min-w-0 flex-1">
{/* Logo MEDIConnect */} {/* Logo MEDIConnect */}
<div className="flex items-center gap-2 mr-2 sm:mr-4"> <div className="flex items-center gap-2 mr-2 sm:mr-3 shrink-0">
<div className="w-8 h-8 sm:w-10 sm:h-10 bg-primary rounded-lg flex items-center justify-center shrink-0"> <div className="w-8 h-8 sm:w-9 sm:h-9 bg-primary rounded-lg flex items-center justify-center">
<Stethoscope className="w-4 h-4 sm:w-5 sm:h-5 text-primary-foreground" /> <Stethoscope className="w-4 h-4 sm:w-5 sm:h-5 text-primary-foreground" />
</div> </div>
<span className="text-base sm:text-lg font-semibold text-foreground hidden sm:inline"> <span className="text-base sm:text-sm font-semibold text-foreground hidden sm:inline">
MEDIConnect MEDIConnect
</span> </span>
</div> </div>
<div className="h-8 w-px bg-border hidden sm:block"></div> <div className="h-6 w-px bg-border hidden sm:block"></div>
<Avatar className="h-10 w-10 sm:h-12 sm:w-12 md:h-12 md:w-12"> <Avatar className="h-10 w-10 sm:h-10 sm:w-10 shrink-0">
<AvatarImage src={profileData.foto_url} alt={profileData.nome || 'Avatar'} /> <AvatarImage src={profileData.foto_url} alt={profileData.nome || 'Avatar'} />
<AvatarFallback className="bg-primary text-white font-bold text-sm sm:text-base">{profileData.nome?.charAt(0) || 'P'}</AvatarFallback> <AvatarFallback className="bg-primary text-white font-bold text-xs sm:text-sm">{profileData.nome?.charAt(0) || 'P'}</AvatarFallback>
</Avatar> </Avatar>
<div className="flex flex-col min-w-0"> <div className="flex flex-col min-w-0 flex-1">
<span className="text-xs sm:text-sm md:text-sm text-muted-foreground">Conta do paciente</span> <span className="text-xs text-muted-foreground truncate">Conta do paciente</span>
<span className="font-bold text-sm sm:text-base md:text-lg leading-none">{profileData.nome || 'Paciente'}</span> <span className="font-bold text-xs sm:text-sm leading-tight truncate">{profileData.nome || 'Paciente'}</span>
<span className="text-xs sm:text-sm md:text-sm text-muted-foreground truncate">{profileData.email || 'Email não disponível'}</span> <span className="text-xs text-muted-foreground truncate">{profileData.email || 'Email não disponível'}</span>
</div> </div>
</div> </div>
<div className="flex items-center gap-2 sm:gap-3 w-full sm:w-auto"> <div className="flex items-center gap-2 w-full sm:w-auto shrink-0">
<SimpleThemeToggle /> <SimpleThemeToggle />
<Button asChild variant="outline" className="hover:bg-primary! hover:text-white! hover:border-primary! transition-colors flex-1 sm:flex-none text-xs sm:text-sm"> <Button asChild variant="outline" className="hover:bg-blue-500 hover:text-white transition-colors flex-1 sm:flex-none text-xs sm:text-sm py-1.5 sm:py-2 h-8 sm:h-9 px-2 sm:px-3">
<Link href="/"> <Link href="/">
<Home className="h-3 w-3 sm:h-4 sm:w-4 mr-1" /> Início <Home className="h-3 w-3 sm:h-4 sm:w-4" /> <span className="hidden sm:inline ml-1">Início</span>
</Link> </Link>
</Button> </Button>
<Button <Button
@ -1961,9 +1961,9 @@ export default function PacientePage() {
variant="outline" variant="outline"
aria-label={strings.sair} aria-label={strings.sair}
disabled={loading} disabled={loading}
className="text-destructive border-destructive hover:bg-destructive! hover:text-white! hover:border-destructive! transition-colors" className="text-destructive border-destructive hover:bg-destructive/20 hover:text-destructive transition-colors text-xs sm:text-sm py-1.5 sm:py-2 h-8 sm:h-9 px-2 sm:px-3"
> >
<LogOut className="h-4 w-4 mr-1" /> {strings.sair} <LogOut className="h-3 w-3 sm:h-4 sm:w-4" /> <span className="hidden sm:inline ml-1">{strings.sair}</span>
</Button> </Button>
</div> </div>
</header> </header>

View File

@ -1030,11 +1030,11 @@ export default function ResultadosClient() {
</div> </div>
<div className="flex items-center gap-2 w-full sm:w-auto"> <div className="flex items-center gap-2 w-full sm:w-auto">
<Button variant="outline" size="sm" onClick={() => setCurrentPage(1)} disabled={currentPage === 1} className="hover:bg-primary! hover:text-white!">Primeira</Button> <Button variant="outline" size="sm" onClick={() => setCurrentPage(1)} disabled={currentPage === 1} className="hover:bg-blue-500 hover:text-white dark:hover:bg-blue-600 dark:hover:text-white">Primeira</Button>
<Button variant="outline" size="sm" onClick={() => setCurrentPage(p => Math.max(1, p - 1))} disabled={currentPage === 1} className="hover:bg-primary! hover:text-white!">Anterior</Button> <Button variant="outline" size="sm" onClick={() => setCurrentPage(p => Math.max(1, p - 1))} disabled={currentPage === 1} className="hover:bg-blue-500 hover:text-white dark:hover:bg-blue-600 dark:hover:text-white">Anterior</Button>
<span className="text-sm text-muted-foreground">Página {currentPage} de {totalPages}</span> <span className="text-sm text-muted-foreground">Página {currentPage} de {totalPages}</span>
<Button variant="outline" size="sm" onClick={() => setCurrentPage(p => Math.min(totalPages, p + 1))} disabled={currentPage === totalPages} className="hover:bg-primary! hover:text-white!">Próxima</Button> <Button variant="outline" size="sm" onClick={() => setCurrentPage(p => Math.min(totalPages, p + 1))} disabled={currentPage === totalPages} className="hover:bg-blue-500 hover:text-white dark:hover:bg-blue-600 dark:hover:text-white">Próxima</Button>
<Button variant="outline" size="sm" onClick={() => setCurrentPage(totalPages)} disabled={currentPage === totalPages} className="hover:bg-primary! hover:text-white!">Última</Button> <Button variant="outline" size="sm" onClick={() => setCurrentPage(totalPages)} disabled={currentPage === totalPages} className="hover:bg-blue-500 hover:text-white dark:hover:bg-blue-600 dark:hover:text-white">Última</Button>
</div> </div>
</div> </div>
)} )}

View File

@ -14,7 +14,7 @@ const buttonVariants = cva(
destructive: destructive:
"bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
outline: outline:
"border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50", "border bg-background shadow-xs hover:bg-blue-500 hover:text-white dark:bg-input/30 dark:border-input dark:hover:bg-blue-600 dark:hover:text-white",
secondary: secondary:
"bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80", "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
ghost: ghost: