mirror of
https://github.com/supabase/supabase.git
synced 2026-10-17 15:19:08 +03:00
* new homepage logos marquee * add products claim * logos spacing * dashboard table editor demo * dashboard table editor demo * dashboard recordings * rls policies * update hp frameworks * add dataAPIs to homepage bento * tweet section update * padding * hp products update * new customer stories hp section * height * finish homepage details * update logos * fix database visual * improve functions visual ux * animate data-apis visual * realtime visual update * reduce-motion and update chatbase logo * lighter heading paragraph * improve video tabs components * add priority to offsetted images * video plays inline * fix mobile tweets spacing * smoll * load video slightly before the component enters the viewport * fix product pointer-events * theme based and light weight dashboard video * testimonials margin * remove yellow tint from light mode recordings * fix vitest window-matchMedia error * fix vitest window-matchMedia error * fix url type * remove tweet
28 lines
846 B
TypeScript
28 lines
846 B
TypeScript
import React, { PropsWithChildren } from 'react'
|
|
import { cn } from 'ui'
|
|
|
|
interface Props extends PropsWithChildren {
|
|
className?: string
|
|
contentClassName?: string
|
|
}
|
|
|
|
const BrowserFrame: React.FC<Props> = ({ children, className, contentClassName }) => {
|
|
return (
|
|
<div
|
|
className={cn(
|
|
'relative rounded-2xl shadow-lg p-2 pt-0 w-full h-full bg-alternative-200 border flex flex-col',
|
|
className
|
|
)}
|
|
>
|
|
<div className="w-full px-2 py-3 relative flex items-center gap-1.5 lg:gap-2">
|
|
<div className="w-2 h-2 bg-border rounded-full" />
|
|
<div className="w-2 h-2 bg-border rounded-full" />
|
|
<div className="w-2 h-2 bg-border rounded-full" />
|
|
</div>
|
|
<div className={cn('h-full w-full rounded-lg', contentClassName)}>{children}</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default BrowserFrame
|