forked from emre/www_projectmycelium_com
23 lines
569 B
TypeScript
23 lines
569 B
TypeScript
import clsx from 'clsx'
|
|
|
|
import phoneFrame from '@/images/phone-frame.svg'
|
|
|
|
export function PhoneFrame({
|
|
className,
|
|
children,
|
|
...props
|
|
}: React.ComponentPropsWithoutRef<'div'>) {
|
|
return (
|
|
<div className={clsx('relative aspect-[366/729]', className)} {...props}>
|
|
<img
|
|
src={phoneFrame}
|
|
alt=""
|
|
className="pointer-events-none absolute inset-0 w-full h-full"
|
|
/>
|
|
<div className="absolute inset-x-[6.3%] top-[3.15%] bottom-[2.75%] rounded-3xl overflow-y-auto bg-gray-900">
|
|
{children}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|