mauricedb

.genre-row .genre-row-movie {
    padding: 0;
}

.genre-row .genre-row-movie .title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

mauricedb

import React, { Component, PropTypes } from 'react';

class GenreRowMovie extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    const { movie } = this.props;

mauricedb

.genre-row .genre-row-movie {
    padding: 0;
    transition: transform 0.3s;
    transition-delay: 0s;
}

.genre-row .genre-row-movie:hover {
    transform: scale(1.25);
    transition-delay: 0.3s;
    z-index: 1;

mauricedb

import React, { Component, PropTypes } from 'react';
import GenreRowMovie from './genre-row-movie';
import ExpandedGenreRowMovie from './expanded-genre-row-movie';
import './genre-row.css';

class GenreRow extends Component {
  constructor(props) {
    super(props);

    this.state = {

mauricedb

import React, { Component, PropTypes } from 'react';

class GenreRowMovie extends Component {
  constructor(props) {
    super(props);

    this.expandMovie = this.expandMovie.bind(this);
  }

  expandMovie() {

mauricedb

import React, { Component, PropTypes } from 'react';

class ExpandedGenreRowMovie extends Component {
  constructor(props) {
    super(props);
    this.startPlaying = this.startPlaying.bind(this);
  }

  startPlaying() {
    const { movie, startPlaying } = this.props;

mauricedb

import React, { Component } from 'react';
import AppPresentation from './app-presentation';

class AppContainer extends Component {
  constructor(props) {
    super(props);

    this.state = { 
      user: null,
      movies: null,

mauricedb

.video {
    position: absolute;
    top: 20%;
    left: 0;
    width: 100%;
    height: 80%;
}

mauricedb

import React, { PropTypes } from 'react';
import './playing-movie.css';

const PlayingMovie = ({ movie, stopPlaying }) => (
  <div className="row">
    <div className="title">
      <h1>{movie.title}
        <button className="btn btn-link pull-right" onClick={stopPlaying}>
          <i className="glyphicon glyphicon-remove" />
        </button>

mauricedb

import React, { Component } from 'react';
import AppPresentation from './app-presentation';

class AppContainer extends Component {
  constructor(props) {
    super(props);

    this.state = { 
      user: null,
      movies: null,