fix(ui): modais responsivos — 96×98 em desktop, tela cheia em mobile
This commit is contained in:
@@ -178,8 +178,8 @@ const AppointmentModal: React.FC<{
|
||||
if (!isOpen) return null;
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
|
||||
<form onSubmit={handleSubmit} className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[90vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
|
||||
<div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
|
||||
<form onSubmit={handleSubmit} className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
|
||||
<div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-orange-50 to-white">
|
||||
<h2 className="text-lg font-bold text-gray-800 flex items-center gap-2 uppercase">
|
||||
<CalendarIcon size={22} className="text-orange-500" /> AGENDAR CONSULTA
|
||||
@@ -457,8 +457,8 @@ export const AgendaView: React.FC = () => {
|
||||
|
||||
{/* Event Details "Popover" (Modal style for real estate) */}
|
||||
{showDetails && selectedAppointment && (
|
||||
<div className="fixed inset-0 bg-black/40 z-[70] flex items-center justify-center backdrop-blur-sm p-4 animate-in fade-in duration-200">
|
||||
<div className="bg-white rounded-[2rem] shadow-2xl w-full max-w-lg overflow-hidden border border-gray-100">
|
||||
<div className="fixed inset-0 bg-black/40 z-[70] flex items-center justify-center backdrop-blur-sm p-0 animate-in fade-in duration-200">
|
||||
<div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-[2rem] flex flex-col overflow-hidden border border-gray-100">
|
||||
{/* Header with quick actions */}
|
||||
<div className="px-8 py-6 border-b border-gray-50 flex justify-between items-center bg-gray-50/30">
|
||||
<div className="flex gap-2">
|
||||
|
||||
Reference in New Issue
Block a user