25 lines
765 B
JavaScript
25 lines
765 B
JavaScript
/* eslint-disable react/prop-types */
|
|
import { Clock, Users } from 'lucide-react';
|
|
|
|
export const RecipeCard = ({ recipe, onClick }) => (
|
|
<div className="recipe-card" onClick={() => onClick(recipe)}>
|
|
<img src={recipe.image} alt={recipe.title} className="recipe-image" />
|
|
<div className="recipe-content">
|
|
<h3 className="recipe-title">{recipe.title}</h3>
|
|
<div className="recipe-info">
|
|
<div className="info-item">
|
|
<Clock className="info-icon" />
|
|
{recipe.readyInMinutes || '30'} mins
|
|
</div>
|
|
<div className="info-item">
|
|
<Users className="info-icon" />
|
|
{recipe.servings || '4'} servings
|
|
</div>
|
|
{console.log(recipe.servings)}
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
); |