1<#-- Suositellut artikkelit -->
2<#--- INIT --->
3<#-- Import common variables, functions & macros -->
4<#import "${templatesPath}/46467" as ch5>
5<#assign dlAppServiceUtil = serviceLocator.findService("com.liferay.document.library.kernel.service.DLAppService") />
6<#--- OUTPUT --->
7
8<@ch5.emptyListMessage />
9<#if entries?has_content>
10
11<style>
12 .Suositellut-artikkelit-otsikko {
13 font-size: 24px;
14 font-weight: 600;
15 line-height: 33px;
16 padding-bottom: 17px;
17 margin: 0;
18 }
19
20
21
22 @media (max-width: 1199.98px), (min-width: 1199.98px) {
23 .fimtkartikkelisuosittelukuvatila {
24 height: 133.33px;
25 /*width: 200px;*/
26 overflow: hidden;
27 }
28 }
29 @media (max-width: 991.98px) {
30 .fimtkartikkelisuosittelukuvatila {
31 max-height: 150px;
32 width: 100%;
33 }
34 }
35 @media (max-width: 767.98px) {
36 .fimtkartikkelisuosittelukuvatila {
37
38 }
39 }
40 @media (max-width: 575.98px) {
41 .fimtkartikkelisuosittelukuvatila {
42
43 }
44 }
45 .fimtkteemaartikkelilistaotsake {
46 padding: 0;
47 }
48
49 @media(max-width: 991px){
50 .fimtkteemaartikkelilistaotsakemuutindex {
51 box-shadow: 0 2px 0 0 rgba(155,155,155,0.3);
52 }
53 }
54 .fimtkteemaartikkelilistakehys {
55 margin-left: 40px; margin-right: 76px;
56 }
57 @media(max-width: 991px){
58 .fimtkteemaartikkelilistakehys {
59 margin-left: 12px; margin-right: 12px;
60 }
61 }
62
63
64
65
66 </style>
67
68
69
70
71 <div class="fimtkteemaartikkelilista fimtkteemaartikkelilistakehys" style="">
72 <h2 class="Suositellut-artikkelit-otsikko">Suositellut artikkelit</h2>
73 </div>
74 <div class="fimtkteemaartikkelilista fimtkteemaartikkelilistakehys" style="">
75 <#assign fistcontent = "fimtkteemaartikkelilistaotsakemuut"/> <#--"fimtkteemaartikkelilistaensimmainen" />-->
76 <#assign fistcontent1 = ""/> <#--"fimtkteemaartikkelilistaotsakeensimmainen" />-->
77 <#list entries as entry>
78 <#-- INIT ENTRY -->
79 <#assign entryImage = ch5.getContentField(entry, "image")?first!"">
80 <#assign entrySummary = ch5.getSummary(entry, 220)>
81 <#assign articleType = ch5.getCategoryNames(entry, ch5.articleTypeVocabularyId)?first!"" />
82 <#assign assetRenderer = entry.getAssetRenderer() />
83 <#assign imageurl = "">
84 <#assign imagefileEntryId = "">
85 <#if entryImage?has_content>
86 <#assign entryImageJSON = entryImage?eval>
87 <#assign imageurl = "/o/adaptive-media/image/${entryImageJSON.fileEntryId}/thumbnail-600x/${entryImageJSON.name}">
88 <#assign imagefileEntryId = "${entryImageJSON.fileEntryId}">
89 <#else>
90 <#switch ch5.getStructureName(entry)>
91 <#case "Blogi">
92 <#assign imageurl = "/o/mtk-site-theme/css/placeholder-kuvat/blog.png">
93 <#break>
94 <#case "Tiedote">
95 <#assign imageurl = "/o/mtk-site-theme/css/placeholder-kuvat/Tiedote.png">
96 <#break>
97 <#case "Uutinen">
98 <#assign imageurl = "/o/mtk-site-theme/css/placeholder-kuvat/Uutinen.png">
99 <#break>
100 <#case "Ajankohtaista">
101 <#assign imageurl = "/o/mtk-site-theme/css/placeholder-kuvat/Tapahtuma.png">
102 <#break>
103 <#default>
104 <#assign imageurl = "/o/mtk-site-theme/css/placeholder-kuvat/Teematon.png">
105 </#switch>
106 </#if>
107
108
109 <div class="contain">
110
111 <@ch5.articleeditlink entry "position: initial; float: right;"/>
112 <div class="row fimtkteemaartikkelilistayksittainen ${fistcontent} p-0" style="width: 100%;">
113 <div class="col-12 col-sm-12 col-md-12 col-lg-3 col-xl-3 p-0" >
114 <div class="fimtkartikkelisuosittelukuvatila mb-3 pt-3 d-none d-lg-block" style="">
115 <img src="${imageurl}" class="fimtkteemaartikkelilistakuva">
116 </div>
117
118 </div>
119 <div class="col-12 col-sm-12 col-md-12 col-lg-7 col-xl-7 fimtkteemaartikkelilistaotsake ${fistcontent1}">
120 <div class="row" style="width: 100%; margin: 0; padding-left: 18px; padding-right: 15px">
121 <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 fimtkteemaartikkelilistaotsikko fimtkteemaartikkelilistaotsakemuutindex">
122 <#assign GroupLocalService = serviceLocator.findService("com.liferay.portal.kernel.service.GroupLocalService")>
123 <#assign mtkpaagroup = GroupLocalService.fetchGroup(entry.groupId) >
124 <div class="FiMtkFrontIndexListitemrankingvalue d-block d-lg-none " style="transform: translate(-33px, 0); height: 0">${entry?index + 1}</div>
125 <p class="m-0 d-block d-lg-none" style="font-family: Nunito; font-size: 14px; font-weight: 300; line-height: 18px;">${ch5.getPublishDate(entry)} <@ch5.getarticleauthor entry /></p>
126 <a href="https://${mtkpaagroup.getPublicLayoutSet().getVirtualHostname()}/-/${assetRenderer.getUrlTitle()}" class="text-dark">
127 <h3 style="font-family: "Open Sans"; font-size: 18px; font-weight: 600; line-height: 24px;">
128
129 <#assign title = ch5.getTitle(entry)>
130 <#if title?length < 75>
131 ${title}
132 <#else>
133 ${title?substring(0, 74)} ...
134 </#if>
135 </h3>
136 </a>
137 <p class="m-0 d-none d-lg-block" style="font-family: Nunito; font-size: 14px; font-weight: 300; line-height: 18px;">${ch5.getPublishDate(entry)} <@ch5.getarticleauthor entry /></p>
138 </div>
139 <#--<div class="col-12 col-sm-12 col-md-12 col-lg-5 col-xl-4 fimtkteemaartikkelilistatilasosiaalinenmedia">
140 <div style="height: 40px; "></div>
141 <a href="https://www.facebook.com/sharer/sharer.php?u=${ch5.getViewURL(entry)}" target="_blank" class="fab fa-facebook-f fimtkteemaartikkelilistasosiaalinenmedia fimtkteemaartikkelilistasosiaalinenmediafacebook float-right"></a>
142 <a href="https://twitter.com/home?status=${ch5.getViewURL(entry)}" target="_blank" class="fab fa-twitter fimtkteemaartikkelilistasosiaalinenmedia fimtkteemaartikkelilistasosiaalinenmediatwitter float-right"></a>
143 <a href="whatsapp://send?text=${ch5.getViewURL(entry)}" data-action="share/whatsapp/share" target="_blank" class="fab fa-whatsapp fimtkteemaartikkelilistasosiaalinenmedia fimtkteemaartikkelilistasosiaalinenmediawhatsapp float-right"></a>
144 </div>-->
145 </div>
146 <div class="row" style="width: 100%; margin: 0; padding-left: 18px">
147 <div class="col d-none d-lg-block">
148 <p style="font-size: 16px; font-weight: 300; line-height: 18px;">${entrySummary?replace('<[^>]+>','','r')}</p>
149 </div>
150 </div>
151 </div>
152 </div>
153 </div>
154
155
156
157 <#assign fistcontent = "fimtkteemaartikkelilistaotsakemuut" />
158 <#assign fistcontent1 = "" />
159
160 </#list>
161 </div>
162</#if>