feat: Flixter - Pull Request to base repo

src/MovieList.jsx

@@ -130,7 +130,7 @@ const MovieList = ({
     }
   };
 
-  // Determine which movies to display based on the current page
+
   const getMoviesToDisplay = () => {
     if (currentPage === 'favorites') {
       return sortMovies(favoriteMovies);
@@ -142,7 +142,7 @@ const MovieList = ({
     }
   };
 
-  // Get the title for the current page
+
   const getPageTitle = () => {
     if (currentPage === 'favorites') {
       return 'My Favorites';
@@ -189,10 +189,10 @@ const MovieList = ({
       {displayedMovies.length === 0 && !loading ? (
         <div className="no-results">
           {currentPage === 'favorites'
-            ? "You haven't added any favorites yet"
+            ? "you havent added any favorites yet"
             : currentPage === 'watched'
-              ? "You haven't marked any movies as watched yet"
-              : "No movies found"}
+              ? "you haven't marked any movies as watched yet"
+              : "no movies found"}
         </div>
       ) : (
         <section className="movie-list">

src/MovieModal.jsx

@@ -98,6 +98,13 @@ const MovieModal = ({ movie, onClose }) => {
             <p>{movieDetails.overview}</p>
           </div>
         </div>
+
+        <div className='modal-trailer'>
+            <div className='trailer-container'>
+                <iframe width="560" height="315" src={movie.poster_path `${posterBaseUrl}${movie.poster_path}`} title="YouTube video player" ></iframe>
+            </div>
+
+        </div>
       </div>
     )
   }

src/SideBar.css

@@ -7,7 +7,7 @@
     width: 200px;
     left: 0;
     top: 0;
-    padding-top: 80px;
+    padding-top: 10rem;
     box-shadow: 2px 0 5px rgba(0, 0, 0, 0.3);
     z-index: 900;
 }

src/SideBar.jsx

@@ -1,4 +1,4 @@
-import './SideBar.css';
+import 'SideBar.css';
 
 const SideBar = ({ currentPage, onPageChange }) => {
     const pages = [