Renamed movieObject to searchObject, same with css.

client/app/components/SearchObject.jsx

@@ -3,7 +3,7 @@ import React from 'react';
 import Notifications, {notify} from 'react-notify-toast';
 
 // StyleComponents
-import searchResultCSS from './styles/searchResult.jsx';
+import searchObjectCSS from './styles/searchObject.jsx';
 import buttonsCSS from './styles/buttons.jsx';
 
 var MediaQuery = require('react-responsive');
@@ -85,27 +85,27 @@ class MovieObject {
          <div key={element_key}>
          <Notifications />
          
-         <div style={searchResultCSS.container} key={this.id}>
+         <div style={searchObjectCSS.container} key={this.id}>
             <MediaQuery minWidth={600}>
-               <div style={searchResultCSS.posterContainer}>
+               <div style={searchObjectCSS.posterContainer}>
-                  <img style={searchResultCSS.posterImage} id='poster' src={posterPath}></img>
+                  <img style={searchObjectCSS.posterImage} id='poster' src={posterPath}></img>
                </div>
-               <span style={searchResultCSS.title_large}>{this.title}</span>
+               <span style={searchObjectCSS.title_large}>{this.title}</span>
                <br></br>
-               <span style={searchResultCSS.stats_large}>Released: { this.year } | Rating: {this.rating}</span>
+               <span style={searchObjectCSS.stats_large}>Released: { this.year } | Rating: {this.rating}</span>
                <br></br>
-               <span style={searchResultCSS.summary}>{this.summary}</span>
+               <span style={searchObjectCSS.summary}>{this.summary}</span>
                <br></br>
             </MediaQuery>
 
             <MediaQuery maxWidth={600}>
-               <img src={ backgroundPath } style={searchResultCSS.backgroundImage}></img>
+               <img src={ backgroundPath } style={searchObjectCSS.backgroundImage}></img>
-               <span style={searchResultCSS.title_small}>{this.title}</span>
+               <span style={searchObjectCSS.title_small}>{this.title}</span>
                <br></br>
-               <span style={searchResultCSS.stats_small}>Released: {this.year} | Rating: {this.rating}</span>
+               <span style={searchObjectCSS.stats_small}>Released: {this.year} | Rating: {this.rating}</span>
             </MediaQuery>
 
-            <div style={searchResultCSS.buttons}>
+            <div style={searchObjectCSS.buttons}>
                {foundInPlex}
                
                <a href={themoviedbLink}>
@@ -125,8 +125,8 @@ class MovieObject {
              <br />
          </MediaQuery>
          
-         <div style={searchResultCSS.dividerRow}>
+         <div style={searchObjectCSS.dividerRow}>
-             <div style={searchResultCSS.itemDivider}></div>
+             <div style={searchObjectCSS.itemDivider}></div>
          </div>
          </div>
       )

client/app/components/styles/movieObjectStyle.jsx

@@ -1,112 +0,0 @@
-
-export default {
-	resultItem: {
-		maxWidth: '95%',
-		margin: '0 auto',
-		minHeight: '230px'
-	},
-
-	movie_content: {
-		marginLeft: '15px'
-	},
-
-	resultTitleLarge: {
-		color: 'black',
-		fontSize: '2em',
-	},
-
-	resultTitleSmall: {
-		color: 'black',
-		fontSize: '22px',
-	},
-
-	yearRatingLarge: {
-		fontSize: '0.8em'
-	},
-
-	resultPoster: {
-		float: 'left',
-		zIndex: '3',
-		position: 'relative',
-		marginRight: '30px'
-	},
-
-	background: {
-		width: '100%'
-	},
-
-	yearRatingSmall: {
-		marginTop: '5px',
-		fontSize: '0.8em'
-	},
-
-	resultPosterImg: {
-		border: '2px none',
-	    borderRadius: '2px',
-	    width: '150px'
-	},
-
-	cornerRibbon: {
-		position: 'absolute',
-		width: '450px',
-	},
-
-	summary: {
-		fontSize: '15px',
-	},
-
-	buttons: {
-		paddingTop: '20px'
-	},
-
-	requestButton: {
-		color: '#e9a131',
-		marginRight: '10px',
-		backgroundColor: 'white',
-		border: '#e9a131 2px solid',
-		borderColor: '#e9a131',
-		borderRadius: '4px',
-		textAlign: 'center',
-		padding: '10px',
-		minWidth: '100px',
-		float: 'left',
-		fontSize: '13px',
-		fontWeight: '800',
-		cursor: 'pointer'
-	},
-
-	requestButton_hover: {
-		backgroundColor: '#e9a131', 
-		color: 'white',
-	},
-
-	tmdbButton: {
-		color: '#00d17c',
-		marginRight: '10px',
-		backgroundColor: 'white',
-		border: '#00d17c 2px solid',
-		borderRadius: '4px',
-		textAlign: 'center',
-		padding: '10px',
-		minWidth: '100px',
-		float: 'left',
-		fontSize: '13px',
-		fontWeight: '800',
-		cursor: 'pointer'
-	},
-
-	tmdbButton_hover: {
-		backgroundColor: '#00d17c', 
-		color: 'white',
-	},
-
-	row: {
-		width: '100%'
-	},
-
-	itemDivider: {
-		width: '90%',
-		borderBottom: '1px solid grey',
-		margin: '2rem auto'
-	}
-}

client/app/components/styles/searchObject.jsx

@@ -0,0 +1,58 @@
+
+export default {
+	container: {
+		maxWidth: '95%',
+		margin: '0 auto',
+		minHeight: '230px'
+	},
+
+	title_large: {
+		color: 'black',
+		fontSize: '2em',
+	},
+
+	title_small: {
+		color: 'black',
+		fontSize: '22px',
+	},
+
+	stats_large: {
+		fontSize: '0.8em'
+	},
+
+	stats_small: {
+		marginTop: '5px',
+		fontSize: '0.8em'
+	},
+
+	posterContainer: {
+		float: 'left',
+		zIndex: '3',
+		position: 'relative',
+		marginRight: '30px'
+	},
+
+	posterImage: {
+		border: '2px none',
+	    borderRadius: '2px',
+	    width: '150px'
+	},
+
+	backgroundImage: {
+		width: '100%'
+	},
+
+	summary: {
+		fontSize: '15px',
+	},
+
+	dividerRow: {
+		width: '100%'
+	},
+
+	itemDivider: {
+		width: '90%',
+		borderBottom: '1px solid grey',
+		margin: '2rem auto'
+	}
+}