Keeping parallax mainly for profile views (Artist, User), makes themes more consistently nice

src/js/views/Album.js

@@ -101,7 +101,7 @@ export class Album extends React.Component {
 
   setWindowTitle = (album = this.props.album) => {
     const { uiActions: { setWindowTitle } } = this.props;
-  
+
     if (album) {
       let artists = '';
       if (album.artists_uris && artists) {
@@ -161,7 +161,7 @@ export class Album extends React.Component {
   }
 
   play = () => {
-    const { uri, mopidyActions: { playURIs } } = this.props;    
+    const { uri, mopidyActions: { playURIs } } = this.props;
     playURIs([uri], uri);
   }
 
@@ -211,8 +211,6 @@ export class Album extends React.Component {
 
     return (
       <div className="view album-view content-wrapper preserve-3d">
-        <Parallax image={album.images && album.images.huge} blur />
-
         <div className="thumbnail-wrapper">
           <Thumbnail size="large" glow canZoom images={album.images} />
         </div>

src/js/views/Playlist.js

@@ -63,7 +63,7 @@ class Playlist extends React.Component {
         push,
       },
     } = this.props;
-  
+
     if (prevPlaylist && playlist && prevPlaylist.moved_to !== playlist.moved_to) {
       push(`/playlist/${encodeURIComponent(playlist.moved_to)}`);
     }
@@ -219,8 +219,6 @@ Could not find playlist with URI "
     return (
       <div className="view playlist-view content-wrapper preserve-3d">
 
-        <Parallax image={playlist.images ? playlist.images.huge : null} blur />
-
         <div className="thumbnail-wrapper">
           <Thumbnail size="large" glow canZoom images={playlist.images} />
         </div>

src/js/views/Queue.js

@@ -207,7 +207,7 @@ class Queue extends React.Component {
   }
 
   render() {
-    const { current_track, queue_tracks } = this.props;
+    const { current_track, queue_tracks, theme } = this.props;
     const { limit } = this.state;
     const total_queue_tracks = queue_tracks.length;
     const tracks = queue_tracks.slice(0, limit);
@@ -244,7 +244,7 @@ class Queue extends React.Component {
           <Icon name="play_arrow" type="material" />
           Now playing
         </Header>
-        <Parallax image={current_track_image} blur />
+        {theme === 'dark' && <Parallax image={current_track_image} blur />}
         <div className="content-wrapper">
           <div className="current-track">
             {this.renderArtwork(current_track_image)}

src/js/views/discover/DiscoverFeatured.js

@@ -35,12 +35,6 @@ class DiscoverFeatured extends React.Component {
     this.props.uiActions.showContextMenu(data);
   }
 
-  renderIntro = ({ images: { large } = {} } = {}) => (
-    <div className="intro preserve-3d">
-      <Parallax image={large} blur />
-    </div>
-  );
-
   render() {
     if (isLoading(this.props.load_queue, ['spotify_browse/featured-playlists'])) {
       return (
@@ -64,9 +58,6 @@ class DiscoverFeatured extends React.Component {
       }
     }
 
-    // Pull the first playlist out and we'll use this for the parallax artwork
-    const first_playlist = playlists[0];
-
     const options = (
       <a className="button button--no-hover" onClick={(e) => { this.props.uiActions.hideContextMenu(); this.props.spotifyActions.getFeaturedPlaylists(); }}>
         <Icon name="refresh" />
@@ -76,11 +67,10 @@ Refresh
 
     return (
       <div className="view discover-featured-view preserve-3d">
-        <Header className="overlay" options={options}>
+        <Header options={options}>
           <Icon name="star" type="material" />
 					Featured playlists
         </Header>
-        {this.renderIntro(first_playlist)}
         <section className="content-wrapper grid-wrapper">
           {playlists ? <PlaylistGrid playlists={playlists} /> : null }
         </section>

src/js/views/discover/DiscoverNewReleases.js

@@ -76,12 +76,6 @@ class DiscoverNewReleases extends React.Component {
       }
     }
 
-    // Pull the first playlist out and we'll use this as a banner
-    let first_album = albums[0];
-    if (first_album) {
-      first_album = collate(first_album, { artists: this.props.artists });
-    }
-
     const options = (
       <a className="button button--no-hover" onClick={(e) => { this.props.uiActions.hideContextMenu(); this.props.spotifyActions.getNewReleases(); }}>
         <Icon name="refresh" />
@@ -91,11 +85,10 @@ Refresh
 
     return (
       <div className="view discover-new-releases-view preserve-3d">
-        <Header className="overlay" options={options} uiActions={this.props.uiActions}>
+        <Header options={options} uiActions={this.props.uiActions}>
           <Icon name="new_releases" type="material" />
 					New releases
         </Header>
-        {this.renderIntro(first_album)}
         <section className="content-wrapper grid-wrapper">
           <AlbumGrid albums={albums} />
         </section>