1<#assign LayoutLocalServiceUtil = staticUtil["com.liferay.portal.kernel.service.LayoutLocalServiceUtil"]>
2<#assign javascript_folder = themeDisplay.getPathThemeJavaScript() />
3
4<#if entries?has_content>
5 <div id="siteMap" class="technologies">
6 <#list entries as curParentPage>
7 <#if curParentPage?is_first>
8 <#assign parentLayoutId = curParentPage.getParentLayoutId()>
9 <#assign groupId = themeDisplay.getScopeGroupId() />
10 <#assign parentLayout = LayoutLocalServiceUtil.getLayout(groupId, false, parentLayoutId) />
11
12 <div id="map" class="d-flex section-header flex-column flex-sm-row mb-2 px-3 px-md-0">
13 <div class="section-header__title flex-1">
14 <h1>${parentLayout.getName(locale)}</h1>
15 </div>
16 <div class="section-header__link flex-1 d-flex justify-content-start justify-content-md-end align-items-end align-items-sm-start">
17 <a href="${parentLayout.getFriendlyURL(locale)}" class="link arrow">
18 <#-- Visualizza tutte le ${parentLayout.getName()} -->
19 <#if themeDisplay.getLanguageId() == "it_IT">
20 Scopri di più
21 <#elseif themeDisplay.getLanguageId() == "fr_FR">
22 Découvrez plus
23 <#else>
24 View more
25 </#if>
26 </a>
27 </div>
28 </div>
29 </#if>
30 </#list>
31
32 <div class="list-pages-cards mt-5">
33 <#list entries as curPage>
34 <#assign icon = "" />
35 <#if curPage.getExpandoBridge().hasAttribute("Icona")>
36 <#assign icon = curPage.getExpandoBridge().getAttribute("Icona", false) />
37 </#if>
38 <#assign description = "" />
39 <#if curPage.getExpandoBridge().hasAttribute("Contenuto Card")>
40 <#assign description = curPage.getExpandoBridge().getAttribute("Contenuto Card", false) />
41 </#if>
42 <#if curPage.getIconImage() == true>${curPage.getIconImageId()}</#if>
43 <a class="card w-100 p-3 pt-4 d-flex flex-column" href="${curPage.getFriendlyURL(locale)}">
44 <div class="d-flex align-items-center">
45 <!-- i class="fas fa-database"></i -->
46 <img src="${icon}" />
47 <p class="card-title ml-4">${curPage.getName(locale)}</p>
48 </div>
49 <div class="card-content-list collapse" id="clps-${curPage_index}">${description}</div>
50 <!-- div class="list-pages-cards__show-all pl-4 mt-auto">Vedi tutti</div -->
51 </a>
52 </#list>
53 </div>
54
55 <style scoped>
56 .technologies .card-title {
57 font-size:20px;
58 line-height: 1.1;
59 }
60 .technologies .card {
61 border: 1px solid #d9d9d9;
62 box-shadow:none;
63 text-decoration: none;
64 margin-bottom: 1.85rem;
65 }
66 .technologies .card:hover {
67 border-color: #348c7c;
68 }
69 .technologies .card:hover .card-title {
70 color: #348c7c;
71 }
72 .technologies .fas {
73 font-size:35px;
74 color: #d7dad9;
75 }
76 .technologies .btn-primary:focus,
77 .technologies .btn-primary.focus {
78 box-shadow: none;
79 }
80 /* tolto per allineralo col titolo*/
81 /*.technologies .list-pages-cards {
82 margin-left: -10px;
83 margin-right: -10px;
84 }*/
85
86 .technologies .list-pages-cards .card-content-list {
87 overflow: hidden;
88 }
89 #siteMap .collapse:not(.show) {
90 display: inline-block;
91 max-height: 160px;
92 transition: max-height 0.25s ease-out;
93 }
94 #siteMap .collapse.show {
95 max-height: 100%;
96 transition: max-height 0.25s ease-in;
97 }
98 .card-content-list ul {
99 padding-left: 16px;
100 margin-top: 25px;
101 }
102 .card-content-list ul li {
103 list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAE0lEQVQYV2M06an5z4ADMA4pSQDoUQ+lTy3MAQAAAABJRU5ErkJggg==");
104 }
105 .card-content-list ul li,
106 .card-content-list ul li a {
107 color: #000;
108 }
109 .list-pages-cards__show-all {
110 font-size: 1.14rem;
111 }
112 #siteMap .section-header .section-header__title {
113 border-bottom: 1px solid gray;
114 }
115 #siteMap .section-header .section-header__link {
116 border-bottom: 6px solid #348c7c;
117 font-weight: 600;
118 padding: 10px 0;
119 position: relative;
120 top: 5px;
121 }
122 #siteMap .section-header a.link {
123 font-size:18px;
124 text-decoration:none;
125 }
126 #siteMap .section-header a.link:hover {
127 text-decoration:underline;
128 }
129 #siteMap .section-header .arrow:after{
130 content: "\e900";
131 font-family: 'icomoon' !important;
132 speak: none;
133 font-style: normal;
134 font-weight: normal;
135 font-variant: normal;
136 text-transform: none;
137 line-height: 1;
138 -webkit-font-smoothing: antialiased;
139 -moz-osx-font-smoothing: grayscale;
140 margin-left: 12px;
141 font-size: 12px;
142 display:inline-block;
143 }
144 #siteMap .slick-dots li button:before {
145 width: 15px;
146 height: 15px;
147 }
148 #siteMap .slick-slide img {
149 max-height: 55px;
150 width: auto;
151 }
152
153 @media(max-width:768px){
154 #siteMap .section-header .section-header__link::after{
155 content:"";
156 display:block;
157 width: 20%;
158 position: absolute;
159 right: 0;
160 bottom: -6px;
161 height: 6px;
162 background: #348c7c;
163 }
164 #siteMap .section-header .section-header__link {
165 border-bottom: 1px solid gray;
166 padding-top: 0;
167 }
168 #siteMap .section-header .section-header__title {
169 border-bottom:0;
170 }
171 }
172
173 /** global **/
174 .flex-1 {
175 flex: 1;
176 }
177 #siteMap .fas-icon:after{
178 content:" \f061";
179 font-family:'Font Awesome 5 Free';
180 }
181 @media (max-width:450px){
182 .section-header__link.flex-1.d-flex.justify-content-end {
183 padding-top:40px;
184 padding-left:10px;
185 }
186 }
187
188 #siteMap .slick-dots li button:before {
189 content: "";
190 background: #d7dad9;
191 opacity: 1;
192 }
193 #siteMap .slick-dots li.slick-active button:before {
194 background: #348c7c;
195 opacity: 1;
196 }
197 #siteMap .slick-dots li {
198 margin: 0 6px;
199 }
200 #siteMap .slick-slide {
201 margin: 0 10px;
202 }
203 @media (max-width: 768px) {
204 #siteMap .slick-slide {
205 opacity: 0.6;
206 }
207 #siteMap .slick-slide.slick-current.slick-active.slick-center {
208 opacity: 1;
209 }
210 }
211 .technologies .btn-slick-left,
212 .technologies .btn-slick-right {
213 position: absolute;
214 top: 35%;
215 padding: 0.7rem 0.66rem;
216 }
217 .technologies .btn-slick-left {
218 left: -60px;
219 }
220 .technologies .btn-slick-right {
221 right: -60px;
222 }
223 .technologies .btn-slick-left i,
224 .technologies .btn-slick-right i {
225 font-size: 20px;
226 color: #FFF;
227 }
228 svg.rotateLeft {
229 width: 19px;
230 height: 19px;
231 transform: rotate(90deg);
232 }
233 svg.rotateRight {
234 width: 19px;
235 height: 19px;
236 transform: rotate(-90deg);
237 }
238 a.card {
239 outline: none;
240 border-radius: 0;
241 }
242 .card {
243 min-height: 300px;
244 }
245 .card-content-list ul li {
246 font-size: 1.14rem;
247 padding-left: 8px;
248 }
249 /** mostra il carousel solo quando è caricato al 100% **/
250 #siteMap .list-pages-cards {
251 display: none;
252 opacity: 0;
253 visibility: hidden;
254 transition: opacity 1s ease;
255 -webkit-transition: opacity 1s ease;
256 }
257 #siteMap .list-pages-cards.slick-initialized {
258 display: block;
259 visibility: visible;
260 opacity: 1;
261 }
262 </style>
263 </div>
264<script>
265$(document).ready( function(){
266 $.getScript("${javascript_folder}/slick.js", function() {
267 var $team_slider = $('.list-pages-cards');
268 var team_slider_settings = {
269 autoplay: false,
270 autoplaySpeed: 2000,
271 dots: true,
272 arrows: true,
273 prevArrow: '<button type="button" class="d-flex btn-slick-left btn btn-primary"><svg class="rotateLeft" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 41.91 16.18"><defs><style>.cls-1 {fill: white;}</style></defs><title>arrow-down-submenucolored</title><g id="Livello_2" data-name="Livello 2"><g id="Livello_1-2" data-name="Livello 1"><polygon class="cls-1" points="20.95 16.18 0 2.51 1.64 0 20.95 12.6 40.27 0 41.91 2.51 20.95 16.18"></polygon></g></g></svg></button>',
274 nextArrow: '<button type="button" class="d-flex btn-slick-right btn btn-primary"><svg class="rotateRight" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 41.91 16.18"><defs><style>.cls-1 {fill: white;}</style></defs><title>arrow-down-submenucolored</title><g id="Livello_2" data-name="Livello 2"><g id="Livello_1-2" data-name="Livello 1"><polygon class="cls-1" points="20.95 16.18 0 2.51 1.64 0 20.95 12.6 40.27 0 41.91 2.51 20.95 16.18"></polygon></g></g></svg></button>',
275 infinite: true,
276 slidesToShow: 4,
277 speed: 300,
278 responsive: [
279 {
280 breakpoint: 768,
281 settings: {
282 slidesToShow: 4,
283 }
284 },{
285 breakpoint: 655,
286 settings: {
287 slidesToShow: 1,
288 arrows: false,
289 centerPadding:'30px',
290 centerMode:true
291 }
292 }
293 ]
294 };
295
296 // Init Slider
297 $team_slider.slick(team_slider_settings);
298
299 // Reslick only if it's not slick()
300 $(window).on('resize', function() {
301 if (!$team_slider.hasClass('slick-initialized')) {
302 return $team_slider.slick(team_slider_settings);
303 }
304 });
305
306 $("#siteMap a.card").click(function(e) {
307 if($(e.target).is('.list-pages-cards__show-all')){
308 e.preventDefault();
309 return;
310 }
311 });
312 });
313});
314</script>
315
316</#if>
317
318
319<#-- if entries?has_content>
320<h3>Tuitolo</h3>
321 <@liferay_aui.row>
322 <#list entries as entry>
323 <#if layoutPermission.containsWithoutViewableGroup(permissionChecker, entry, "VIEW")>
324 <@liferay_aui.col width=25>
325 <div class="results-header">
326 <h3>
327 <a
328
329 <#assign layoutType = entry.getLayoutType() />
330
331 <#if layoutType.isBrowsable()>
332 href="${portalUtil.getLayoutURL(entry, themeDisplay)}"
333 </#if>
334
335 >${entry.getName(locale)}</a>
336 </h3>
337 </div>
338
339 <@displayPages
340 pages=entry.getChildren(permissionChecker)
341 />
342 </@liferay_aui.col>
343 </#if>
344 </#list>
345 </@liferay_aui.row>
346</#if>
347
348<#macro displayPages
349 pages
350>
351 <#if pages?has_content>
352 <ul class="child-pages">
353 <#list pages as page>
354 <li>
355 <a
356
357 <#assign pageType = page.getLayoutType() />
358
359 <#if pageType.isBrowsable()>
360 href="${portalUtil.getLayoutURL(page, themeDisplay)}"
361 </#if>
362
363 >${page.getName(locale)}</a>
364
365 <@displayPages
366 pages=page.getChildren(permissionChecker)
367 />
368 </li>
369 </#list>
370 </ul>
371 </#if>
372</#macro -->