fix: remove className prop from Image component and adjust carousel item styles for consistency

This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2024-11-06 16:20:09 +07:00
parent 80b63c02bc
commit 6d45fd9408
2 changed files with 4 additions and 8 deletions

View File

@ -30,7 +30,7 @@ const ImageModal = ({ src, alt, width, height, className }: ItemProps) => {
<DialogTitle>Image Preview</DialogTitle>
<DialogDescription>Click outside to close the image preview.</DialogDescription>
</DialogHeader>
<Image src={src} alt={alt} width={700} height={400} className={className} />
<Image src={src} alt={alt} width={700} height={400} />
<DialogFooter />
</DialogContent>
</Dialog>

View File

@ -53,10 +53,6 @@ export default async function ProjectDealPage({ params }: { params: { id: number
const timeDiff = Math.max(new Date(projectData.investment_deadline).getTime() - new Date().getTime(), 0);
const hourLeft = Math.floor(timeDiff / (1000 * 60 * 60));
// const carouselData = Array(5).fill({
// src: projectData.card_image_url || "/boiler1.jpg",
// alt: `${projectData.project_name} Image`,
// });
const carouselData = projectMaterial
? projectMaterial.flatMap((item) =>
(item.material_url || ["/boiler1.jpg"]).map((url: string) => ({
@ -106,8 +102,8 @@ export default async function ProjectDealPage({ params }: { params: { id: number
<CarouselNext />
</Carousel>
{/* second carousel */}
<Carousel className="w-full ml-1 h-[100px] mt-5">
<CarouselContent className="flex space-x-1">
<Carousel className="w-full ml-1 h-[100px] mt-5 overflow-hidden">
<CarouselContent className="flex space-x-1 h-[100px]">
{carouselData.map((item, index) => (
<CarouselItem key={index} className="flex">
<DisplayFullImage
@ -115,7 +111,7 @@ export default async function ProjectDealPage({ params }: { params: { id: number
alt={item.alt}
width={200}
height={100}
className="rounded-lg object-cover basis-0"
className="rounded-lg object-cover h-[100px] w-[200px]"
/>
</CarouselItem>
))}