feat: add play icon to podcast post card

src/components/Icons/UnfilledPlayIcon/UnfilledPlayIcon.tsx

@@ -0,0 +1,20 @@
+import { LsdIcon } from '@acid-info/lsd-react'
+
+export const UnfilledPlayIcon = LsdIcon(
+  (props) => (
+    <svg
+      width="14"
+      height="14"
+      viewBox="0 0 14 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M5.83329 5.03996L8.90746 6.99996L5.83329 8.95996V5.03996ZM4.66663 2.91663V11.0833L11.0833 6.99996L4.66663 2.91663Z"
+        fill="black"
+      />
+    </svg>
+  ),
+  { filled: true },
+)

src/components/Icons/UnfilledPlayIcon/index.ts

@@ -0,0 +1 @@
+export * from './UnfilledPlayIcon'

src/components/PostCard/PostCard.Cover.tsx

@@ -3,8 +3,12 @@ import {
   ResponsiveImageProps,
 } from '@/components/ResponsiveImage/ResponsiveImage'
 import { LPE } from '@/types/lpe.types'
+import { IconButton } from '@acid-info/lsd-react'
 import Link from 'next/link'
 import { FC } from 'react'
+import { PlayIcon } from '../Icons/PlayIcon'
+import styled from '@emotion/styled'
+import { UnfilledPlayIcon } from '../Icons/UnfilledPlayIcon'
 
 export type PostCardCoverProps = React.ComponentProps<typeof Link> & {
   imageProps: ResponsiveImageProps
@@ -18,8 +22,28 @@ export const PostCardCover: FC<PostCardCoverProps> = ({
   ...props
 }) => {
   return (
-    <Link {...props} className={`post-card__cover-image ${props.className}`}>
+    <CustomLink
+      {...props}
+      className={`post-card__cover-image ${props.className}`}
+    >
       <ResponsiveImage {...imageProps} data={imageData} />
-    </Link>
+      {playIcon && (
+        <Icon size="small">
+          <UnfilledPlayIcon />
+        </Icon>
+      )}
+    </CustomLink>
   )
 }
+
+const CustomLink = styled(Link)`
+  position: relative;
+`
+
+const Icon = styled(IconButton)`
+  position: absolute;
+  bottom: 8px;
+  right: 8px;
+  background: white;
+  border: none;
+`

src/components/PostCard/PostCard.tsx

@@ -4,12 +4,11 @@ import {
   PostCardShowDetailsProps,
 } from '@/components/PostCard/PostCard.ShowDetails'
 import { Tags } from '@/components/Tags'
-import { Theme, Typography } from '@acid-info/lsd-react'
+import { Theme } from '@acid-info/lsd-react'
 import { CommonProps } from '@acid-info/lsd-react/dist/utils/useCommonProps'
 import { css } from '@emotion/react'
 import styled from '@emotion/styled'
 import clsx from 'clsx'
-import Link from 'next/link'
 import React from 'react'
 import { LPE } from '../../types/lpe.types'
 import { lsdUtils } from '../../utils/lsd.utils'
@@ -73,7 +72,12 @@ export const PostCard = (_props: PostCardProps) => {
       : `/podcasts/${podcastShowDetails?.slug}/${slug}`
 
   const coverImageElement = coverImage && (
-    <PostCardCover href={link} imageProps={imageProps} imageData={coverImage} />
+    <PostCardCover
+      href={link}
+      imageProps={imageProps}
+      imageData={coverImage}
+      playIcon={contentType === LPE.PostTypes.Podcast}
+    />
   )
 
   const labelElement = (