feat: Add floating "See Friends" button when list is closed
Shows a prominent button at bottom-left (mobile) or top-left (desktop) to reopen the friends list after closing it. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
4302f2d4f8
commit
aacc6eb03f
|
|
@ -383,6 +383,18 @@ export default function RoomPage() {
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{/* Floating "See Friends" button when participant list is hidden */}
|
||||||
|
{!showParticipants && (
|
||||||
|
<button
|
||||||
|
onClick={() => setShowParticipants(true)}
|
||||||
|
className="absolute bottom-6 left-4 md:top-4 md:bottom-auto flex items-center gap-2 px-4 py-2.5 rounded-full bg-rmaps-dark/90 backdrop-blur border border-white/20 hover:bg-rmaps-dark hover:border-white/30 transition-colors shadow-lg z-20"
|
||||||
|
>
|
||||||
|
<span className="text-lg">👥</span>
|
||||||
|
<span className="text-sm font-medium">See Friends</span>
|
||||||
|
<span className="text-xs text-white/60">({participants.length})</span>
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
|
||||||
{/* Connection status indicator */}
|
{/* Connection status indicator */}
|
||||||
{!isConnected && (
|
{!isConnected && (
|
||||||
<div className="absolute top-4 left-1/2 -translate-x-1/2 bg-yellow-500/90 text-black text-sm px-3 py-1.5 rounded-full z-30">
|
<div className="absolute top-4 left-1/2 -translate-x-1/2 bg-yellow-500/90 text-black text-sm px-3 py-1.5 rounded-full z-30">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue