1<div class="align-items-center d-flex flex-column mt-lg-n5" id="box-jaen-experiencia">
2 <div class="contenedor-slider col-12">
3 <div class="container on js-slider" id="jaen-experiencias">
4 <div class="row">
5 <div id="carrouseHorizontalAux3" class="carousel slide carrousel-horizontal mt-0" data-ride="carousel">
6
7 <#if entries?has_content>
8 <div class="carousel-inner -viewPublicador">
9 <div class="carousel-item active">
10 <#assign count = 0/>
11 <#list entries as curEntry>
12 <#if (count % 4 == 0 && count > 0)>
13 </div>
14 <div class="carousel-item">
15 </#if>
16 <#assign count = count + 1/>
17 <#assign assetRenderer = curEntry.getAssetRenderer()/>
18 <#assign journalArticle = assetRenderer.getAssetObject()/>
19 <#assign renderer=curEntry.getAssetRenderer() />
20 <#assign className=renderer.getClassName() />
21 <#assign link=renderer.getURLViewInContext(renderRequest, renderResponse, '' ) />
22 <#if contentDisplayPageURL??>
23 <#assign link=contentDisplayPageURL + journalArticle.getUrlTitle() />
24 <#assign link=link + "?redirect=" + portalUtil.getCurrentURL(renderRequest) />
25 </#if>
26
27 <a href="${link}" class="col-3" ${curEntry?index}>
28 <@liferay_journal["journal-article"] articleId=journalArticle.getArticleId() ddmTemplateKey="188405" groupId=journalArticle.getGroupId()/>
29 </a>
30 </#list>
31 </div>
32 </div>
33 </#if>
34 <!-- second slider -->
35
36
37 </div>
38
39 <#if (count gt 4)>
40 <a class="carousel-control-prev carrousel-horizontal-prev" href="#carrouseHorizontalAux3" role="button" data-slide="prev">
41 <span class="carousel-control-prev-icon" aria-hidden="true"></span>
42 <span class="sr-only">Previous</span>
43 </a>
44 <a class="carousel-control-next carrousel-horizontal-next" href="#carrouseHorizontalAux3" role="button" data-slide="next">
45 <span class="carousel-control-next-icon" aria-hidden="true"></span>
46 <span class="sr-only">Next</span>
47 </a>
48 </#if>
49
50 </div>
51
52 </div>
53
54 </div>
55
56 </div>
57
58</div>
59<style>
60@media screen and (max-width:900px){
61 .carousel-inner.-viewPublicador{
62 overflow-x:scroll;
63 }
64 .carousel-item a:last-of-type {
65 display: block;
66 }
67 .carousel-item.active{
68 width:145%
69 }
70}
71@media screen and (max-width: 640px){
72 .carousel-item a.col-3, .carousel-item.active a.col-3 {
73 flex: 0 0 86%;
74 }
75 .carousel-item.active{
76 width:100%
77 }
78}
79</style>
