This commit is contained in:
andres alcocer
2018-11-19 15:40:45 -05:00
parent d8adc7b9d3
commit 35a583a42f
6 changed files with 63 additions and 49 deletions

View File

@@ -7,6 +7,7 @@ class Header extends Component {
render() {
/** Background image for the header component */
const backgroundStyle = {
backgroundSize: "cover",
backgroundImage: `url(https://image.tmdb.org/t/p/original/${this.props.movie.backdrop_path})`,
@@ -15,17 +16,18 @@ class Header extends Component {
return (
<header style={backgroundStyle} className="header">
<div className="header__container">
<h1 className="header__container-heading">{this.props.movie.name}</h1>
<button onClick={() => alert("not a movie!")} className="header__container-btnPlay">
<PlayLogo className="header__container-btnMyList-play" />
Play
</button>
<button className="header__container-btnMyList">
<AddLogo className="header__container-btnMyList-add" />
My List
</button>
<h1 className="header__container-heading">{this.props.movie.name}</h1>
<button onClick={() => alert("not a movie!")} className="header__container-btnPlay">
<PlayLogo className="header__container-btnMyList-play" />
Play
</button>
<button className="header__container-btnMyList">
<AddLogo className="header__container-btnMyList-add" />
My List
</button>
<p className="header__container-overview">{this.props.movie.overview}</p>
</div>
<div className="header--fadeBottom"></div>

View File

@@ -3,11 +3,8 @@ import Aux from '../../../hoc/Aux/Aux';
import Backdrop from '../Backdrop/Backdrop'
class Modal extends Component {
render() {
const backgroundStyle = {
backgroundSize: "cover",
@@ -18,7 +15,7 @@ class Modal extends Component {
<Backdrop show={this.props.show} toggleBackdrop={this.props.modalClosed} />
<div
style={backgroundStyle}
className={(this.props.show ? "modal show" : "modal hide")}>
className={(this.props.show ? "modal show" : "modal hide")}>
{this.props.children}
</div>
</Aux>