1<style>
2.acordion-bl5 button[aria-expanded="true"] a{
3 color:white;
4}
5.acordion-bl5 .collapsed a {
6 color: #42b4e3 !important;
7 text-decoration: none;
8}
9.acordion-bl5 .btn-link {
10 color: #42b4e3;
11 text-decoration: none;
12}
13
14.acordion-bl5 .btn-link:focus{
15 box-shadow: none;
16 text-decoration: none;
17 color:white;
18}
19.acordion-bl5 .btn-link:hover {
20 text-decoration: none;
21 color:white;
22}
23.pasos a:hover{
24 text-decoration:none;
25}
26::-webkit-scrollbar {
27 height: 9px;
28 width: 9px;
29 background: #e3e3e3;
30}
31
32::-webkit-scrollbar-thumb {
33 background: #42b4e3;
34 -webkit-border-radius: 1ex;
35 -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
36}
37
38::-webkit-scrollbar-corner {
39 background: #e3e3e3;
40}
41.pasos .nav-pills .nav-link.active
42{
43 background:none;
44 color:black;
45
46}
47.text-blue-pasos-iteso
48{
49 color:#42b4e3;
50}
51
52.bg-blue-iteso
53{
54 background:#004270;
55}
56.number-iteso
57{
58 border: 1px solid;
59 width: 40px;
60 height: 40px;
61
62}
63.btn-link:focus {
64 box-shadow: none;
65 text-decoration: none;
66}
67.card-header .collapsed{
68 color:#42b4e3;
69}
70.tab-content-bl5 *{
71 font-size: 20px;
72 font-style: normal;
73 line-height: 1.38;
74 color: #030a23;
75}
76.tab-content-bl5 * .table thead th{
77 border-bottom: 2px solid #42b4e3;
78}
79.tab-content-bl5 * .table th,.tab-content-bl5 * .table td {
80 border-bottom: 1px solid #42b4e3;
81 border-color: #42b4e3 !important;
82}
83.iframe-iteso{
84 margin-top:105px;
85 margin-bottom:72px;
86 margin-left:74px;
87 margin-right:74px;
88 padding-right: 3rem;
89 padding-left: 1rem;
90 font-family: 'Degular-Regular';
91 overflow-y: scroll;
92 /*height: 855px;*/
93 height: 100%;
94 overflow: hidden;
95 /*box-shadow:0 4px 10px -2px rgb(0 0 0 / 10%);*/
96}
97.iframe-iteso center iframe,
98.mobile-bl5-scroll center iframe {
99 width: 100%;
100}
101.lista-bl5{
102 font-size: 1.4em;
103}
104.detalle-colap-bl5{
105 margin-top:53px;
106 overflow-y: scroll;
107 height: 855px;
108 box-shadow:0 4px 10px -2px rgb(0 0 0 / 10%);
109}
110
111.acordion-bl5 .collapsed .number-iteso {
112 border: 1px solid #42b4e3;
113 color:#42b4e3;
114}
115.acordion-bl5 .collapsed .fa-plus-circle{
116 color:#42b4e3 !important;
117}
118.acordion-bl5 .fa-plus-circle{
119 color:white;
120}
121.acordion-bl5 .number-iteso {
122 border: 1px solid white;
123 color: white;
124}
125.acordion-bl5 .fa-plus-circle:before {
126 content: "\f056";
127 /*menos*/
128}
129
130.acordion-bl5 .collapsed .fa-plus-circle:before {
131 content: "\f055";
132 color: #42b4e3;
133 /*menos*/
134}
135.mobile-bl5-scroll{
136 overflow-y: scroll;
137 height: 400px;
138 padding-right: 30px;
139 font-family: 'Degular-Regular';
140}
141.mobile-bl5-scroll strong,
142.mobile-bl5-scroll strong a,
143.mobile-bl5-scroll ul li a{
144 /*color: #030a23;*/
145 color:black;
146}
147</style>
148<#assign JournalArticleLocalServiceUtil = serviceLocator.findService("com.liferay.journal.service.JournalArticleLocalService")/>
149<!-- custom Field -->
150<#assign basica = themeDisplay.getSiteGroup().getExpandoBridge().getAttribute("Basica")>
151<#assign Basica_Liga = themeDisplay.getSiteGroup().getExpandoBridge().getAttribute("Basica_Liga")>
152<!-- Fin custom Field -->
153<!-- Se obtienen lista de web content -->
154<#assign url_public = themeDisplay.getPathFriendlyURLPublic()>
155 <#if contenido1.getData()?has_content??>
156 <#if contenido1.getData()?has_content && contenido1.getData()?matches("[0-9]+") >
157 <#assign articles = []/>
158 <#assign article = JournalArticleLocalServiceUtil.getLatestArticle(contenido1.getData()?number)>
159 <#assign articles = articles + [article]/>
160 </#if>
161 </#if>
162 <#if contenido2.getSiblings()?has_content>
163 <#list contenido2.getSiblings() as cur_contenido2>
164 <#if cur_contenido2.getData()?has_content>
165 <#assign article2 = JournalArticleLocalServiceUtil.getLatestArticle(cur_contenido2.getData()?number)>
166 <#assign articles = articles + [article2]/>
167 </#if>
168 </#list>
169 </#if>
170<!-- Fin de lista de web content -->
171<!-- Funcion para obtener icono -->
172<#function activarIcon contador isMobile>
173 <#attempt>
174 <#if isMobile == true>
175 <#if getterUtil.getBoolean(icono.getData())>
176 <#return "<div><p class='number-iteso rounded-circle mr-3 mb-0 d-flex justify-content-center align-items-center'><i class='fas ${icono.selectIcon.getData()}'></i></p></div>">
177 <#else>
178 <#return "<div><p class='number-iteso rounded-circle mr-3 mb-0 d-flex justify-content-center align-items-center'>${contador}</p></div>">
179 </#if>
180 <#else>
181 <#if getterUtil.getBoolean(icono.getData())>
182 <#return "<div><p class='number-iteso rounded-circle d-flex justify-content-center align-items-center'><i class='fas ${icono.selectIcon.getData()}' style='font-size: 1.2em;'></i></p></div>">
183 <#else>
184 <#return "<div><p class='number-iteso rounded-circle d-flex justify-content-center align-items-center'>${contador}</p></div>">
185 </#if>
186 </#if>
187 <#recover>
188 Fallo en la funcion activarIcon.
189 </#attempt>
190</#function>
191<!-- Fin funcion para obtener icono -->
192<section class="container-fluid pasos d-none d-lg-block" style="background-color: #eaecf0;">
193 <section class="py-7 container-it">
194 <section class="row">
195 <div class="col-md-12 col-lg-5 bg-blue-iteso degular-bold">
196 <section class="row justify-content-center">
197 <article class="col-10">
198 <div class="nav flex-column nav-pills mb-4 pb-2" id="v-pills-tab" role="tablist" aria-orientation="vertical">
199 <h4 class="text-white text-left" style="font-size: 2.813em;margin-top: 93px;margin-bottom: 75px;">${titulobl5.getData()}</h4>
200 <#assign x = 0>
201 <#if articles?has_content>
202 <#list articles as cur_artlist>
203 <#assign x ++>
204 <#assign documentlist = saxReaderUtil.read(cur_artlist.getContentByLocale(request.locale)) />
205 <#assign rootlist = documentlist.getRootElement()>
206 <#assign titulo = rootlist.selectSingleNode("dynamic-element[@name='titulo']/dynamic-content").getText()/>
207 <!------------------------------basica liga--------------->
208 <#if cur_artlist.getStructureId() == Basica_Liga >
209 <#assign link = rootlist.selectSingleNode("dynamic-element[@name='link']/dynamic-content").getText()/>
210 <#assign linkjson = jsonFactoryUtil.createJSONObject(link)>
211 <#assign url = rootlist.selectSingleNode("dynamic-element[@name='url']/dynamic-content").getText()/>
212 <!---------- Validación de la liga ----------->
213 <#if link != "">
214 <#assign linkid = link?split("@")>
215 <#assign groupUtil = serviceLocator.findService('com.liferay.portal.kernel.service.GroupLocalService')>
216 <#assign group = groupUtil.getGroup(cur_artlist.getGroupId())>
217 <#assign groupFriendly = group.getFriendlyURL()>
218 <#assign layoutService = serviceLocator.findService("com.liferay.portal.kernel.service.LayoutLocalService")>
219 <#assign layout = layoutService.getLayout(linkjson.getLong("groupId") , linkjson.getBoolean("privateLayout"),linkjson.getLong("layoutId"))>
220 <#assign layoutFriendly = layout.getFriendlyURL()>
221 <#assign link_page = "${url_public}${groupFriendly}${layoutFriendly}">
222 <!---------- Contruccion url con idenficador ----------->
223 <a href="${link_page}">
224 <section class="d-flex justify-content-start align-items-center text-blue-pasos-iteso">
225 <article class="mr-3">
226 <!---------- Se obtine la funcion del icono ----------->
227 ${activarIcon(x, false)}
228 </article>
229 <article>
230 <!---------- Titulo de la lista ----------->
231 <p class="lista-bl5" >${titulo}</p>
232 <!---------- Fin de titulo de la lista ----------->
233 </article>
234 </section>
235 </a>
236 <!---------- Fin contruccion url con idenficador ----------->
237 <#else>
238 <#assign link_page = url>
239 <!---------- Validacion de url con identificador de estructura ----------->
240 <a href="${url}">
241 <section class="mb-3 d-flex justify-content-start align-items-center text-blue-pasos-iteso">
242 <article class="mr-3">
243 <!---------- Se obtine la funcion del icono ----------->
244 ${activarIcon(x, false)}
245 </article>
246 <article>
247 <!---------- Titulo de la lista ----------->
248 <p class="lista-bl5">${titulo}</p>
249 <!---------- Fin de titulo de la lista ----------->
250 </article>
251 </section>
252 </a>
253 <!---------- Fin de validacion de url con identificador de estructura ----------->
254 </#if>
255 <!---------- Fin de validación de la liga ----------->
256 <#else>
257 <!------------------------------FIN basica liga--------------->
258 <#if x==1>
259 <a class="nav-link p-0 active" id="v-pills-${x}-tab" data-toggle="pill" href="#v-pills-${x}" role="tab" aria-controls="v-pills-${x}" aria-selected="true">
260 <section class="mb-3 d-flex justify-content-start align-items-center text-blue-pasos-iteso">
261 <article class="mr-3">
262 <!---------- Se obtine la funcion del icono ----------->
263 ${activarIcon(x, false)}
264 </article>
265 <article>
266 <!---------- Titulo de la lista ----------->
267 <p class="lista-bl5">${titulo}</p>
268 <!---------- Fin de titulo de la lista ----------->
269 </article>
270 </section>
271 </a>
272 <#else>
273 <a class="nav-link p-0" id="v-pills-${x}-tab" data-toggle="pill" href="#v-pills-${x}" role="tab" aria-controls="v-pills-${x}" aria-selected="false">
274 <section class="mb-3 d-flex justify-content-start align-items-center text-blue-pasos-iteso">
275 <article class="mr-3">
276 <!---------- Se obtine la funcion del icono ----------->
277 ${activarIcon(x, false)}
278 </article>
279 <article>
280 <!---------- Titulo de la lista ----------->
281 <p class="lista-bl5">${titulo}</p>
282 <!---------- Fin de titulo de la lista ----------->
283 </article>
284 </section>
285 </a>
286 </#if>
287 </#if>
288 </#list>
289 </#if>
290 </div>
291 </article>
292 </section>
293 </div>
294 <!---------- Seccion del contenido ----------->
295 <div class="col-md-12 col-lg-7" style="background: white;">
296 <div class="tab-content tab-content-bl5 h-100" id="v-pills-tabContent">
297 <#assign y = 0>
298 <#if articles?has_content>
299 <!---------- Lista de articulos ----------->
300 <#list articles as cur_art>
301 <#assign y ++>
302 <#assign document = saxReaderUtil.read(cur_art.getContentByLocale(request.locale)) />
303 <#assign root = document.getRootElement()>
304 <#assign Basica_Liga = themeDisplay.getSiteGroup().getExpandoBridge().getAttribute("Basica_Liga")>
305 <!---------- Validacion de estructura ----------->
306 <#if cur_art.getStructureId() == Basica_Liga >
307 <#assign link = root.selectSingleNode("dynamic-element[@name='link']/dynamic-content").getText()/>
308 <#assign linkjson = jsonFactoryUtil.createJSONObject(link)>
309 <#assign url = root.selectSingleNode("dynamic-element[@name='url']/dynamic-content").getText()/>
310 <#else>
311 <!---------- Obtener el detalle de los elementos ----------->
312 <#assign tag = root.selectSingleNode("dynamic-element[@name='tag']/dynamic-content").getText()/>
313 <#assign titulo = root.selectSingleNode("dynamic-element[@name='titulo']/dynamic-content").getText()/>
314 <#assign IdGeneral = themeDisplay.getSiteGroup().getExpandoBridge().getAttribute("IdGeneral")>
315 <#if root.selectSingleNode("dynamic-element[@name='detalle']/dynamic-content")??>
316 <#assign detalle = root.selectSingleNode("dynamic-element[@name='detalle']/dynamic-content").getText()/>
317 </#if>
318 <#if y==1> <!-- Validacion para el iniciador de elementos -->
319 <div class="tab-pane h-100 fade show active" style="padding-bottom: 10em;" id="v-pills-${y}" role="tabpanel" aria-labelledby="v-pills-${y}-tab">
320 <!-- Seccion del iframe -->
321 <article class="iframe-iteso ">
322 <#if detalle??>
323 ${detalle}
324 </#if>
325 </article>
326 <!-- Fin de seccion del iframe -->
327 </div>
328 <#else>
329 <div class="tab-pane h-100 fade " style="padding-bottom: 10em;" id="v-pills-${y}" role="tabpanel" aria-labelledby="v-pills-${y}-tab">
330 <!-- Seccion del iframe -->
331 <article class="iframe-iteso ">
332 <#if detalle??>
333 ${detalle}
334 </#if>
335 </article>
336 <!-- Fin de seccion del iframe -->
337 </div>
338 </#if>
339 <!---------- Fin de obtener el detalle de los elementos ----------->
340 </#if>
341 <!---------- Fin de validacion de estructura ----------->
342 </#list>
343 <!---------- Fin de lista de articulos ----------->
344 </#if>
345 </div>
346 </div>
347 <!---------- fin de seccion del contenido ----------->
348
349 </section>
350 </section>
351</section>
352<!----------------------------------- Seccion para movil ------------------------------>
353<div id="accordion" class="degular-bold d-block d-lg-none acordion-bl5">
354 <!---------- Titulo para seccion movil ----------->
355 <section class="bg-blue-iteso">
356 <h2 class="py-4 container-it m-0 text-white">${titulobl5.getData()}</h2>
357 </section>
358 <!---------- Fin de titulo para seccion movil ----------->
359 <#assign w = 0>
360 <#if articles?has_content>
361 <!-------- Obteniendo la lista para movil -------->
362 <#list articles as cur_artlist>
363 <#assign w ++>
364 <#assign documentlist = saxReaderUtil.read(cur_artlist.getContentByLocale(request.locale)) />
365 <#assign rootlist = documentlist.getRootElement()>
366 <#assign titulo = rootlist.selectSingleNode("dynamic-element[@name='titulo']/dynamic-content").getText()/>
367 <!-- Validando para obtener el detalle -->
368 <#if rootlist.selectSingleNode("dynamic-element[@name='detalle']/dynamic-content")??>
369 <#assign detalle = rootlist.selectSingleNode("dynamic-element[@name='detalle']/dynamic-content").getText()/>
370 </#if>
371 <!-- Fin para validar el detalle -->
372 <!--------------- Validacion basica liga --------------->
373 <#if cur_artlist.getStructureId() == Basica_Liga >
374 <#assign link = rootlist.selectSingleNode("dynamic-element[@name='link']/dynamic-content").getText()/>
375 <#assign linkjson = jsonFactoryUtil.createJSONObject(link)>
376 <#assign url = rootlist.selectSingleNode("dynamic-element[@name='url']/dynamic-content").getText()/>
377 <!-- Validacion del link -->
378 <#if link != "">
379 <#assign linkid = link?split("@")>
380 <#assign groupUtil = serviceLocator.findService('com.liferay.portal.kernel.service.GroupLocalService')>
381 <#assign group = groupUtil.getGroup(cur_artlist.getGroupId())>
382 <#assign groupFriendly = group.getFriendlyURL()>
383 <#assign layoutService = serviceLocator.findService("com.liferay.portal.kernel.service.LayoutLocalService")>
384 <#assign layout = layoutService.getLayout(linkjson.getLong("groupId") , linkjson.getBoolean("privateLayout"),linkjson.getLong("layoutId"))>
385 <#assign layoutFriendly = layout.getFriendlyURL()>
386 <#assign link_page = "${url_public}${groupFriendly}${layoutFriendly}">
387 <div class="card-header bg-blue-iteso rounded-0 container-it" id="heading${w}">
388 <h5 class="mb-0 ">
389 <button class="btn btn-link d-flex align-items-center justify-content-between w-100 collapsed p-0" data-toggle="collapse" data-target="#collapse${w}" aria-expanded="false" aria-controls="collapse${w}">
390 <article class="d-flex align-items-center">
391 <a href="${link_page}">
392 ${activarIcon(w, true)}
393 <a href="${link_page}" class="text-left" style="font-size: 1.2em;">${titulo}</a><!-- Se coloca la url para la lista del elemento -->
394 </a>
395 </article>
396 <i class="fal fa-plus-circle" style="font-size: 30px;"></i>
397 </button>
398 </h5>
399 </div>
400 <#else>
401 <!-- Se obtiene url de la estrutura y seccion para el vinculo -->
402 <#assign link_page = url>
403 <div class="card-header bg-blue-iteso rounded-0 container-it" id="heading${w}">
404 <h5 class="mb-0 ">
405 <button class="btn btn-link d-flex align-items-center justify-content-between w-100 collapsed p-0" data-toggle="collapse" data-target="#collapse${w}" aria-expanded="false" aria-controls="collapse${w}">
406 <article class="d-flex align-items-center">
407 ${activarIcon(w, true)}
408 <!-- Se coloca la url para la lista -->
409 <a href="${url}" class="text-left" style="font-size: 1em;">${titulo}</a>
410 </article>
411 <i class="fal fa-plus-circle" style="font-size: 30px;"></i>
412 </button>
413 </h5>
414 </div>
415 <!-- Fin para la url de la estrutura -->
416 </#if>
417 <!-- Fin de validacion del link -->
418 <#else>
419 <!-- Seccion para obtener los detalles -->
420 <div class="card m-0 border-0">
421 <div class="card-header bg-blue-iteso rounded-0 container-it" id="heading${w}">
422 <h5 class="mb-0 ">
423 <button class="btn btn-link d-flex align-items-center justify-content-between w-100 collapsed p-0" data-toggle="collapse" data-target="#collapse${w}" aria-expanded="false" aria-controls="collapse${w}">
424 <article class="d-flex align-items-center">
425 ${activarIcon(w, true)}
426 <a class="text-left" style="font-size: 1em;">${titulo}</a>
427 </article>
428 <i class="fal fa-plus-circle" style="font-size: 30px;"></i>
429 </button>
430 </h5>
431 </div>
432 <div id="collapse${w}" class="collapse" aria-labelledby="heading${w}" data-parent="#accordion">
433 <div class="card-body container-it">
434 <!-- Colocando la variable del detalle -->
435 <section class="mobile-bl5-scroll">
436 ${detalle}
437 </section>
438 <!-- Fin de la seccion para la variable del detalle -->
439 </div>
440 </div>
441 </div>
442 <!-- Fin de seccion del detalle -->
443 </#if>
444 </#list>
445 </#if>
446</div>
447<script>
448 $(".pasos .text-blue-pasos-iteso").hover(function() {
449 $(this).css("color", "white");
450 $(this).find(".number-iteso").css("border-color", "white");
451 }, function() {
452 $(this).css("color", "#42b4e3");
453 $(this).find(".number-iteso").css("border-color", "#42b4e3");
454 });
455
456 $("#accordionBL5 .number-iteso").hover(function() {
457 $(this).css("color", "white");
458 $(this).find(".number-iteso").css("border-color", "white");
459 }, function() {
460 $(this).css("color", "#42b4e3");
461 $(this).find(".number-iteso").css("border-color", "#42b4e3");
462 });
463</script>