refactor(ui): remove mascot tooltip from sidebar component
Removes the hardcoded mascot tooltip implementation from the Sidebar component to clean up the component structure. The tooltip logic is now handled elsewhere.
This commit is contained in:
@@ -109,30 +109,8 @@ export function Sidebar({
|
||||
{/* Spacer pushes mascot to bottom */}
|
||||
<div className="flex-1" />
|
||||
|
||||
{/* Mascot PNG with anchored chatbot */}
|
||||
<div className="relative flex justify-center pb-4">
|
||||
{!mascotChat.isOpen && (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, x: -8, y: 6, scale: 0.96 }}
|
||||
animate={{ opacity: 1, x: 0, y: 0, scale: 1 }}
|
||||
transition={{ type: "spring", stiffness: 280, damping: 24 }}
|
||||
className="pointer-events-none fixed bottom-[100px] left-[72px] z-[9999] w-64"
|
||||
>
|
||||
<div className="relative rounded-2xl border border-sky-200/80 bg-white/95 px-4 py-3 text-left shadow-xl shadow-sky-100/70 backdrop-blur-md">
|
||||
<p className="text-[11px] font-semibold uppercase tracking-wide text-primary/70">
|
||||
Discord Watcher
|
||||
</p>
|
||||
<p className="mt-1 text-xs leading-relaxed text-slate-700">
|
||||
Halo! Saya mascot mu. Klik aku kalau mau tanya soal obrolan
|
||||
atau moderasi ✨
|
||||
</p>
|
||||
{/* Outer: border layer — triangle pointing left at center-right */}
|
||||
<div className="absolute -left-[13px] top-1/2 z-10 h-[21px] w-[21px] -translate-y-1/2 bg-sky-200/80 [clip-path:polygon(0_50%,100%_0,100%_100%)]" />
|
||||
{/* Inner: fill layer — matches bubble bg */}
|
||||
<div className="absolute -left-3 top-1/2 z-20 h-5 w-5 -translate-y-1/2 bg-white/95 [clip-path:polygon(0_50%,100%_0,100%_100%)]" />
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
{/* Mascot button */}
|
||||
<div className="flex justify-center pb-4">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => mascotChat.setIsOpen(!mascotChat.isOpen)}
|
||||
|
||||
Reference in New Issue
Block a user