diff --git a/dotcom-rendering/src/components/Card/Card.tsx b/dotcom-rendering/src/components/Card/Card.tsx index 2431f62b3d..f58c186a5a 100644 --- a/dotcom-rendering/src/components/Card/Card.tsx +++ b/dotcom-rendering/src/components/Card/Card.tsx @@ -288,6 +288,34 @@ export const isWithinTwelveHours = (webPublicationDate: string): boolean => { return timeDiffHours <= 12; }; +const podcastImageStyles = (imageSize: ImageSizeType) => { + switch (imageSize) { + case 'small': + return css` + width: 69px; + height: 69px; + ${from.tablet} { + width: 98px; + height: 98px; + } + `; + + case 'medium': + return css` + width: 98px; + height: 98px; + ${from.tablet} { + width: 120px; + height: 120px; + } + `; + default: + return css` + width: 120px; + height: 120px; + `; + } +}; export const Card = ({ linkTo, format, @@ -800,6 +828,25 @@ export const Card = ({ {media.type === 'crossword' && ( )} + {media.type === 'podcast' && media.podcastImage.src && ( +