テンプレート処理中にエラーが発生しました。
The string doesn't match the expected date/time/date-time format. The string to parse was: "25/09/03 18:27". The expected format was: "M/d/yy h:mm a". The nested reason given follows: Unparseable date: "25/09/03 18:27" ---- FTL stack trace ("~" means nesting-related): - Failed at: #assign rawDate = ObjectEntry_createD... [in template "8911408109993434201#23484949#null" at line 29, column 49] ----
1<nav class="breadcrumb-container">
2 <ul aria-label="breadcrumb navigation" class="learn-breadcrumb" role="navigation">
3 <li>
4 <a href="/">
5 <@clay["icon"] symbol="home-full" />
6 </a>
7 </li>
8 <li>
9 <a href="/announcements">
10 <@liferay_ui["message"] key="announcement" />
11 </a>
12 </li>
13 <li>
14 ${ObjectField_title.getData()}
15 </li>
16 </ul>
17</nav>
18
19<div class="d-flex page-container">
20 <div class="main-container my-3">
21 <div class="header">
22 <div class="asset-info d-flex">
23 <p class="title">
24 <@liferay_ui["message"] key="announcement" />
25 </p>
26
27 <p class="date">
28 <#if (ObjectEntry_createDate.getData())??>
29 <#assign rawDate = ObjectEntry_createDate.getData()?datetime("M/d/yy h:mm a") />
30 <@liferay_ui["message"] key="published" /> ${rawDate?string("MMM. d, yyyy")}
31 </#if>
32 </p>
33 </div>
34
35 <div class="content-info mt-2">
36 <h1>
37 <#if (ObjectField_title.getData())??>
38 ${ObjectField_title.getData()}
39 </#if>
40 </h1>
41
42 <div>
43 <#if (ObjectField_description.getData())??>
44 <p class="description">
45 ${ObjectField_description.getData()}
46 </p>
47 </#if>
48 </div>
49 </div>
50 </div>
51
52 <div class="content mt-3" id="content">
53 <#if (ObjectField_content.getData())??>
54 ${ObjectField_content.getData()}
55 </#if>
56 <#if (.data_model["ObjectField_35642960#previewURL"].getData())?? && .data_model["ObjectField_35642960#previewURL"].getData() !="">
57 <img alt="Image Preview" src="${.data_model["ObjectField_35642960#previewURL"].getData()}" />
58 </#if>
59 </div>
60 </div>
61
62 <div class="side-container">
63 <div class="table-of-contents"></div>
64 </div>
65</div>
66
67<script>
68 document.addEventListener("DOMContentLoaded", function() {
69 const contentContainer = document.getElementById("content");
70 const tocContainer = document.querySelector(".table-of-contents");
71
72 if (!contentContainer || !tocContainer) {
73 return;
74 }
75
76 const headings = contentContainer.querySelectorAll("h3");
77
78 if (headings.length === 0) {
79 return;
80 }
81
82 const tocList = document.createElement("ul");
83
84 headings.forEach((heading, index) => {
85 const headingId = "heading-" + index;
86 const link = document.createElement("a");
87 const listItem = document.createElement("li");
88
89 heading.id = headingId;
90
91 link.href = "#" + headingId;
92 link.textContent = heading.textContent;
93
94 link.addEventListener("click", function() {
95 tocList.querySelectorAll("li").forEach((li) => li.classList.remove("active"));
96 listItem.classList.add("active");
97 });
98
99 listItem.appendChild(link);
100 tocList.appendChild(listItem);
101 });
102
103 tocContainer.appendChild(tocList);
104 });
105</script>
106
107<style>
108 .admonion-container {
109 border-radius: var(--border-radius-lg);
110 margin-bottom: 1.5rem;
111 padding: 1.5rem;
112
113 p {
114 margin-bottom: 0;
115 }
116
117 .admonion-title {
118 display: flex;
119 font-weight: 600;
120 margin-bottom: 0;
121 text-transform: uppercase;
122 }
123 }
124
125 .admonion-type-danger {
126 background-color: var(--color-state-error-lighten-2, #fbe3e3);
127
128 .admonion-title {
129 color: var(--color-state-error, #dA1414);
130 }
131 }
132
133 .admonion-type-info {
134 background-color: #EFF2FA;
135
136 admonion-title {
137 color: #4F6FB8;
138 }
139 }
140
141 .admonion-type-note {
142 background-color: var(--color-state-success-lighten-2, #e9f5e8);
143
144 .admonion-title {
145 color: var(--color-state-success-darken-1, #3b892f);
146 }
147 }
148
149 .admonion-type-warning {
150 background-color: var(--color-state-warning-lighten-2, #f7eae0);
151
152 .admonion-title {
153 color: var(--color-state-warning-darken-1, #944000);
154 }
155 }
156
157 .asset-info {
158 justify-content: space-between;
159
160 p {
161 margin-bottom: 0rem;
162 }
163
164 .date {
165 color: var(--color-neutral-8, #54555f);
166 font-size: 13px;
167 }
168
169 .title {
170 color: var(--color-brand-primary, #0b5fff);
171 font-size: 18px;
172 font-weight: 600;
173
174 &::before {
175 content: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cmask%20id%3D%22mask0_2173_19132%22%20style%3D%22mask-type%3Aalpha%22%20maskUnits%3D%22userSpaceOnUse%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2215%22%20height%3D%2215%22%3E%3Cmask%20id%3D%22path-1-inside-1_2173_19132%22%20fill%3D%22white%22%3E%3Crect%20x%3D%220.998535%22%20y%3D%223%22%20width%3D%224%22%20height%3D%226%22%20rx%3D%221%22/%3E%3C/mask%3E%3Crect%20x%3D%220.998535%22%20y%3D%223%22%20width%3D%224%22%20height%3D%226%22%20rx%3D%221%22%20stroke%3D%22%23D9D9D9%22%20stroke-width%3D%224%22%20mask%3D%22url(%23path-1-inside-1_2173_19132)%22/%3E%3Crect%20x%3D%223.99854%22%20y%3D%2210%22%20width%3D%223%22%20height%3D%225%22%20rx%3D%221%22%20fill%3D%22%23D9D9D9%22/%3E%3Cpath%20d%3D%22M13.9985%201.3877V10.6123L6.99854%208.2793V3.7207L13.9985%201.3877Z%22%20stroke%3D%22%23D9D9D9%22%20stroke-width%3D%222%22/%3E%3C/mask%3E%3Cg%20mask%3D%22url(%23mask0_2173_19132)%22%3E%3Crect%20y%3D%22-1%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%230B5FFF%22/%3E%3C/g%3E%3C/svg%3E");
176 display: inline-block;
177 margin-right: 0.375rem;
178 padding-top: 0.25rem;
179 vertical-align: middle;
180 }
181 }
182 }
183
184 .component-html img {
185 border-radius: 10px;
186 width: 100%;
187 }
188
189 .content-info {
190 .description {
191 font-style: italic;
192 margin-top: 1rem;
193 }
194 }
195
196 .learn-breadcrumb {
197 align-items: center;
198 display: flex;
199 flex-wrap: wrap;
200 list-style: none;
201 margin: 0;
202 padding: 0;
203
204 a,
205 li {
206 color: var(--color-state-neutral-darken-1, #6c6c75);
207 font-size: 0.8125rem;
208 text-decoration: none;
209 }
210
211 li+li::before {
212 content: '/';
213 padding: 0 0.25rem;
214 }
215 }
216
217 .main-container {
218 max-width: 1136px;
219 }
220
221 .side-container {
222 align-self: flex-start;
223 margin-left: 1rem;
224 margin-top: 4rem;
225 position: sticky;
226 top: 12.5rem;
227 min-width: 256px;
228 }
229
230 .table-of-contents {
231 color: #333;
232 font-size: 14px;
233 max-width: 17.5rem;
234 padding: 1rem;
235 }
236
237 .table-of-contents a {
238 color: var(--color-neutral-6, #82828c);
239 text-decoration: none;
240 transition: color 0.3s ease;
241 }
242
243 .table-of-contents a:hover {
244 color: var(--color-neutral-10, #282934);
245 }
246
247 .table-of-contents li {
248 color: var(--color-neutral-10, #282934);
249 height: 2rem;
250 padding: 0.375rem 1rem;
251 text-align: start;
252 }
253
254 .table-of-contents li.active {
255 font-weight: bold;
256 position: relative;
257 }
258
259 .table-of-contents li.active::before {
260 background-color: var(--color-brand-primary, #0b5fff);
261 border-radius: 0.125rem;
262 content: '';
263 height: 1.5rem;
264 left: 0;
265 position: absolute;
266 top: 0.125rem;
267 width: 0.25rem;
268 }
269
270 .table-of-contents ul {
271 display: flex;
272 flex-direction: column;
273 gap: 0.5rem;
274 list-style: none;
275 margin: 0;
276 padding-left: 0;
277 }
278
279 h1, h2, h3 {
280 color: var(--color-neutral-10, #282934);
281 }
282
283 html {
284 scroll-behavior: smooth;
285 scroll-padding-top: 11.25rem;
286 }
287
288 @media (max-width:1024px) {
289 .asset-info {
290 flex-direction: column;
291 margin-bottom: 1rem;
292 }
293
294 .asset-info .title {
295 margin-bottom: 0;
296 }
297
298 .side-container {
299 display: none;
300 }
301 }
302</style>
Capabilities
Product
Education
Contact Us
Powered by Liferay
© 2024 Liferay Inc. All Rights Reserved • Privacy Policy