feat: move presence bar to sticky bottom-right widget
Reposition the presence bar from above main content to a sticky bottom-right indicator that docks above the footer on scroll. Sized to fit content rather than spanning full width. Made-with: Cursor
This commit is contained in:
@@ -157,9 +157,6 @@ function App() {
|
|||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
{/* Admin Presence */}
|
|
||||||
<PresenceBar />
|
|
||||||
|
|
||||||
{/* Main Content */}
|
{/* Main Content */}
|
||||||
<main className="container mx-auto px-4 py-8 flex-grow">
|
<main className="container mx-auto px-4 py-8 flex-grow">
|
||||||
<Routes>
|
<Routes>
|
||||||
@@ -172,6 +169,9 @@ function App() {
|
|||||||
</Routes>
|
</Routes>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
|
{/* Admin Presence */}
|
||||||
|
<PresenceBar />
|
||||||
|
|
||||||
{/* Footer */}
|
{/* Footer */}
|
||||||
<footer className="bg-white dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 mt-12 flex-shrink-0">
|
<footer className="bg-white dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 mt-12 flex-shrink-0">
|
||||||
<div className="container mx-auto px-4 py-6">
|
<div className="container mx-auto px-4 py-6">
|
||||||
|
|||||||
@@ -46,8 +46,8 @@ function PresenceBar() {
|
|||||||
if (!hasViewers && !hasServices) return null;
|
if (!hasViewers && !hasServices) return null;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="container mx-auto px-2 sm:px-4 pt-3">
|
<div className="sticky bottom-0 z-40 flex justify-end px-4 pb-2 pointer-events-none">
|
||||||
<div className="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 px-4 py-2">
|
<div className="pointer-events-auto bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 px-4 py-2 w-fit">
|
||||||
<div className="flex items-center gap-4 flex-wrap">
|
<div className="flex items-center gap-4 flex-wrap">
|
||||||
{hasViewers && (
|
{hasViewers && (
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
|
|||||||
Reference in New Issue
Block a user