hide chatboat icon ,mobile responsive drawer

This commit is contained in:
Mayur Shinde
2026-06-15 11:51:59 +05:30
parent 11d5662a92
commit c8865e7d4c
2 changed files with 9 additions and 4 deletions
+3 -1
View File
@@ -384,7 +384,9 @@ const Layout = () => {
</PageTransition> </PageTransition>
</main> </main>
<Chatbot /> {/* Hide the floating chat on full-page flows that have their own bottom CTAs
(estimate wizard, ad preview form, Ad Engine) so it doesn't overlap their buttons. */}
{!(location.pathname === '/estimate' || location.pathname === '/marketing' || location.pathname.startsWith('/ads/')) && <Chatbot />}
</div> </div>
); );
}; };
+6 -3
View File
@@ -1,5 +1,6 @@
import React, { useState, useEffect, useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
import { createPortal } from 'react-dom';
import { X, Home, DollarSign, User, Edit2, Save, Info, AlertCircle, ShieldCheck, Loader2, ChevronLeft, ChevronRight, Trash2 } from 'lucide-react'; import { X, Home, DollarSign, User, Edit2, Save, Info, AlertCircle, ShieldCheck, Loader2, ChevronLeft, ChevronRight, Trash2 } from 'lucide-react';
import { SpotlightCard } from '../SpotlightCard'; import { SpotlightCard } from '../SpotlightCard';
@@ -309,7 +310,7 @@ const PropertyDetailDrawer = ({ isOpen, onClose, data, newLocation, onSave, load
); );
}; };
return ( return createPortal(
<div <div
className={`fixed z-[1000] flex flex-col transition-transform duration-300 ease-out inset-0 md:inset-auto md:top-4 md:right-4 md:bottom-4 md:w-[500px] ${isOpen ? 'translate-x-0' : 'translate-x-full md:translate-x-[calc(100%+2rem)]'}`} className={`fixed z-[1000] flex flex-col transition-transform duration-300 ease-out inset-0 md:inset-auto md:top-4 md:right-4 md:bottom-4 md:w-[500px] ${isOpen ? 'translate-x-0' : 'translate-x-full md:translate-x-[calc(100%+2rem)]'}`}
role="dialog" role="dialog"
@@ -325,7 +326,8 @@ const PropertyDetailDrawer = ({ isOpen, onClose, data, newLocation, onSave, load
<button <button
ref={closeButtonRef} ref={closeButtonRef}
onClick={onClose} onClick={onClose}
className="absolute top-4 right-4 p-2 bg-white/50 dark:bg-white/10 hover:bg-white dark:hover:bg-white/20 rounded-full transition-all backdrop-blur-md text-zinc-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-zinc-500 z-50 cursor-pointer shadow-sm border border-black/5 dark:border-white/5" style={{ top: 'max(1rem, env(safe-area-inset-top))' }}
className="absolute right-4 p-2 bg-white/50 dark:bg-white/10 hover:bg-white dark:hover:bg-white/20 rounded-full transition-all backdrop-blur-md text-zinc-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-zinc-500 z-50 cursor-pointer shadow-sm border border-black/5 dark:border-white/5"
aria-label="Close property details" aria-label="Close property details"
> >
<X size={18} /> <X size={18} />
@@ -710,7 +712,8 @@ const PropertyDetailDrawer = ({ isOpen, onClose, data, newLocation, onSave, load
</div> </div>
)} )}
</div> </div>,
document.body
); );
}; };