Merge pull request #449 from AADESHak007/eventmint/movielist

altered the movie-list section
samyakmaitre · Oct 28, 2024 · 868a4c6 · 868a4c6
2 parents 2a5a999 + 762bbe2
commit 868a4c6
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 2 deletions.
diff --git a/public/play-button.png b/public/play-button.png
diff --git a/src/App.css b/src/App.css
@@ -100,11 +100,12 @@ header nav ul li {
 .movie h2 {
   font-size: 15px;
   margin: 0.5rem 0;
+  color: white;
 }
 
 .movie p {
   font-size: 14px;
-  color: #555;
+  color: #c1bdbd;
 }
 
 .movie button {

diff --git a/src/components/MovieList.js b/src/components/MovieList.js
@@ -62,7 +62,15 @@ function MovieList({ searchTerm }) {
   ); 
 
   return (
-    <div className="movie-list mt-20">
+    <div className='flex flex-col bg-slate-700 justify-center my-24'>
+      <div className='flex justify-start gap-3 w-[40%] ml-8 mt-8 p-2'>
+        <img src='/play-button.png' className='w-16 h-16 '></img>
+        <div className='w-72 p-1 text-left'>
+          <h3 className='text-md font-semibold tracking-widest text-white'>PREMIERE</h3>
+          <p className='text-sm text-zinc-300'>Watch new movies at home ,every Friday</p>
+        </div>
+      </div>
+      <div className="movie-list">
       {filteredMovies.map((movie, index) => (
         <Movie
           key={index}
@@ -75,6 +83,7 @@ function MovieList({ searchTerm }) {
         />
       ))}
     </div>
+    </div>
   );
 }