Hiding parallax from most views in light theme

src/js/views/Album.js

@@ -151,7 +151,7 @@ export class Album extends React.Component{
 		return (
 			<div className="view album-view content-wrapper preserve-3d">
 
-				<Parallax image={album.images ? album.images.huge : null} blur />
+				{this.props.theme == 'dark' && <Parallax image={album.images ? album.images.huge : null} blur />}
 
 				<div className="thumbnail-wrapper">
 					<Thumbnail size="large" canZoom images={album.images} />
@@ -205,6 +205,7 @@ const mapStateToProps = (state, ownProps) => {
 	return {
 		uri: uri,
 		slim_mode: state.ui.slim_mode,
+		theme: state.ui.theme,
 		load_queue: state.ui.load_queue,
 		tracks: state.core.tracks,
 		artists: state.core.artists,

src/js/views/Playlist.js

@@ -212,7 +212,7 @@ class Playlist extends React.Component{
 		return (
 			<div className="view playlist-view content-wrapper preserve-3d">
 
-				<Parallax image={playlist.images ? playlist.images.huge : null} blur />
+				{this.props.theme == 'dark' && <Parallax image={playlist.images ? playlist.images.huge : null} blur />}
 				
 				<div className="thumbnail-wrapper">
 					<Thumbnail size="large" canZoom images={playlist.images} />
@@ -271,6 +271,7 @@ const mapStateToProps = (state, ownProps) => {
 		uri: uri,
 		allow_reporting: state.ui.allow_reporting,
 		slim_mode: state.ui.slim_mode,
+		theme: state.ui.theme,
 		load_queue: state.ui.load_queue,
 		users: state.core.users,
 		tracks: state.core.tracks,

src/js/views/Queue.js

@@ -164,7 +164,7 @@ class Queue extends React.Component {
 					<Icon name="play_arrow" type="material" />
 					Now playing
 				</Header>
-				<Parallax blur image={current_track_image} />
+				{this.props.theme == 'dark' && <Parallax blur image={current_track_image} />}
 				<div className="content-wrapper">
 				
 					<div className="current-track">

src/js/views/discover/DiscoverFeatured.js

@@ -101,7 +101,7 @@ class DiscoverFeatured extends React.Component{
 					<Icon name="star" type="material" />
 					Featured playlists
 				</Header>
-				{this.renderIntro(first_playlist)}
+				{this.renderIntro(this.props.theme == 'dark' ? first_playlist : null)}
 				<section className="content-wrapper grid-wrapper">
 					{playlists ? <PlaylistGrid playlists={playlists} /> : null }
 				</section>

src/js/views/discover/DiscoverNewReleases.js

@@ -114,7 +114,7 @@ class DiscoverNewReleases extends React.Component{
 					<Icon name="new_releases" type="material" />
 					New releases
 				</Header>
-				{this.renderIntro(first_album)}
+				{this.renderIntro(this.props.theme == 'dark' ? first_album : null)}
 				<section className="content-wrapper grid-wrapper">
 					<AlbumGrid albums={albums} />
 				</section>
@@ -128,13 +128,6 @@ class DiscoverNewReleases extends React.Component{
 	}
 }
 
-
-/**
- * Export our component
- *
- * We also integrate our global store, using connect()
- **/
-
 const mapStateToProps = (state, ownProps) => {
 	return {
 		theme: state.ui.theme,

src/js/views/discover/DiscoverRecommendations.js

@@ -514,7 +514,7 @@ class Discover extends React.Component{
 			<div className="view discover-view preserve-3d">
 				<div className="intro preserve-3d">
 
-					<Parallax image="/iris/assets/backgrounds/discover.jpg" />
+					{this.props.theme == 'dark' && <Parallax image="/iris/assets/backgrounds/discover.jpg" />}
 
 					<div className="intro__liner">
 						<h1>Explore new music</h1>
@@ -547,13 +547,6 @@ class Discover extends React.Component{
 	}
 }
 
-
-/**
- * Export our component
- *
- * We also integrate our global store, using connect()
- **/
-
 const mapStateToProps = (state, ownProps) => {
 	return {
 		theme: state.ui.theme,

src/scss/components/_sidebar.scss

@@ -73,6 +73,10 @@
 			&--active {
 				background: colour(turquoise);
 				color: colour(white);
+	
+				.light-theme & {
+					color: colour(white);
+				}
 
 				.status {
 					.icon {

src/scss/global/_colours.scss

@@ -8,6 +8,7 @@ $colours: (
 	faint_grey: #f4f2f0,
 	light_grey: #cecac4,
 	mid_grey: #a3a19f,
+	soft_grey: #51504e,
 	grey: #383734,
 	dark_grey: #181818,
 	darkest_grey: #121212,

src/scss/global/_core.scss

@@ -195,7 +195,7 @@ h1 {
 	line-height: 3.4rem;
 
 	.light-theme & {
-		color: colour(dark_grey);
+		color: colour(grey);
 	}
 }
 

src/scss/views/_discover.scss

@@ -21,17 +21,6 @@
 				padding-bottom: 8px;
 				color: colour(mid_grey);
 			}
-
-			.light-theme & {
-				h1 {
-					color: colour(white);
-				}
-
-				h2 {
-					color: colour(white);
-					opacity: 0.75;
-				}
-			}
 		}
 
 		&__parameters {