From 72cf36e033ba794db7982befa45f035b62fa6cd2 Mon Sep 17 00:00:00 2001
From: "Alberto Duarte (PWC)" <alberto.duarte.delgado@pwc.com>
Date: Mon, 9 Oct 2023 17:32:25 +0100
Subject: Changes

---
 app/components/PreviewCard.tsx | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)
 create mode 100644 app/components/PreviewCard.tsx

(limited to 'app/components/PreviewCard.tsx')

diff --git a/app/components/PreviewCard.tsx b/app/components/PreviewCard.tsx
new file mode 100644
index 0000000..132f50a
--- /dev/null
+++ b/app/components/PreviewCard.tsx
@@ -0,0 +1,20 @@
+const imageURL = 'https://image.tmdb.org/t/p/original';
+import Genre from "./Genre";
+const baseURL ='https://api.themoviedb.org/3/'
+
+const PreviewCard = ({ movie, setModalContentId, setModalVisible }) => {
+    return (
+        <div className="hover:z-10" onClick={ () => {setModalVisible(true), setModalContentId(movie)}}>
+            <div className="shadow-black hover:outline outline-offset-4 outline-4 outline-white rounded flex-col p-1 relative bg-cover h-32 w-60 shrink-0 flex justify-end cursor-pointer hover:scale-110 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}
+               {movie.original_name}
+             </h3>
+            <Genre id={movie.id}/> 
+                </div>
+        </div>
+          )}
+        
+
+export default PreviewCard
\ No newline at end of file
-- 
cgit v1.2.3-54-g00ecf

