45 lines
1.0 KiB
TypeScript
45 lines
1.0 KiB
TypeScript
import { FujifilmRecipe } from '@/platforms/fujifilm/recipe';
|
|
import { FilmSimulation } from '@/simulation';
|
|
import clsx from 'clsx/lite';
|
|
import ImageLarge from '@/components/image/ImageLarge';
|
|
import PhotoRecipeFrostLightV2 from './PhotoRecipeFrostLightV2';
|
|
|
|
export default function PhotoRecipeOverlay({
|
|
backgroundImageUrl,
|
|
recipe,
|
|
simulation,
|
|
exposure,
|
|
iso,
|
|
}: {
|
|
backgroundImageUrl: string
|
|
recipe: FujifilmRecipe
|
|
simulation: FilmSimulation
|
|
exposure: string
|
|
iso: string
|
|
}) {
|
|
return (
|
|
<div className="space-y-4">
|
|
<div className={clsx(
|
|
'relative w-full aspect-[3/2]',
|
|
)}>
|
|
<ImageLarge
|
|
src={backgroundImageUrl}
|
|
alt="Image Background"
|
|
aspectRatio={3 / 2}
|
|
/>
|
|
<div className={clsx(
|
|
'absolute inset-0',
|
|
'flex items-center justify-center',
|
|
)}>
|
|
<PhotoRecipeFrostLightV2 {...{
|
|
recipe,
|
|
simulation,
|
|
exposure,
|
|
iso,
|
|
}} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|