Fixes for #23 and #24

src/js/views/library/LibraryAlbums.js

@@ -80,8 +80,8 @@ class LibraryAlbums extends React.Component{
 									<div className="detail">
 										<h3>{ album.name }</h3>
 										<h4><ArtistSentence className="grey-text" artists={album.artists} /></h4>
-										<TrackList tracks={album.tracks.items} />
 									</div>
+									<TrackList tracks={album.tracks.items} />
 								</div>
 							)
 						})

src/scss/components/_lists.scss

@@ -90,7 +90,7 @@
 
 
 		@include responsive( $bp_medium ){
-			padding: 7px 10px 7px 30px;
+			padding: 7px 10px 7px 20px;
 
 			.col {
 				&.name { width: 50%; }
@@ -105,7 +105,16 @@
 
 			.select-state {
 				top: 11px;
-				left: 10px;
+				left: 5px !important;
+			}
+			.play-state {
+				left: 5px;
+			}
+
+			&.playing.selected {
+				.play-state {
+					display: none;
+				}
 			}
 		}
 

src/scss/components/_player.scss

@@ -72,14 +72,15 @@
 			right: 0;
 			width: auto;
 			background: $dark_grey;
+			padding: 10px;
 
 			.controls {
 				position: absolute;
-				top: 10px;
-				left: 10px;
+				top: 5px;
+				left: 5px;
 
 				a {
-					padding: 13px;
+					padding: 12px;
 				}
 
 				.volume-control {
@@ -103,7 +104,8 @@
 
 			.current-track {
 				font-size: 12px;
-				padding-bottom: 0;
+				padding: 0 20px 0 70px;
+				line-height: 14px;
 			}
 		}
 	}

src/scss/components/_sidebar-toggle-button.scss

@@ -4,7 +4,7 @@
 	position: absolute;
 	top: 0;
 	left: 0;
-	padding: 20px;
+	padding: 18px;
 	z-index: 98;
 	color: #FFFFFF;
 	font-size: 18px;

src/scss/views/_library.scss

@@ -21,5 +21,55 @@
 				padding: 0 0 10px 40px;
 			}
 		}
+
+		.track-list {			
+			padding-left: 220px;
+		}
+	}
+
+	@include responsive( $bp_wide ){
+
+		.albums-detail-subview > .album {
+			.thumbnail {
+				max-width: 160px;
+			}
+
+			.detail,
+			.track-list {
+				padding-left: 160px;
+			}
+		}
+	}
+
+	@include responsive( 600px ){
+		
+		.albums-detail-subview {
+			padding: 20px 0;
+		}
+		
+		.albums-detail-subview > .album {
+			.thumbnail {
+				max-width: 60px;
+				margin-left: 20px;
+			}
+
+			.detail {
+				padding-left: 80px;
+				min-height: 70px;
+
+				h3 {
+					padding-left: 10px;
+					padding-top: 8px;
+				}
+
+				h4 {
+					padding-left: 10px;
+				}
+			}
+
+			.track-list {
+				padding-left: 0px;
+			}
+		}
 	}
 }