Spaces:
Sleeping
Sleeping
| export default function NationCard({ nation, onSelect }) { | |
| return ( | |
| <div | |
| className="bg-white rounded-lg shadow-md p-4 cursor-pointer hover:shadow-lg transition-shadow" | |
| onClick={() => onSelect(nation)} | |
| > | |
| <div className="flex items-center space-x-4"> | |
| <img | |
| src={`https://flagcdn.com/w80/${nation.flagCode}.png`} | |
| alt={`${nation.name} flag`} | |
| className="w-12 h-8 object-cover" | |
| /> | |
| <div> | |
| <h3 className="font-bold">{nation.name}</h3> | |
| <p className="text-sm text-gray-600">Population: {nation.population}</p> | |
| </div> | |
| </div> | |
| </div> | |
| ) | |
| } |