mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 18:05:11 +03:00
## Problem Only in dark mode <img width="1003" height="324" alt="image" src="https://github.com/user-attachments/assets/e131fd07-1327-4a0b-bb27-eccf1f5d7f93" /> ## Solution <img width="943" height="230" alt="image" src="https://github.com/user-attachments/assets/bcbee6e6-d303-45c6-b612-eb0f0423d458" />
21 lines
619 B
TypeScript
21 lines
619 B
TypeScript
import { PropsWithChildren } from 'react'
|
|
import { cn } from 'ui'
|
|
|
|
const ReportStickyNav = ({
|
|
content,
|
|
children,
|
|
className,
|
|
}: PropsWithChildren<{ className?: string; content: React.ReactNode }>) => {
|
|
return (
|
|
<section className={cn('relative flex flex-col gap-4 pt-16 -mt-2', className)}>
|
|
<div className="absolute inset-0 z-40 pointer-events-none flex flex-col gap-4">
|
|
<div className="sticky top-0 py-4 mb-4 flex w-full items-center gap-2 pointer-events-auto bg-background">
|
|
{content}
|
|
</div>
|
|
</div>
|
|
{children}
|
|
</section>
|
|
)
|
|
}
|
|
export default ReportStickyNav
|