diff options
Diffstat (limited to 'src/components/PreviewCard.tsx')
| -rw-r--r-- | src/components/PreviewCard.tsx | 19 |
1 files changed, 19 insertions, 0 deletions
diff --git a/src/components/PreviewCard.tsx b/src/components/PreviewCard.tsx new file mode 100644 index 0000000..5c4129f --- /dev/null +++ b/src/components/PreviewCard.tsx @@ -0,0 +1,19 @@ +const imageURL = 'https://image.tmdb.org/t/p/original'; +import Genre from "./Genre"; +const baseURL ='https://api.themoviedb.org/3/' + +const PreviewCard = ({ movie }) => { + return ( + <div className="hover:z-10"> + <div className="rounded ring-white hover:ring-4 flex-col p-1 relative bg-cover h-32 w-60 shrink-0 flex justify-end cursor-pointer hover:scale-125 transition ease-in-out" style={{backgroundImage: `url(${imageURL}${movie?.backdrop_path})`}}> + <div className="absolute h-full w-full inset-0 bg-gradient-to-t from-black/70"></div> + <h3 className={"text-white text-sm relative"}> + {movie.original_title} + </h3> + <Genre id={movie.id}/> + </div> + </div> + )} + + +export default PreviewCard
\ No newline at end of file |