2025-03-20 17:57:55 +09:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html
|
|
|
|
|
xmlns:th="http://www.thymeleaf.org"
|
|
|
|
|
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
|
2025-08-04 16:35:49 +09:00
|
|
|
xmlns:sec="http://www.thymeleaf.org/extras/spring-security"
|
2025-03-20 17:57:55 +09:00
|
|
|
layout:decorate="~{layout/default_layout}"
|
|
|
|
|
>
|
|
|
|
|
<th:block layout:fragment="head">
|
|
|
|
|
<script type="text/javascript" th:src="@{/js/toast-ui-view.js}"></script>
|
|
|
|
|
<link th:href="@{/css/toast-ui-dark.css}" rel="stylesheet" />
|
|
|
|
|
<script type="text/javascript" th:src="@{/js/blog.js}"></script>
|
|
|
|
|
<link th:href="@{/css/blog.css}" rel="stylesheet" />
|
|
|
|
|
<script th:inline="javascript">
|
|
|
|
|
let editor
|
|
|
|
|
let onChange = () => {console.log(editor.getMarkdown())}
|
|
|
|
|
document.addEventListener("DOMContentLoaded", onLoaded);
|
|
|
|
|
function onLoaded() {
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
</th:block>
|
|
|
|
|
<th:block layout:fragment="content" id="content">
|
|
|
|
|
<section class="wrapper style1">
|
|
|
|
|
<div class="container">
|
|
|
|
|
<div class="row gtr-200">
|
2025-08-05 18:01:15 +09:00
|
|
|
<!-- <div class="col-3 col-12-narrower">-->
|
|
|
|
|
<!-- <div id="sidebar1">-->
|
|
|
|
|
<!-- <section>-->
|
|
|
|
|
<!-- <h3>Just a Subheading</h3>-->
|
|
|
|
|
<!-- <p>Phasellus quam turpis, feugiat sit amet ornare in, hendrerit in lectus.-->
|
|
|
|
|
<!-- Praesent semper mod quis eget mi. Etiam eu ante risus. Aliquam erat volutpat.-->
|
|
|
|
|
<!-- Aliquam luctus et mattis lectus sit amet pulvinar. Nam turpis et nisi etiam.</p>-->
|
|
|
|
|
<!-- <footer>-->
|
|
|
|
|
<!-- <a href="#" class="button">Continue Reading</a>-->
|
|
|
|
|
<!-- </footer>-->
|
|
|
|
|
<!-- </section>-->
|
2025-03-20 17:57:55 +09:00
|
|
|
|
2025-08-05 18:01:15 +09:00
|
|
|
<!-- <section>-->
|
|
|
|
|
<!-- <h3>Another Subheading</h3>-->
|
|
|
|
|
<!-- <ul class="links">-->
|
|
|
|
|
<!-- <li><a href="#">Amet turpis, feugiat sit amet</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Ornare in hendrerit lectus</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Semper mod quis eget dolore</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Consequat lorem phasellus</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Amet turpis feugiat amet</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Semper mod quisturpis nisi</a></li>-->
|
|
|
|
|
<!-- </ul>-->
|
|
|
|
|
<!-- <footer>-->
|
|
|
|
|
<!-- <a href="#" class="button">More Random Links</a>-->
|
|
|
|
|
<!-- </footer>-->
|
|
|
|
|
<!-- </section>-->
|
2025-03-20 17:57:55 +09:00
|
|
|
|
2025-08-05 18:01:15 +09:00
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
2025-03-20 17:57:55 +09:00
|
|
|
<div class="col-6 col-12-narrower imp-narrower">
|
|
|
|
|
<div id="content">
|
|
|
|
|
<article>
|
2025-03-21 17:15:55 +09:00
|
|
|
<section class="col-6 col-12-narrower imp-narrower" th:each="post : ${Posts}">
|
|
|
|
|
<!-- <span th:text="${cell}"></span>-->
|
2025-08-05 11:24:23 +09:00
|
|
|
<div class="box post" onclick="goToViewer(this)" th:id="${post.id}">
|
|
|
|
|
<a href="javascript:goToViewer(this)" th:id="${post.id}" th:data="${post.id}" class="image left"><img th:src="${#strings.length(post.thumb) > 0} ? ${post.thumb} : 'images/pic01.jpg'" alt="" /></a>
|
2025-03-21 17:15:55 +09:00
|
|
|
<div class="inner">
|
|
|
|
|
<h3 th:text="${#strings.length(post.title) > 0} ? ${post.title} : ('untitled[' + ${#temporals.format(T(java.time.Instant).ofEpochMilli(post.writeTime).atZone(T(java.time.ZoneId).systemDefault()).toLocalDateTime(), 'yyyy-MM-dd HH:mm:ss')} + ']')"></h3>
|
|
|
|
|
<p th:text="${#strings.abbreviate(post.html, 80)}" class="ellipsis"></p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
2025-03-20 17:57:55 +09:00
|
|
|
</article>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2025-08-05 18:01:15 +09:00
|
|
|
<!-- <div class="col-3 col-12-narrower">-->
|
|
|
|
|
<!-- <div id="sidebar2">-->
|
2025-03-20 17:57:55 +09:00
|
|
|
|
2025-08-05 18:01:15 +09:00
|
|
|
<!-- <section>-->
|
|
|
|
|
<!-- <h3>Another Subheading</h3>-->
|
|
|
|
|
<!-- <ul class="links">-->
|
|
|
|
|
<!-- <li><a href="#">Amet turpis, feugiat sit amet</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Ornare in hendrerit lectus</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Semper mod quis eget dolore</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Consequat lorem phasellus</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Amet turpis feugiat amet</a></li>-->
|
|
|
|
|
<!-- <li><a href="#">Semper mod quisturpis nisi</a></li>-->
|
|
|
|
|
<!-- </ul>-->
|
|
|
|
|
<!-- <footer>-->
|
|
|
|
|
<!-- <a href="#" class="button">More Random Links</a>-->
|
|
|
|
|
<!-- </footer>-->
|
|
|
|
|
<!-- </section>-->
|
2025-03-20 17:57:55 +09:00
|
|
|
|
2025-08-05 18:01:15 +09:00
|
|
|
<!-- <section>-->
|
|
|
|
|
<!-- <h3>Just a Subheading</h3>-->
|
|
|
|
|
<!-- <p>Phasellus quam turpis, feugiat sit amet ornare in, hendrerit in lectus.-->
|
|
|
|
|
<!-- Praesent semper mod quis eget mi. Etiam eu ante risus. Aliquam erat volutpat.-->
|
|
|
|
|
<!-- Aliquam luctus et mattis lectus sit amet pulvinar. Nam turpis et nisi etiam.</p>-->
|
|
|
|
|
<!-- <footer>-->
|
|
|
|
|
<!-- <a href="#" class="button">Continue Reading</a>-->
|
|
|
|
|
<!-- </footer>-->
|
|
|
|
|
<!-- </section>-->
|
2025-03-20 17:57:55 +09:00
|
|
|
|
2025-08-05 18:01:15 +09:00
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
2025-03-20 17:57:55 +09:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
</th:block>
|
|
|
|
|
</html>
|
