Achievements & Awards - Water Matters Laboratory
An error occurred while processing the template.
The following has evaluated to null or missing:
==> MainTitle [in template "20097#20123#7927606" at line 1, column 6]
----
Tip: If the failing expression is known to legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)??
----
----
FTL stack trace ("~" means nesting-related):
- Failed at: #if MainTitle.getSiblings()?has_content [in template "20097#20123#7927606" at line 1, column 1]
----
1<#if MainTitle.getSiblings()?has_content>
2<div class="achievements-section">
3 <#list MainTitle.getSiblings() as cur_MainTitle>
4 <#if cur_MainTitle.getData()?has_content>
5 <h1 class="main-title">${ResearchTitle.getData()}</h1>
6 </#if>
7
8 <#if cur_MainTitle.SectionName.getSiblings()?has_content>
9 <#list cur_MainTitle.SectionName.getSiblings() as cur_SectionName>
10 <#if cur_SectionName.getData()?has_content>
11 <h2 class="section-title">${cur_SectionName.getData()}</h2>
12 </#if>
13
14 <#if cur_SectionName.PersonName.getSiblings()?has_content>
15 <div class="subcards-grid">
16 <#list cur_SectionName.PersonName.getSiblings() as cur_PersonName>
17 <#if cur_PersonName.getData()?has_content>
18 <div class="subcard">
19 <!-- Person Info -->
20 <div class="person-info">
21 <h3 class="person-name">${cur_PersonName.getData()}</h3>
22
23 <#if cur_PersonName.PersonButtonText.getSiblings()?has_content>
24 <#list cur_PersonName.PersonButtonText.getSiblings() as cur_ButtonText>
25 <#if cur_ButtonText.getData()?has_content && cur_PersonName.PersonButtonText.PersonButtonLink.getData()?has_content>
26 <a href="${cur_PersonName.PersonButtonText.PersonButtonLink.getData()}"
27 class="btn btn-primary">
28 ${cur_ButtonText.getData()}
29 </a>
30 </#if>
31 </#list>
32 </#if>
33 </div>
34
35 <!-- Logos Row -->
36 <#if cur_PersonName.PersonPhoto.getSiblings()?has_content>
37 <div class="logos-row">
38 <#list cur_PersonName.PersonPhoto.getSiblings() as cur_Photo>
39 <#if cur_Photo.getData()?has_content>
40 <img
41 alt="${cur_Photo.getAttribute("alt")}"
42 data-fileentryid="${cur_Photo.getAttribute("fileEntryId")}"
43 src="${cur_Photo.getData()}"
44 class="achievement-logo"
45 />
46 </#if>
47 </#list>
48 </div>
49 </#if>
50 </div>
51 </#if>
52 </#list>
53 </div>
54 </#if>
55 </#list>
56 </#if>
57 </#list>
58</div>
59</#if>
60
61<style>
62
63.main-title {
64 font-size: 2rem;
65 font-weight: 700;
66 color: #003f80;
67 margin: 2.5rem 0 1.5rem;
68 text-align: center;
69}
70/* Grid for subcards */
71/* Grid for subcards */
72.subcards-grid {
73 display: grid;
74 grid-template-columns: 1fr; /* one card per row */
75 gap: 1.5rem;
76 margin-top: 1.5rem;
77}
78
79/* Subcard styling */
80.subcard {
81 background: #fdfdfd;
82 border: 1px solid #e5e7eb;
83 border-radius: 10px;
84 padding: 1.25rem;
85 box-shadow: 0 2px 10px rgba(0,0,0,0.05);
86 transition: transform 0.2s ease, box-shadow 0.2s ease;
87}
88
89.subcard:hover {
90 transform: translateY(-3px);
91 box-shadow: 0 4px 14px rgba(0,0,0,0.08);
92}
93
94/* Keep your existing styles for .person-info, .btn, .logos-row, .achievement-logo */
95/* ====== Section Title (outside card) ====== */
96.section-title {
97 font-size: 1.5rem;
98 font-weight: 600;
99 color: #0056B3;
100 margin: 2rem 0 1rem;
101 border-left: 4px solid #0056B3;
102 padding-left: 0.75rem;
103}
104
105/* ====== Achievements Section Card ====== */
106.achievements-section {
107 max-width: 1200px;
108 margin: 0 auto 2rem;
109 padding: 2rem;
110 background: #ffffff;
111 border-radius: 12px;
112 box-shadow: 0 4px 20px rgba(0,0,0,0.05);
113 transition: transform 0.25s ease, box-shadow 0.25s ease;
114}
115
116.achievements-section:hover {
117 transform: translateY(-4px);
118 box-shadow: 0 6px 18px rgba(0,0,0,0.1);
119}
120
121/* ====== Person Info Row ====== */
122.person-info {
123 display: flex;
124 align-items: center;
125 justify-content: space-between;
126 flex-wrap: wrap;
127 margin-bottom: 1.5rem;
128}
129
130.person-name {
131 font-size: 1.25rem;
132 font-weight: 600;
133 color: #0056B3;
134 margin: 0.5rem 0;
135}
136
137/* ====== Button ====== */
138.btn.btn-primary {
139 background: #0056B3;
140 color: #ffffff;
141 padding: 0.6rem 1.2rem;
142 border-radius: 6px;
143 text-decoration: none;
144 font-size: 0.95rem;
145 font-weight: 500;
146 transition: background 0.3s ease;
147}
148
149.btn.btn-primary:hover {
150 background: #003f80;
151}
152
153/* ====== Logos Row ====== */
154.logos-row {
155 display: flex;
156 flex-wrap: wrap;
157 gap: 1.25rem;
158 margin-top: 1rem;
159}
160
161.achievement-logo {
162 max-height: 70px;
163 max-width: 140px;
164 object-fit: contain;
165 border-radius: 8px;
166 background: #f9fafb;
167 padding: 0.5rem 0.75rem;
168 box-shadow: 0 2px 8px rgba(0,0,0,0.05);
169 transition: transform 0.2s ease, box-shadow 0.2s ease;
170}
171
172.achievement-logo:hover {
173 transform: scale(1.05);
174 box-shadow: 0 4px 14px rgba(0,0,0,0.08);
175}
176</style>