Now it is a little messy with lots of css inline, but will clean and comment. Has now a working UI, needs more 404 handling of items.

This commit is contained in:
2017-09-02 16:30:02 +02:00
parent e33840f1db
commit d77a4c6d9e

View File

@@ -1,6 +1,8 @@
import React from 'react'; import React from 'react';
import glamorous from 'glamorous';
require('../app.scss'); // StyleComponents
import mediaResultItem from './styledComponents/mediaResultItem.jsx';
class MovieObject { class MovieObject {
constructor(object) { constructor(object) {
@@ -63,7 +65,7 @@ class MovieObject {
borderRadius: '4px', borderRadius: '4px',
textAlign: 'center', textAlign: 'center',
padding: '10px', padding: '10px',
width: '100px', minWidth: '100px',
float: 'left', float: 'left',
fontSize: '13px', fontSize: '13px',
fontWeight: '800', fontWeight: '800',
@@ -78,7 +80,7 @@ class MovieObject {
borderRadius: '4px', borderRadius: '4px',
textAlign: 'center', textAlign: 'center',
padding: '10px', padding: '10px',
width: '100px', minWidth: '100px',
float: 'left', float: 'left',
fontSize: '13px', fontSize: '13px',
fontWeight: '800', fontWeight: '800',
@@ -110,9 +112,12 @@ class MovieObject {
style={requestButton}><span>&#x0002B; Request</span></button>; style={requestButton}><span>&#x0002B; Request</span></button>;
} }
var themoviedbLink = 'https://www.themoviedb.org/movie/' + this.id
return ( return (
<div> <div>
<div key={this.id} style={resultItem}> <div style={resultItem} key={this.id}>
<div style={resultPoster}> <div style={resultPoster}>
<img style={resultPosterImg} id='poster' src={posterPath}></img> <img style={resultPosterImg} id='poster' src={posterPath}></img>
</div> </div>
@@ -127,7 +132,7 @@ class MovieObject {
<div style={buttons}> <div style={buttons}>
{foundInPlex} {foundInPlex}
<button style={tmdbButton}><span>Info</span></button> <a href={themoviedbLink}><button style={tmdbButton}><span>Info</span></button></a>
</div> </div>
</div> </div>
</div> </div>