feat(agenda): importa cor do evento Google + UI do modal pequeno

- agendamentos.cor (TEXT); import grava cor do evento (colorId/agenda)
- frontend usa ag.cor (prioridade: status > cor própria > cor do dentista)
- StackModal: remove backdrop-blur (vidro); mobile vira bottom-sheet de altura auto, desktop painel pequeno com max-w; botão maximizar visível no mobile; padding responsivo

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
VPS 4 Builder
2026-06-09 18:26:17 +02:00
parent 1cfd184886
commit c54532d5ea
3 changed files with 17 additions and 9 deletions
+7 -5
View File
@@ -38,10 +38,12 @@ export const StackModal: React.FC<{ isOpen: boolean; onClose: () => void; root:
const canBack = stack.length > 1;
return (
<div className="fixed inset-0 bg-black/60 z-[70] flex items-end sm:items-center justify-center backdrop-blur-sm sm:p-4">
<div className="fixed inset-0 bg-black/40 z-[70] flex items-end sm:items-center justify-center sm:p-4">
<div
className={`bg-white shadow-2xl flex flex-col overflow-hidden transition-all duration-300 w-full h-dvh rounded-none ${
fullscreen ? 'sm:w-screen sm:h-dvh sm:rounded-none' : 'sm:w-[460px] sm:h-auto sm:max-h-[88vh] sm:rounded-3xl'
className={`bg-white shadow-2xl flex flex-col overflow-hidden transition-all duration-300 w-full ${
fullscreen
? 'h-dvh max-h-none rounded-none sm:w-screen'
: 'max-h-[90vh] rounded-t-2xl sm:w-[440px] sm:max-w-[95vw] sm:h-auto sm:max-h-[88vh] sm:rounded-3xl'
}`}
>
<div className="flex items-center gap-2 px-4 py-3 border-b border-gray-100 shrink-0">
@@ -55,7 +57,7 @@ export const StackModal: React.FC<{ isOpen: boolean; onClose: () => void; root:
<h3 className="font-black text-sm uppercase text-gray-800 truncate flex-1">{current.title}</h3>
<button
onClick={() => setFullscreen(f => !f)}
className="hidden sm:inline-flex p-1.5 hover:bg-gray-100 rounded-lg text-gray-400 transition-colors"
className="inline-flex p-1.5 hover:bg-gray-100 rounded-lg text-gray-400 transition-colors"
title={fullscreen ? 'Restaurar' : 'Tela cheia'}
>
{fullscreen ? <Minimize2 size={16} /> : <Maximize2 size={16} />}
@@ -67,7 +69,7 @@ export const StackModal: React.FC<{ isOpen: boolean; onClose: () => void; root:
<div className="flex-1 overflow-y-auto custom-scrollbar">
<Ctx.Provider value={{ push, pop, close }}>
<div key={stack.length} className="animate-in slide-in-from-right-4 fade-in duration-200 p-5">
<div key={stack.length} className="animate-in slide-in-from-right-4 fade-in duration-200 p-4 sm:p-5">
{current.render()}
</div>
</Ctx.Provider>