{# templates/blog/index.html.twig #}
{% extends 'base.html.twig' %}

{% block title %}Blog{% endblock %}

{% block body %}
<section class="white-background">
    <div id="article" class="container">
        <br>
        <h1 id="page_title">Blog</h1>
        <br>
        <ul id="news_list" class="list-unstyled">
        </ul>
        <br>
    </div>
</div>
{% endblock %}

{% block javascripts %}
<script>
    document.title = 'Blog';
    var pageId = '4479498271459544099';
    var list='';
    blogger.loadPosts('blogposts',function(data) {
        data.items.forEach(function(currentValue, index){
            var content = currentValue.content.replace(/(<([^>]+)>)/ig,"");
            content = content.substr(0, 500);
            list+='<li><p class="lead"><a style="text-decoration: none;" href="/Blog/'+currentValue.id+'">'+currentValue.title+'<br><span style=\"color: #000;\">'+content+'...</span><br /><b><span style=\"font-size: 18px; color: #428bca; line-height: 40px;\">[ Read More ]</span></b></div></a><br /><br /></p></a></li>'
        });
        document.getElementById('news_list').innerHTML = list;
        $('body').fadeIn();
    });
</script>
{% endblock %}