fix: input bar back in header, panel standalone below, hero spacing restored

This commit is contained in:
Oliver
2026-06-06 17:22:01 -03:00
parent 816e53f121
commit a048f1c1a8
+15 -27
View File
@@ -336,7 +336,7 @@
HERO HERO
══════════════════════════════════════════════════════════ */ ══════════════════════════════════════════════════════════ */
.hero { .hero {
padding: 104px 0 80px; padding: 140px 0 80px;
text-align: center; text-align: center;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
@@ -960,7 +960,7 @@
.features-grid { grid-template-columns: 1fr; } .features-grid { grid-template-columns: 1fr; }
.hero-stats { gap: 24px; } .hero-stats { gap: 24px; }
.hero { padding: 90px 0 60px; } .hero { padding: 110px 0 60px; }
section { padding: 60px 0; } section { padding: 60px 0; }
.pricing-card { padding: 32px 24px; } .pricing-card { padding: 32px 24px; }
@@ -971,15 +971,7 @@
} }
} }
/* ── Chat Bar (standalone below header) ───────────────── */ /* ── Chat ──────────────────────────────────────────────── */
.nav-chat-wrap {
display: flex;
flex-direction: column;
align-items: flex-start;
width: 340px;
max-width: 100%;
position: relative;
}
.nav-chat-panel { .nav-chat-panel {
width: 340px; width: 340px;
max-width: 100%; max-width: 100%;
@@ -991,10 +983,11 @@
overflow: hidden; overflow: hidden;
display: none; display: none;
flex-direction: column; flex-direction: column;
margin-bottom: 8px;
z-index: 9999; z-index: 9999;
margin-top: 66px;
margin-left: 24px;
} }
#nav-chat.open .nav-chat-panel { .nav-chat-panel.open {
display: flex; display: flex;
} }
.nav-chat-main { .nav-chat-main {
@@ -1098,7 +1091,7 @@
opacity: 0.6; opacity: 0.6;
} }
@media (max-width: 700px) { @media (max-width: 700px) {
.nav-chat-wrap { display: none; } .nav-chat-main { display: none; }
} }
</style> </style>
</head> </head>
@@ -1126,7 +1119,11 @@
<li><a href="#pricing">Pricing</a></li> <li><a href="#pricing">Pricing</a></li>
<li><a href="#faq">FAQ</a></li> <li><a href="#faq">FAQ</a></li>
</ul> </ul>
<div class="nav-chat-main">
<button class="nav-chat-toggle" id="nav-chat-toggle" onclick="chatToggle()" aria-label="Toggle chat history">💬</button>
<input type="text" class="nav-chat-input" id="chat-input" placeholder="Ask your sales agent" onkeydown="chatKey(event)" />
<button class="nav-chat-send" id="chat-send-btn" onclick="chatSend()"></button>
</div>
<div class="header-actions"> <div class="header-actions">
<a href="https://app.derez.ai" class="btn-login"> <a href="https://app.derez.ai" class="btn-login">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
@@ -1144,10 +1141,8 @@
</header> </header>
<!-- ═══════════════════════════════════════════════════════════════ <!-- ═══════════════════════════════════════════════════════════════
CHAT BAR (standalone below fixed header) CHAT PANEL (standalone below fixed header)
═══════════════════════════════════════════════════════════════ --> ═══════════════════════════════════════════════════════════════ -->
<div class="container" style="padding-top: 66px; padding-bottom: 6px;">
<div class="nav-chat-wrap" id="nav-chat">
<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>
@@ -1155,13 +1150,6 @@
</div> </div>
<div class="chat-history" id="chat-msgs"></div> <div class="chat-history" id="chat-msgs"></div>
</div> </div>
<div class="nav-chat-main">
<button class="nav-chat-toggle" id="nav-chat-toggle" onclick="chatToggle()" aria-label="Toggle chat history">💬</button>
<input type="text" class="nav-chat-input" id="chat-input" placeholder="Ask your sales agent" onkeydown="chatKey(event)" />
<button class="nav-chat-send" id="chat-send-btn" onclick="chatSend()"></button>
</div>
</div>
</div>
<!-- ═══════════════════════════════════════════════════════════════ <!-- ═══════════════════════════════════════════════════════════════
HERO HERO
@@ -1860,7 +1848,7 @@
function chatToggle() { function chatToggle() {
chatOpen = !chatOpen; chatOpen = !chatOpen;
document.getElementById("nav-chat").classList.toggle("open", chatOpen); document.getElementById("chat-panel").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) {
@@ -1878,7 +1866,7 @@
function chatOpenSilent() { function chatOpenSilent() {
if (!chatOpen) { if (!chatOpen) {
chatOpen = true; chatOpen = true;
document.getElementById("nav-chat").classList.add("open"); document.getElementById("chat-panel").classList.add("open");
document.getElementById("chat-panel").setAttribute("aria-hidden", "false"); document.getElementById("chat-panel").setAttribute("aria-hidden", "false");
} }
} }