{% extends "blog/blog.js" %}

{% block content %}
	<div class="layout-wrapper layout-wrapper-background">
		<div class="web-content" id="blog-{{ name }}">

			<div class="layout-main-section">
				<h2>{{ title }}</h2>
				<div class="help">By {{ full_name }} on {{ updated }}</div>
				<br>
				{{ content_html }}
				<hr>
				<h3>Comments</h3><br>
				<div class="blog-comments">
					<div class="no-result help hide">
						<p>Be the first one to comment</p>
						<br />
					</div>

					{% include 'blog/comment.html' %}

					<button class="btn add-comment">Add Comment</button>
				</div>
			</div>

			<div class="layout-side-section">
				<p><a href="blog.html">All Blogs</a></p>
				<br />
				<h4>Subscribe</h4>
				<p>
					<img src="images/feed.png" style="margin-right: 4px; margin-bottom: -4px">
					<a href="rss.xml" target="_blank">RSS Feed</a>
				</p>
				<br />
				<h4>Recent Posts</h4>
				<div class="recent-posts" style="min-height: 100px;"></div>
			</div>

			<div style="clear: both"></div>
		</div>
	</div>
{% endblock %}

{% block css %}
	<style>
		.comment-title {
			color:#777;
		}
		
		.comment-content {
			margin-left: 20px;
		}
		
/*		.comment-row {
			padding: 5px 0px;
		}
*/	</style>
	
{% endblock %}