Resume
/
movie-explorer
2
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

move sidebar

This commit is contained in:
andrzej 2024-05-08 16:50:49 +02:00
parent d523372464
commit 562f91f61c
1 changed files with 16 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/App.tsx
View File

@ -34,15 +34,15 @@ function App() {
useEffect(() => { useEffect(() => {
setLoadedMovies(movies.length) setLoadedMovies(movies.length)
if (movies[0].backdrop_path) { if (movies[0].backdrop_path) {
setBackdrop(tmdb.makeBgImgUrl(movies[0].backdrop_path)) const bgString = "linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0.5)), " + tmdb.makeBgImgUrl(movies[0].backdrop_path)
setBackdrop(bgString)
} }
}, [movies]) }, [movies])
return ( return (
<> <>
<header> <div className='main-container' style={{ backgroundImage: backdrop }}>
<h1>Movie Explorer</h1> <main >
</header> <Sidebar movie={chosenMovie} />
<main style={{ backgroundImage: backdrop }}>
<div id="movie-wall-container"> <div id="movie-wall-container">
{loadedMovies === movies.length ? {loadedMovies === movies.length ?
<MovieWall movies={movies} <MovieWall movies={movies}
@ -52,9 +52,8 @@ function App() {
setLoadedMovies={setLoadedMovies} setLoadedMovies={setLoadedMovies}
/> />
: "LOADING " + loadedMovies} </div> : "LOADING " + loadedMovies} </div>
<Sidebar movie={chosenMovie} />
</main> </main>
</div>
</> </>
) )
} }