Spaces:
Running
Running
File size: 1,653 Bytes
06a7653 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 |
import {
Card,
CardBody,
Typography,
Button,
} from "@material-tailwind/react";
import Image from 'next/image'
interface AboutCardProp {
title: string;
subTitle: string;
description: string;
imageName: string;
paper_links: string;
}
export function AboutCard({ title, description, subTitle,imageName,paper_links }: AboutCardProp) {
return (
<Card shadow={false} placeholder={""}>
<CardBody className="h-[700px] p-5 flex flex-col justify-center items-center rounded-2xl bg-gray-800 " placeholder={""}>
{/* <img src={imageName} alt="next/image" className="w-512 h-512 mb-2"/> */}
<Typography variant="h4" className="text-center" color="white" placeholder="">
{title}
</Typography>
<Image
src={`/image/${imageName}`}
width={500}
height={500}
alt="next/image"
/>
<Typography variant="h6" className="mb-4 text-center" color="white" placeholder="">
{subTitle}
</Typography>
<Typography
placeholder={""}
color="white"
className="mt-2 mb-10 text-base w-full lg:w-8/12 text-center font-normal"
>
{description}
</Typography>
<Button color="white" placeholder={""}>
<Typography placeholder={""} color="blue-gray" className="mt-2 mb-2 text-base w-full lg:w-8/8 text-center font-normal">
<a href={paper_links} className="text-gray" target="_blank">
More Details
</a>
</Typography>
</Button>
</CardBody>
</Card>
);
}
export default AboutCard;
|