Added alt and title to RecipeCard image.

This commit is contained in:
Jesse Brault 2024-07-30 21:13:08 -05:00
parent 005c90d13d
commit 86a7471656
2 changed files with 6 additions and 1 deletions

View File

@ -4,6 +4,7 @@ export interface RecipeCardProps {
title: string title: string
ownerUsername: string ownerUsername: string
mainImageUrl: string mainImageUrl: string
mainImageAlt?: string
starCount: number starCount: number
isPublic: boolean isPublic: boolean
} }
@ -12,12 +13,13 @@ const RecipeCard = ({
title, title,
ownerUsername, ownerUsername,
mainImageUrl, mainImageUrl,
mainImageAlt,
starCount, starCount,
isPublic isPublic
}: RecipeCardProps) => { }: RecipeCardProps) => {
return ( return (
<article> <article>
<img src={mainImageUrl} /> <img src={mainImageUrl} alt={mainImageAlt} title={mainImageAlt} />
<div className="title-star-count-container"> <div className="title-star-count-container">
<h1>{title}</h1> <h1>{title}</h1>
<span> <span>

View File

@ -35,6 +35,9 @@ const Recipes = () => {
title={view.title} title={view.title}
ownerUsername={view.ownerUsername} ownerUsername={view.ownerUsername}
mainImageUrl={view.mainImage.url} mainImageUrl={view.mainImage.url}
mainImageAlt={
view.mainImage.alt ? view.mainImage.alt : undefined
}
starCount={view.starCount} starCount={view.starCount}
isPublic={view.isPublic} isPublic={view.isPublic}
/> />