diff --git a/resources/views/chat-publico.blade.php b/resources/views/chat-publico.blade.php index b5127ff..d1efcd2 100755 --- a/resources/views/chat-publico.blade.php +++ b/resources/views/chat-publico.blade.php @@ -21,47 +21,41 @@ overscroll-behavior: none; } - /* Móvil: pantalla completa */ + /* Móvil: body como lienzo neutro */ body { background: #111b21; - height: 100vh; - height: 100dvh; - height: -webkit-fill-available; overflow: hidden; } - /* Desktop: fondo con gradiente + chat centrado como frame */ - @media (min-width: 640px) { - body { - background: #0d1117; - display: flex; - align-items: center; - justify-content: center; - overflow: hidden; - } - } - - /* El contenedor del chat */ + /* #chat-root ocupa todo el viewport visible con position:fixed + — esto es la única forma 100% fiable en Android Chrome + (100dvh falla cuando la barra de URL aparece/desaparece) */ #chat-root { - width: 100%; - height: 100vh; - height: 100dvh; - height: -webkit-fill-available; + position: fixed; + inset: 0; display: flex; flex-direction: column; background: #111b21; overflow: hidden; } + /* Desktop: card centrada */ @media (min-width: 640px) { + body { + background: #0d1117; + display: flex; + align-items: center; + justify-content: center; + height: 100vh; + } #chat-root { + position: relative; + inset: auto; width: 420px; - height: 90vh; height: 90dvh; max-height: 820px; border-radius: 20px; box-shadow: 0 24px 64px rgba(0,0,0,.6); - overflow: hidden; } } @@ -110,7 +104,6 @@ var newMsgCount = 0; var lastCount = 0; var observer = null; - var vpInited = false; function checkBottom() { if (!msgsEl) return true; @@ -175,32 +168,16 @@ scrollBottom(); } - /* Ajustar altura al teclado virtual (una sola vez) */ - function initViewport() { - if (vpInited || !window.visualViewport) return; - vpInited = true; - var root = document.getElementById('chat-root'); - if (!root) return; - function update() { - if (window.innerWidth < 640) { - root.style.height = window.visualViewport.height + 'px'; - } - } - window.visualViewport.addEventListener('resize', update); - update(); - } - /* Bajar al fondo cuando el componente emite scroll-chat */ window.addEventListener('scroll-chat', function () { isAtBottom = true; newMsgCount = 0; updateBadge(); scrollBottom(); }); - document.addEventListener('DOMContentLoaded', function () { init(); initViewport(); }); + document.addEventListener('DOMContentLoaded', function () { init(); }); /* livewire:load: Livewire terminó de arrancar — re-init por si el DOM cambió */ document.addEventListener('livewire:load', function () { init(); - initViewport(); /* Usar hook oficial para scroll después de cada update */ Livewire.hook('message.processed', function () { if (isAtBottom) scrollBottom();