import Image from "next/image";
import { ProjectContentProps } from "./";

export default function ProjectContent(projectContent: ProjectContentProps) {
    return (
        <section className="flex flex-col items-center w-full pt-[10px]">
            <div className="flex flex-col xl:flex-row justify-between gap-[10px] *:basis-[32%] [&>div]:bg-tangerine-dream-shrimp">
                <Image
                    src={projectContent.images.left.src}
                    alt=""
                    width={2000}
                    height={2000}
                    className="w-full xl:w-[30%] h-auto"
                />
                <div className="p-[40px]">{projectContent.children}</div>
                <Image
                    src={projectContent.images.right.src}
                    alt=""
                    width={2000}
                    height={2000}
                    className="w-full xl:w-[30%] h-auto"
                />
            </div>
            <Image
                src={projectContent.images.central.src}
                alt=""
                width={2000}
                height={2000}
                className="w-full h-auto xl:mt-[15px] mt-[10px]"
            />
        </section>
    );
}