21 lines
675 B
JavaScript
21 lines
675 B
JavaScript
import React from 'react';
|
|
|
|
function SongCard({ song }) {
|
|
return (
|
|
<div className="rounded-lg shadow-md p-4 bg-white dark:bg-gray-800 flex flex-col items-center text-center">
|
|
<img
|
|
src={song.cover || '/default-cover.jpg'}
|
|
alt={song.title}
|
|
className="w-24 h-24 object-cover rounded"
|
|
/>
|
|
<h3 className="mt-2 text-sm font-semibold text-gray-800 dark:text-white">{song.title}</h3>
|
|
<p className="text-xs text-gray-500 dark:text-gray-300">{song.artist}</p>
|
|
<button className="mt-2 px-3 py-1 text-sm bg-blue-500 text-white rounded hover:bg-blue-600">
|
|
Play
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default SongCard;
|