shortenit/frontend/src/components/featuresCard/FeaturesCard.tsx
2024-12-20 23:40:38 +02:00

38 lines
865 B
TypeScript

import React from "react";
import "./FeaturesCard.css";
import { Link, useNavigate } from "react-router-dom";
import { CardProps } from "./CardProps";
const FeaturesCard: React.FC<CardProps> = ({
icon,
title,
description,
link,
}) => {
const navigate = useNavigate();
return (
<div className="Card" onClick={() => navigate(`${link}`)}>
<div className="top-part">
<div className="feature-icon">{icon}</div>
</div>
<div className="bottom-part">
<div className="feature-title">
<h3>{title}</h3>
</div>
<div className="feature-description">
<p>{description}</p>
</div>
<div className="feature-button">
<button>
<Link to={link}>Read More</Link>
</button>
</div>
</div>
</div>
);
};
export default FeaturesCard;