{% extends "app/website/templates/html/page.html" %}

{% block javascript %}
	{% include "app/website/templates/js/blog.js" %}
{% endblock %}

{% block css %}
	{% include "app/website/templates/css/blog.css" %}
{% endblock %}

{% set title="Blog" %}

{% block content %}
<div class="col col-lg-12">
	<h2 id="blog-title">{{ blog_title }}</h2>
	{% if blog_introduction %}
	<p>{{ blog_introduction }}</p>
	{% endif %}
	<h3 id="blot-subtitle" style="display:none;"></h3>
	<br>
	<div class="progress progress-striped active">
		<div class="progress-bar progress-bar-info" style="width: 100%;"></div>
	</div>
	<div id="blog-list">
		<!-- blog list will be generated dynamically -->
	</div>
	<div style="text-align: center;">
		<button id="next-page" class="btn btn-default" 
			style="display:none;">More...</button>
	</div>
</div>
{% include 'app/website/templates/html/blog_footer.html' %}
{% endblock %}