src/components/PublicationCard.js

import React from 'react';

const PublicationCard = ({ publication }) => {
  return (
    <div className="bg-white rounded-lg shadow p-6 transition-all hover:shadow-lg">
      <h3 className="font-bold text-lg">{publication.title}</h3>
      <p className="text-gray-700 italic mt-1">{publication.authors}</p>
      <div className="flex justify-between items-center mt-2">
        <p className="text-primary font-medium">{publication.venue}</p>
        <span className="text-gray-600">{publication.year}</span>
      </div>
      {publication.link && (
        <div className="mt-3">
          <a 
            href={publication.link}
            target="_blank"
            rel="noopener noreferrer"
            className="text-primary hover:underline"
          >
            View Publication
          </a>
        </div>
      )}
    </div>
  );
};

export default PublicationCard;