basketballcantho/sisvietnamvn_01
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Phần Post đã thiết kế xong chỉ cần sửa lại tempalte nữa là được

Browse Source
This commit is contained in:
Victor Phan
2026-06-28 16:25:51 +07:00
parent 38d6b8234a
commit 0326535eb6
64 changed files with 13477 additions and 1603 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sisvietnamvn_main/src/main/resources/templates/posts/full-width.html
+96
View File
@@ -0,0 +1,96 @@
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
layout:decorate="~{fragments/layout}">
<head>
<title th:text="${post.title} + ' | UMass Amherst'">Post Title | UMass Amherst</title>
<meta name="description" th:content="${post.metaDescription ?: post.excerpt}">
</head>
<body>
<div layout:fragment="content">
<div id="block-umass-base-content" class="block block-system block-system-main-block tc--template-container tc--article">
<div class="t--template t--article">
<!-- Content Top (e.g. Hero Image & Title) -->
<div class="content-top">
<div class="lc--layout-container lc--full">
<div class="l--layout l--full">
<div class="lr--layout-region lr--main">
<div class="cc--component-container cc--hero-article">
<div class="c--component c--hero-article">
<div class="f--field f--image" th:if="${post.featuredImage != null and !post.featuredImage.isEmpty()}">
<img th:src="${post.featuredImage}" th:alt="${post.title}" style="width:100%; object-fit:cover;">
</div>
<h1 class="f--field f--title text-center" th:text="${post.title}">Post Title</h1>
<p class="f--field f--date text-center" th:if="${formattedDate != null}" th:text="${formattedDate}">Date</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Content Main (Full Width) -->
<div class="content-main">
<div class="lc--layout-container lc--full">
<div class="l--layout l--full">
<div class="lr--layout-region lr--main">
<section class="cc--component-container cc--wysiwyg">
<div class="c--component c--wysiwyg">
<div class="f--field f--wysiwyg editorjs-content" id="postContentRaw" style="display:none;" th:text="${post.content}"></div>
<div class="f--field f--wysiwyg" id="postContentParsed"></div>
</div>
</section>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
document.addEventListener("DOMContentLoaded", function() {
var rawData = document.getElementById("postContentRaw").textContent;
var parsedContainer = document.getElementById("postContentParsed");
try {
var data = JSON.parse(rawData);
var html = "";
if (data.blocks) {
data.blocks.forEach(function(block) {
switch(block.type) {
case "header":
html += "<h" + block.data.level + ">" + block.data.text + "</h" + block.data.level + ">";
break;
case "paragraph":
html += "<p>" + block.data.text + "</p>";
break;
case "image":
html += "<figure><img src='" + block.data.url + "' alt='" + (block.data.caption || '') + "'><figcaption>" + (block.data.caption || '') + "</figcaption></figure>";
break;
case "list":
var tag = block.data.style === 'ordered' ? 'ol' : 'ul';
html += "<" + tag + ">";
block.data.items.forEach(function(item) {
html += "<li>" + item + "</li>";
});
html += "</" + tag + ">";
break;
case "quote":
html += "<blockquote>" + block.data.text + " <cite>" + block.data.caption + "</cite></blockquote>";
break;
default:
console.log("Unknown block type", block.type);
}
});
}
parsedContainer.innerHTML = html;
} catch(e) {
parsedContainer.innerHTML = rawData;
}
});
</script>
</div>
</body>
</html>