import React from "react";
import { Card } from "antd";
import style from "./Card.module.scss"

const { Meta } = Card;

const MainCard = ({ data }) => {
  const firstLatter = data?.title?.charAt(0)?.toUpperCase();
  return (
    <div>
      <Card
        // hoverable
        // style={{ width: 240, height: "500px" }}
        cover={<img alt="example" src={data?.image} style={{height: 280}} />}
      >
        <Meta
          title={firstLatter + data?.title?.substring(1)}
        //   description={data?.price}
        />
        <div className={style.priceAndButton}>
        <p>RS: {data?.price}</p>
        <button>Add To Cart</button>

        </div>
      </Card>
    </div>
  );
};

export default MainCard;
