From eeba87d3337e4ce45a2664ec7087f03fa54c3f16 Mon Sep 17 00:00:00 2001
From: Pablo Vazquez <venomgfx@gmail.com>
Date: Thu, 23 Nov 2017 16:20:29 +0100
Subject: [PATCH] Blog: Unify the looks of blog posts

Now that the render_blog_post macro is shared with the homepage
---
 pillar/web/nodes/custom/posts.py            |  1 +
 src/styles/blog.sass                        | 16 ++++-----
 src/templates/nodes/custom/blog/_macros.pug | 36 ++++++++++++---------
 src/templates/nodes/custom/blog/index.pug   |  2 +-
 4 files changed, 28 insertions(+), 27 deletions(-)

diff --git a/pillar/web/nodes/custom/posts.py b/pillar/web/nodes/custom/posts.py
index 473c5d52..db588711 100644
--- a/pillar/web/nodes/custom/posts.py
+++ b/pillar/web/nodes/custom/posts.py
@@ -59,6 +59,7 @@ def posts_view(project_id=None, project_url=None, url=None, *, archive=False, pa
 
     for post in posts._items:
         post.picture = get_file(post.picture, api=api)
+        post.url = url_for_node(node=post)
 
     # Use the *_main_project.html template for the main blog
     is_main_project = project_id == current_app.config['MAIN_PROJECT_ID']
diff --git a/src/styles/blog.sass b/src/styles/blog.sass
index 06799b31..05fc1ec3 100644
--- a/src/styles/blog.sass
+++ b/src/styles/blog.sass
@@ -239,22 +239,18 @@
 			font:
 				family: $font-body
 				size: 1.8em
-			padding-bottom: 10px
-			padding-top: 20px
 
-		.item-info
-			color: $color-text-dark-secondary
-			font-size: 1em
+			padding: 10px 25px 10px
 
-			a
-				color: $color-text-dark-secondary
-				&:hover
-					color: $color-primary
+		ul.meta
+			+list-meta
+			font-size: .9em
+			padding: 15px 25px 5px
 
 		.item-content
 			+node-details-description
-			padding: 35px 25px
 			font-size: 1.3em
+			padding: 15px 25px 25px
 
 			+media-xs
 				padding:
diff --git a/src/templates/nodes/custom/blog/_macros.pug b/src/templates/nodes/custom/blog/_macros.pug
index 2e775f45..78f585cc 100644
--- a/src/templates/nodes/custom/blog/_macros.pug
+++ b/src/templates/nodes/custom/blog/_macros.pug
@@ -1,24 +1,28 @@
 //- ******************************************************* -//
 | {% macro render_blog_post(node) %}
 | {% if node.picture %}
-a.blog_index-header(href="{{ url_for_node(node=node) }}")
+a.blog_index-header(href="{{ node.url }}")
 	img(src="{{ node.picture.thumbnail('l', api=api) }}")
 | {% endif %}
 
 .blog_index-item
-	a.item-title(
-		href="{{ url_for_node(node=node) }}")
-		| {{node.name}}
+	ul.meta
+		| {% if node.project.name %}
+		li {{ node.project.name }}
+		| {% endif %}
 
-	.item-info.
-		#[span(title="{{node._created}}") {{node._created | pretty_date }}]
-		{% if node._created != node._updated %}
-		#[span(title="{{node._updated}}") (updated {{node._updated | pretty_date }})]
-		{% endif %}
-		{% if node.properties.category %}| {{node.properties.category}}{% endif %}
-		· {{node.user.full_name}}
-		· #[a(href="{{ url_for_node(node=node) }}#comments") comment]
-		{% if node.properties.status != 'published' %} | {{ node.properties.status}} {% endif %}
+		li.when
+			a(href="{{ node.url }}",
+				title="Updated {{ node._updated | pretty_date }}")
+				| {{ node._created | pretty_date }}
+
+		li
+			a(href="{{ node.url }}#comments")
+				| comment
+
+	a.item-title(
+		href="{{ node.url }}")
+		| {{ node.name }}
 
 	.item-content
 		| {{ node.properties.content }}
@@ -30,15 +34,15 @@ a.blog_index-header(href="{{ url_for_node(node=node) }}")
 .blog_index-item.list
 
 	| {% if node.picture %}
-	a.item-header(href="{{ url_for_node(node=node) }}")
+	a.item-header(href="{{ node.url }}")
 		img.image(src="{{ node.picture.thumbnail('s', api=api) }}")
 	| {% else %}
-	a.item-header.nothumb(href="{{ url_for_node(node=node) }}")
+	a.item-header.nothumb(href="{{ node.url }}")
 		i.pi-document-text
 	| {% endif %}
 
 	a.item-title(
-		href="{{ url_for_node(node=node) }}")
+		href="{{ node.url }}")
 		| {{node.name}}
 
 	.item-info.
diff --git a/src/templates/nodes/custom/blog/index.pug b/src/templates/nodes/custom/blog/index.pug
index 946bb9c6..71c8dccc 100644
--- a/src/templates/nodes/custom/blog/index.pug
+++ b/src/templates/nodes/custom/blog/index.pug
@@ -29,7 +29,7 @@ link(href="{{ url_for('static_pillar', filename='assets/css/blog.css', v=1732017
 		| {% for post in posts %}
 		li.jstree-node
 			a.jstree-anchor.tree-item.post(
-				href="{{ url_for_node(node=post) }}")
+				href="{{ node.url }}")
 				.tree-item-thumbnail
 					| {% if post.picture %}
 					img(src="{{ post.picture.thumbnail('s', api=api) }}")