Recipe Card

import { RecipeCard } from "@/components/ui/recipe-card"; // Adjust the import path

export default function RecipeCardDemo() {
  const recipeData = {
    title: "Cherry Tomato And Salad Mix Bowl",
    description: "A refreshing and vibrant Cherry Tomato and Salad Mix Bowl, perfect for a light meal or side dish!",
    ingredients: ["Cherry tomato", "Olive oil", "Lemon juice", "Salt", "Black pepper"],
    imageUrl: "https://cdn.grofers.com/cdn-cgi/image/f=auto,fit=scale-down,q=70,metadata=none,w=540/layout-engine/v2/2024-09/cherry_tomato_and_salad_mix_bowl.webp?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",
    cookTime: "10min",
    servings: 2,
    calories: 150,
  };

  return (
    <div className="flex items-center justify-center p-4 bg-background">
      <div className="w-full max-w-4xl">
        <RecipeCard
          title={recipeData.title}
          description={recipeData.description}
          ingredients={recipeData.ingredients}
          imageUrl={recipeData.imageUrl}
          cookTime={recipeData.cookTime}
          servings={recipeData.servings}
          calories={recipeData.calories}
        />
      </div>
    </div>
  );
}