Blog: Styling and cleanup

src/styles/_apps_base.sass

@@ -403,7 +403,6 @@ nav.sidebar
 $loader-bar-width: 100px
 $loader-bar-height: 2px
 .loader-bar
-	background-color: $color-background
 	bottom: 0
 	content: ''
 	display: none

src/styles/_comments.sass

@@ -1,6 +1,7 @@
 $comments-width-max: 710px
 
 .comments-container
+	max-width: $comments-width-max
 	position: relative
 
 	#comments-reload
@@ -314,9 +315,6 @@ $comments-width-max: 710px
 					color: $color-success
 
 .comment-reply
-	&-container
-		background-color: $color-background
-
 	/* Little gravatar icon on the left */
 	&-avatar
 		img
@@ -333,7 +331,7 @@ $comments-width-max: 710px
 		width: 100%
 
 	&-field
-		background-color: $color-background-dark
+		background-color: $color-background-light
 		border-radius: 3px
 		box-shadow: inset 0 0 2px 0 rgba(darken($color-background-dark, 20%), .5)
 		display: flex
@@ -342,6 +340,7 @@ $comments-width-max: 710px
 
 		textarea
 			+node-details-description
+			background-color: $color-background-light
 			border-bottom-right-radius: 0
 			border-top-right-radius: 0
 			border: none
@@ -376,7 +375,6 @@ $comments-width-max: 710px
 
 		&.filled
 			textarea
-				background-color: $color-background-light
 				border-bottom: thin solid $color-background
 
 				&:focus

src/styles/_utils.sass

@@ -669,3 +669,15 @@
 
 .overflow-hidden
 	overflow: hidden
+
+=text-gradient($color_from, $color_to)
+		background: linear-gradient(to right, $color_from, $color_to)
+		background-clip: text
+		-webkit-background-clip: text
+		-webkit-text-fill-color: transparent
+
+=active-gradient
+	+text-gradient(#0cc, $primary)
+
+	&:before
+		+text-gradient(#0cc, $primary)

src/styles/blog.sass

@@ -482,29 +482,3 @@
 
 	.blog-archive-navigation
 		margin-left: 35px
-
-// Used on the blog.
-.comments-compact
-	.comments-list
-		border: none
-		padding: 0 0 15px 0
-
-	.comments-container
-		max-width: 680px
-		margin: 0 auto
-
-		.comment-reply-container
-			background-color: transparent
-
-			.comment-reply-field
-				textarea, .comment-reply-meta
-					background-color: $color-background-light
-
-				&.filled
-					.comment-reply-meta
-						background-color: $color-success
-
-		.comment-reply-form
-			+media-xs
-				padding:
-					left: 0

src/templates/nodes/custom/blog/archive.pug

@@ -1,8 +1,11 @@
 | {% extends 'nodes/custom/blog/index.html' %}
 | {% import 'nodes/custom/blog/_macros.html' as blogmacros %}
 
-| {% block project_context %}
+| {% block body %}
-#blog_container
+.container
-	#blog_index-container.expand-image-links
+	.pt-4
+		h2.text-uppercase.font-weight-bold
+			| Blog Archive
+
 	| {{ blogmacros.render_archive(project, posts, posts_meta) }}
-| {% endblock project_context%}
+| {% endblock body %}