Album view

src/scss/app.scss

@@ -16,4 +16,5 @@
 @import 'components/header';
 
 @import 'views/artist';
+@import 'views/album';
 

src/scss/global/_core.scss

@@ -13,9 +13,14 @@ body {
 	overflow-x: hidden;
 }
 
-main {
+main,
+footer {
+	margin-left: 200px;
+}
 
-	padding-left: 200px;
+main {
+	position: relative;
+	min-height: 100vh;
 
 	a {
 		color: inherit;
@@ -32,8 +37,8 @@ main {
 	}
 
 	h1 {
-		font-weight: 100;
-		font-size: 26px;
+		font-weight: 500;
+		font-size: 40px;
 	}
 
 	h3 {
@@ -99,4 +104,12 @@ main {
 
 .grey-text {
 	color: $mid_grey;
+}
+
+footer {
+	display: block;
+	color: $light_grey;
+	padding-top: 50px;
+	padding-bottom: 50px;
+	text-align: center;
 }

src/scss/views/_album.scss

@@ -0,0 +1,24 @@
+
+.album-view {
+	.intro {
+		position: absolute;
+		top: 0;
+		left: 0;
+		bottom: 0;
+		width: 300px;
+		background: $light_grey;
+
+		.thumbnail {
+			float: none;
+			margin: 0 auto;
+		}
+
+		h1 {
+			padding-top: 30px;
+		}
+	}
+
+	.main {
+		padding-left: 300px;
+	}
+}

src/scss/views/_artist.scss

@@ -2,13 +2,18 @@
 .artist-view {
 	.intro {
 		position: relative;
-		margin-bottom: 20px;
+		margin: -100px 0 20px 0;
 		@include clearfix;
 
 		.thumbnail {
 			max-width: 200px;
-			margin: -100px 20px 0 40px;
+			margin: 0 20px 0 40px;
 			float: left;
 		}
+
+		h1 {
+			color: #FFFFFF;
+			padding-top: 30px;
+		}
 	}
 }

src/scss/views/_playlist.scss

@@ -0,0 +1,30 @@
+
+.album-view {
+	.intro {
+		@include clearfix;
+		position: relative;
+		text-align: center;
+		color: #FFFFFF;
+		padding: 20px;
+		height: 40vh;
+		z-index: 2;
+
+		.parallax {
+			position: absolute;
+			top: 0;
+			left: 0;
+			height: 100%;
+			z-index: -1;
+		}
+
+		.thumbnail {
+			float: none;
+			margin: 0 auto;
+			max-width: 160px;
+		}
+
+		h1 {
+			padding-top: 30px;
+		}
+	}
+}