Update Bookmarks page header to match other feed page headers

Removes sticky behavior, backdrop blur, and background from the
header. Uses the same plain header style with back arrow, icon,
and title as Treasures and other feed pages.
This commit is contained in:
Lemon
2026-03-18 23:30:07 -07:00
parent c3851c918b
commit 96e1f42ce9
+5 -5
View File
@@ -7,7 +7,7 @@ import { useAppContext } from '@/hooks/useAppContext';
import { useBookmarks } from '@/hooks/useBookmarks';
import { useCurrentUser } from '@/hooks/useCurrentUser';
import { LoginArea } from '@/components/auth/LoginArea';
import { cn } from '@/lib/utils';
export function BookmarksPage() {
const { config } = useAppContext();
@@ -22,12 +22,12 @@ export function BookmarksPage() {
return (
<main className="">
{/* Sticky header */}
<div className={cn('sidebar:sticky sidebar:top-0', 'flex items-center gap-4 px-4 pt-4 pb-5 bg-background/80 backdrop-blur-md z-10')}>
<Link to="/" className="p-2 rounded-full hover:bg-secondary transition-colors sidebar:hidden">
{/* Page header */}
<div className="flex items-center gap-4 px-4 mt-4 mb-1">
<Link to="/" className="p-2 -ml-2 rounded-full hover:bg-secondary transition-colors sidebar:hidden">
<ArrowLeft className="size-5" />
</Link>
<div className="flex items-center gap-2">
<div className="flex items-center gap-2 flex-1 min-w-0">
<Bookmark className="size-5" />
<h1 className="text-xl font-bold">Bookmarks</h1>
</div>