{% set config = repository('Plugin\\CMBlogPro42\\Entity\\Config').get() %}
{% set blogs = repository('Plugin\\CMBlogPro42\\Entity\\Blog').getList() %}
{% set categoryLisst = repository('Plugin\\CMBlogPro42\\Entity\\Category').getFrontCategoryList() %}
{% block javascript %}
<script>
$(function(){
$(".ak-news_header li").on("click",function(){
console.log($(this).attr("id"));
$(".ak-news_header li").removeClass("active");
$(this).addClass("active");
clikcId = $(this).attr("id");
$(".ak-news_body").removeClass("active");
$("." + clikcId ).addClass("active");
})
$("#headlint").addClass("active");
$(".headlint").addClass("active");
})
</script>
{% endblock %}
{% block stylesheet %}
<style>
/* style by mark */
.ak-news_header{
display:flex;
}
#cm_blog_plugin .ak-news_header .active{
background-color:#1F1F1F
}
.ak-news_header h3{
font-size:14px;
margin:0;
padding:0.5em;
}
.ec-shelfRole{
background-color:#000;
}
#cm_blog_plugin .ak-news_body{
display:none;
padding:1em;
}
.ak-news_body li{
padding:0.5em;
font-size:14px;
display:flex;
flex-wrap: wrap;
position:relative;
}
.ak-news_body li span{
display:inline-block;
width:6em;
}
.ak-news_body li a{
width:calc(100% - 6em );
}
#cm_blog_plugin .ak-news_body.active{
display:block;
background-color:#1F1F1F;
}
/*
#cm_blog_plugin{
position: absolute;
bottom:50px;
right:0;
padding:0;
max-width:700px;
z-index:500;
}
*/
#newsList{
position:relative;
}
#newsList::before{
content : "";
display:block;
width:100%;
padding-bottom:40%;
/* background-color:#F00;*/
}
#cm_blog_plugin{
position: relative;
bottom:40px;
right:0;
padding:0;
max-width:700px;
z-index:500;
margin-left:auto;
}
#cm_blog_plugin .ec-shelfRole,
#cm_blog_plugin .ec-role,
#cm_blog_plugin .ec-shelfRole{
margin:0;
padding:0;
}
#cm_blog_plugin ul.ak-news_header li.newsTitle{
padding:15px 110px 15px 15px;
}
#cm_blog_plugin ul.ak-news_header li{
padding:21px 15px 15px 15px;
}
#cm_blog_plugin ul.ak-news_header li.newsTitle h3{
font-size:26px;
padding:0;
}
#cm_blog_plugin ul.ak-news_header li.newsTitle h3::before{
content:none;
}
#cm_blog_plugin ul.ak-news_header li h3{
padding: 0 0 0 1em;
position: relative;
line-height:0.5;
}
#cm_blog_plugin ul.ak-news_header li h3::before {
position: absolute;
content: "";
color: #fff;
background-color: #fff;
width: 0.5em;
height: 2px;
top: 0.2em;
left: 0;
}
.ak-news_body a{
position:relative;
}
.ak-news_body .new::before{
content: "NEW";
background-color:#c60a1c;
padding:0.3em;
margin:0 0.5em 0 0;
border-radius:0.3em;
font-size:10px;
}
@media (max-width: 1023px){
#newsList{
padding:0 20px;
margin: 50px 0 0 0;
}
#newsList::before{
content:none;
}
#cm_blog_plugin{
position: static;
bottom:0;
right:0;
padding:0;
max-width:none;
width:100%;
z-index:0;
margin-left:0;
}
#cm_blog_plugin ul.ak-news_header li.newsTitle{
padding:15px 15px 15px 15px;
flex-basis:100%;
}
.ak-news_header{
display:flex;
flex-wrap:wrap;
justify-content:space-between;
}
}
@media (max-width: 576px){
#cm_blog_plugin ul.ak-news_header li h3{
padding:0;
}
#cm_blog_plugin ul.ak-news_header li h3::before{
content:none;
}
#cm_blog_plugin ul.ak-news_header li#campaign{
flex-basis:49%;
}
#cm_blog_plugin ul.ak-news_header li{
padding:1em 0;
flex-basis: 17%;
}
#newsList h3{}
}
</style>
{% endblock %}
{% if blogs is defined and blogs|length > 0 %}
<div id="newsList">
<div id="cm_blog_plugin" class="ec-categoryRole ">
<div class="ec-role">
<div class="ec-shelfRole">
<ul class="ak-news_header">
<li id="headlint" class="newsTitle"><h3 class="ec-secHeading__en">{{config.getTitleEn}}</h3></li>
{% for i in [3,1,2,0] %}
<li id = "{{categoryLisst[i].class}}"><h3>{{ categoryLisst[i].getName() }}</h3></li>
{% endfor %}
</ul>
<ul class="ak-news_body headlint" >
{% set getHeadLine = repository('Plugin\\CMBlogPro42\\Entity\\Blog').getHeadLine(is_granted('ROLE_USER')) %}
{% for blog in getHeadLine %}
<li>
{# blog #}
<span class="news_release_date">{{ blog.release_date|date_day }}</span>
{% if blog.linkurl != null %}
{% if blog.release_date != null and blog.release_date|date('Y-m-d') > 'now'|date_modify('-1 month')|date('Y-m-d') %}
<a class="news_title new" href="{{ blog.linkurl }}" target="_blank">
{% else %}
<a class="news_title" href="{{ blog.linkurl }}" target="_blank">
{% endif %}
{# blog.getTitle|length > 45 ? blog.getTitle|striptags|replace({(' '):' '})|slice(0, 45)|raw ~ '...' : blog.getTitle|raw #}
{{ blog.getTitle|raw }}
</a>
{% else %}
{% if blog.release_date != null and blog.release_date|date('Y-m-d') > 'now'|date_modify('-1 month')|date('Y-m-d') %}
<a class="news_title new" href="{{ url('cm_blog_page_detail', {'id': blog.id}) }}">
{% else %}
<a class="news_title" href="{{ url('cm_blog_page_detail', {'id': blog.id}) }}">
{% endif %}
{# blog.getTitle|length > 45 ? blog.getTitle|striptags|replace({(' '):' '})|slice(0, 45)|raw ~ '...' : blog.getTitle|raw #}
{{ blog.getTitle|raw }}
</a>
{% endif %}
</li>
{% endfor %}
</ul>
{% for categoryVal in categoryLisst %}
{% set categoryValId = categoryVal.getId() %}
<ul class="ak-news_body {{categoryVal.class}}">
{% set news = repository('Plugin\\CMBlogPro42\\Entity\\Blog').getListTop(categoryValId,is_granted('ROLE_USER')) %}
{% for blog in news %}
{% for category in blog.getBlogCategories %}
{% if category.getCategory().getId() == categoryValId %}
{# dump(blog.release_date) #}
<li>
<span class="news_release_date">{{ blog.release_date|date_day }}</span>
{% if blog.linkurl != null %}
{% if blog.release_date != null and blog.release_date|date('Y-m-d') > 'now'|date_modify('-1 month')|date('Y-m-d') %}
<a class="news_title new" href="{{ blog.linkurl }}" target="_blank">
{% else %}
<a class="news_title" href="{{ blog.linkurl }}" target="_blank">
{% endif %}
{# blog.getTitle|length > 45 ? blog.getTitle|striptags|replace({(' '):' '})|slice(0, 45)|raw ~ '...' : blog.getTitle|raw #}
{{ blog.getTitle|raw }}
</a>
{% else %}
{% if blog.release_date != null and blog.release_date|date('Y-m-d') > 'now'|date_modify('-1 month')|date('Y-m-d') %}
<a class="news_title new" href="{{ url('cm_blog_page_detail', {'id': blog.id}) }}">
{% else %}
<a class="news_title" href="{{ url('cm_blog_page_detail', {'id': blog.id}) }}">
{% endif %}
{# blog.getTitle|length > 45 ? blog.getTitle|striptags|replace({(' '):' '})|slice(0, 45)|raw ~ '...' : blog.getTitle|raw #}
{{ blog.getTitle|raw }}
</a>
{% endif %}
</li>
{% endif %}
{% endfor %}
{% endfor %}
</ul>
{% endfor %}
</div>
</div>
</div>
</div>
{% endif %}