fix: panel in document-flow slot so it pushes hero down when open

This commit is contained in:
Oliver
2026-06-06 17:35:08 -03:00
parent 456ce96eb6
commit bdb830c28d
+15 -10
View File
@@ -971,6 +971,15 @@
} }
/* ── Chat ──────────────────────────────────────────────── */ /* ── Chat ──────────────────────────────────────────────── */
/* Slot sits in document flow — zero height when closed */
#chat-panel-slot {
display: none;
padding-top: 8px;
padding-bottom: 6px;
}
#chat-panel-slot.open {
display: block;
}
.nav-chat-panel { .nav-chat-panel {
width: 340px; width: 340px;
max-width: 100%; max-width: 100%;
@@ -980,14 +989,8 @@
border-radius: 18px; border-radius: 18px;
box-shadow: 0 24px 80px rgba(0,0,0,0.5); box-shadow: 0 24px 80px rgba(0,0,0,0.5);
overflow: hidden; overflow: hidden;
display: none;
flex-direction: column;
z-index: 9999;
margin-top: 66px;
margin-left: 24px;
}
.nav-chat-panel.open {
display: flex; display: flex;
flex-direction: column;
} }
.nav-chat-main { .nav-chat-main {
display: flex; display: flex;
@@ -1140,8 +1143,9 @@
</header> </header>
<!-- ═══════════════════════════════════════════════════════════════ <!-- ═══════════════════════════════════════════════════════════════
CHAT PANEL (standalone below fixed header) CHAT PANEL SLOT (in document flow — pushes hero down when open)
═══════════════════════════════════════════════════════════════ --> ═══════════════════════════════════════════════════════════════ -->
<div id="chat-panel-slot" style="padding-left:24px; padding-right:24px; padding-top:66px;">
<div class="nav-chat-panel" id="chat-panel" aria-hidden="true"> <div class="nav-chat-panel" id="chat-panel" aria-hidden="true">
<div class="chat-panel-header"> <div class="chat-panel-header">
<span class="chat-panel-title">💬 Sales Agent</span> <span class="chat-panel-title">💬 Sales Agent</span>
@@ -1149,6 +1153,7 @@
</div> </div>
<div class="chat-history" id="chat-msgs"></div> <div class="chat-history" id="chat-msgs"></div>
</div> </div>
</div>
<!-- ═══════════════════════════════════════════════════════════════ <!-- ═══════════════════════════════════════════════════════════════
HERO HERO
@@ -1847,7 +1852,7 @@
function chatToggle() { function chatToggle() {
chatOpen = !chatOpen; chatOpen = !chatOpen;
document.getElementById("chat-panel").classList.toggle("open", chatOpen); document.getElementById("chat-panel-slot").classList.toggle("open", chatOpen);
document.getElementById("chat-panel").setAttribute("aria-hidden", !chatOpen); document.getElementById("chat-panel").setAttribute("aria-hidden", !chatOpen);
if (chatOpen) { if (chatOpen) {
if (!chatId) { if (!chatId) {
@@ -1865,7 +1870,7 @@
function chatOpenSilent() { function chatOpenSilent() {
if (!chatOpen) { if (!chatOpen) {
chatOpen = true; chatOpen = true;
document.getElementById("chat-panel").classList.add("open"); document.getElementById("chat-panel-slot").classList.add("open");
document.getElementById("chat-panel").setAttribute("aria-hidden", "false"); document.getElementById("chat-panel").setAttribute("aria-hidden", "false");
} }
} }