{% extends app.request.get('project_setting').instance_theme_path~':'~ app.request.get('project_setting').instance_theme ~':themeBase.html.twig' %}
{% block bread_crumb_after_home %}
	<li> <strong>Blog</strong></li>
{% endblock bread_crumb_after_home %}
{% block main_content %}
<div class="container main">
	<div class="content-info-page about-us">
		<div class="innerpage">
			{# {% use 'OfficeBrainCustomBundleThemeBundle:IdmeTheme:BaseUIElements/breadCrumb.html.twig' %}
			{% block bread_crumb %} {{ parent() }} {% endblock bread_crumb %} #}
			{# <h1 class="main-title">
				<i class="fa fa-comment"></i>
				{% block page_title %}Blog{% endblock page_title %}
			</h1> #}
			<div class="catr-title">
				<h1 class="item-title product-cat-title">Our Blogs</h1>
			</div>	
			<div class="blog-wrapper">
				<div class="row">
					{% block blog_list_block %}
						{% for blogdetail in data.pagination.items %}
							{% set rating =0 %}
							{% for comment in blogdetail.comment %}
								{% if (comment.commentStatus == 1 and comment.commentIsDeleted != 1) %}
									{% set rating= rating+comment.commentRating %}
								{% endif %}
							{% endfor %}
							{% if blogdetail.comment|length>0 %}
								{% set avg_rating= rating/blogdetail.comment|length %}
							{% else %}
								{% set avg_rating=0 %}
							{% endif %}
							<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
								<div class="blog-col">
									<div class="image_container">
									<image src="{{asset('uploads/'~blogdetail.featureImage)}}" alt="{{blogdetail.featureImage}}" />
									</div>
									<div class="content_container">
									<div class="blog-title" style="min-height: 72px;">
									<h3>{{ blogdetail.postName }}</h3>
									</div>
									{#<ul>
										<li style="width:50%"><strong>Published At: </strong></li>
										<li style="width:50%">{{ blogdetail.publishedDate|dateTimeFormat(ob_project_date_format)  }}</li>
									</ul> #}
									<p>{{ blogdetail.shortContent|raw }} ...</p>
									<a class="read-more" href="{{ path('blog_show', {'slug': blogdetail.slug }) }}">Read More</a>
									</div>
									{# <a href="#"><div class="crfp-average-rating"><div class="crfp-rating crfp-rating-{{avg_rating|round}}"></div></div></a> #} 
								</div>
							</div>
						{% endfor %}
					{% endblock blog_list_block %}
				</div>
				<div class="row">
					<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="text-align: center;">
					{{ knp_pagination_render(data.pagination, 'OfficeBrainCoreBundle:Admin:adminPagination.html.twig') }}
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<style>
.blog-col h3 {
    font-size: 17px;
    color: #04517B;
    text-transform: none;
    font-weight: bold;
    border-bottom: 1px #ddd solid;
    padding-bottom: 5px;
    margin-bottom: 5px;
    line-height: 20px;
}
.blog-col p{
		font-size: 14px;
    color: #000000;
    line-height: 186%;
    padding: 5px 0 15px;
}
.catr-title h1 {
    font-size: 26px;
    font-weight: 900;
    text-align: left;
    margin-bottom: 0;
    line-height: normal;
    color: #0b3048;
}
.image_container{
	min-height : 200px;
	height: 200px;
  	border: 1px solid #e6e6e6;
  	margin-bottom: 25px;
}
.image_container img {
  width: 100%;
  height: 100%;
  /*object-fit: fill; */
  object-fit: cover;
}

.content_container{
	min-height : 185px;
	height: 185px;
  	margin-bottom: 25px;
}
</style>
{% endblock main_content %}