Ajuste na Responsividade da pagina de Medico

This commit is contained in:
GagoDuBroca 2025-11-11 11:02:45 -03:00
parent 329300395a
commit 62d54711ec

View File

@ -7,7 +7,7 @@ import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import DoctorLayout from "@/components/doctor-layout";
import DoctorLayout from "@/components/doctor-layout"; // Supondo que DoctorLayout é onde a sidebar está
import { AvailabilityService } from "@/services/availabilityApi.mjs";
import { usersService } from "@/services/usersApi.mjs";
@ -323,8 +323,15 @@ export default function AvailabilityPage() {
};
return (
// Alteração aqui: Adicione classes para garantir que o DoctorLayout permita a rolagem correta
// Você precisará ajustar o componente DoctorLayout para ter a sidebar fixa e o conteúdo principal rolável.
// Exemplo de estrutura para DoctorLayout:
// <div className="flex h-screen overflow-hidden">
// <aside className="w-64 fixed inset-y-0 z-50 overflow-y-auto border-r bg-white">...</aside> // Sidebar
// <main className="flex-1 overflow-y-auto lg:ml-64">...</main> // Conteúdo principal
// </div>
<DoctorLayout>
<div className="space-y-6">
<div className="space-y-6 flex-1 overflow-y-auto p-6"> {/* Adicionado flex-1 overflow-y-auto e p-6 */}
<div className="flex items-center justify-between">
<div>
<h1 className="text-2xl font-bold text-gray-900">Definir Disponibilidade</h1>
@ -416,11 +423,12 @@ export default function AvailabilityPage() {
{/* **AJUSTE DE RESPONSIVIDADE: BOTÕES DE AÇÃO** */}
{/* Alinha à direita em telas maiores e empilha (com o botão primário no final) em telas menores */}
{/* Alteração aqui: Adicionado w-full aos Links e Buttons para ocuparem a largura total em telas pequenas */}
<div className="flex flex-col-reverse sm:flex-row sm:justify-between gap-4">
<Link href="/doctor/disponibilidade/excecoes" className="w-full sm:w-auto">
<Button variant="default" className="w-full sm:w-auto">Adicionar Exceção</Button>
</Link>
<div className="flex gap-4 w-full sm:w-auto">
<div className="flex flex-col sm:flex-row gap-4 w-full sm:w-auto"> {/* Ajustado para empilhar os botões Cancelar e Salvar em telas pequenas */}
<Link href="/doctor/dashboard" className="w-full sm:w-auto">
<Button variant="outline" className="w-full sm:w-auto">Cancelar</Button>
</Link>
@ -505,7 +513,6 @@ export default function AvailabilityPage() {
onClose={handleCloseModal}
onSubmit={handleEdit}
/>
</DoctorLayout>
);
}