Skip to content

Commit

Permalink
feat: add front rendering animation
Browse files Browse the repository at this point in the history
  • Loading branch information
@laigasus
laigasus committed May 9, 2024
1 parent e3589a5 commit f0bea4f
Show file tree
Hide file tree
Showing 12 changed files with 11 additions and 12 deletions.
1 change: 0 additions & 1 deletion app/src/main/resources/static/assets/css/dictionary/aos.min.css
View file

This file was deleted.

2 changes: 1 addition & 1 deletion app/src/main/resources/static/assets/js/app.mjs
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
const t=window.location.pathname;document.addEventListener("DOMContentLoaded",(function(){var t=document.title;t=t.split("-",1),document.getElementById("page-title").innerText=t,"분리ㅅㄱ"==t&&(document.getElementById("navbar-mobile-arrow").style.display="none",document.getElementById("page-title").innerText="🪴")})),document.body.addEventListener("htmx:configRequest",(function(t){if(t.detail.headers.accept="text/html-partial","get"!==t.detail.verb){const e=document.querySelector("meta[name='_csrf_header']").getAttribute("content");t.detail.headers[e]=document.querySelector("meta[name='_csrf']").getAttribute("content")}})),("/"===t||t.startsWith("/dictionary"))&&import("./dictionary/algolia.mjs").then((t=>{t.init()})),(t.startsWith("/dictionary")||t.startsWith("/profile"))&&import("./dictionary/aos.mjs").then((t=>{t.init()})),t.startsWith("/community/")&&(import("./community/editorjs.umd.min.js").then((()=>{import("./community/editor.mjs").then((t=>{t.init()}))})),import("./community/jquery.timeago.min.js").then((()=>{import("./community/time-ago.mjs").then((t=>{t.init()}))}))),t.startsWith("/community/write")&&import("./community/post-color-changer.mjs").then((t=>{t.init()}));
const t=window.location.pathname;document.addEventListener("DOMContentLoaded",(function(){var t=document.title;t=t.split("-",1),document.getElementById("page-title").innerText=t,"분리ㅅㄱ"==t&&(document.getElementById("navbar-mobile-arrow").style.display="none",document.getElementById("page-title").innerText="🪴")})),document.body.addEventListener("htmx:configRequest",(function(t){if(t.detail.headers.accept="text/html-partial","get"!==t.detail.verb){const e=document.querySelector("meta[name='_csrf_header']").getAttribute("content");t.detail.headers[e]=document.querySelector("meta[name='_csrf']").getAttribute("content")}})),("/"===t||t.startsWith("/dictionary"))&&import("./dictionary/algolia.mjs").then((t=>{t.init()})),t.startsWith("/community/")&&(import("./community/editorjs.umd.min.js").then((()=>{import("./community/editor.mjs").then((t=>{t.init()}))})),import("./community/jquery.timeago.min.js").then((()=>{import("./community/time-ago.mjs").then((t=>{t.init()}))}))),t.startsWith("/community/write")&&import("./community/post-color-changer.mjs").then((t=>{t.init()}));
1 change: 0 additions & 1 deletion app/src/main/resources/static/assets/js/dictionary/aos.mjs
View file

This file was deleted.

2 changes: 1 addition & 1 deletion app/src/main/resources/templates/base/header.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,4 +43,4 @@
<span th:text="#{base.header.nav.theme.auto.text}">Auto</span>
</a>
</div>
</div></li></ul></div></div></nav></header><script src="/assets/js/jquery.min.js"></script><script src="/assets/bootstrap/js/bootstrap.min.js"></script><script src="/assets/js/script.min.js"></script><script src="/assets/js/community/editorjs.umd.min.js"></script><script src="/assets/js/community/jquery.timeago.min.js"></script><script src="/assets/js/community/editor.mjs" type="module"></script><script src="/assets/js/community/post-color-changer.mjs" type="module"></script><script src="/assets/js/community/time-ago.mjs" type="module"></script><script src="/assets/js/dictionary/algolia.mjs" type="module"></script><script src="/assets/js/dictionary/aos.mjs" type="module"></script></body></html>
</div></li></ul></div></div></nav></header><script src="/assets/js/jquery.min.js"></script><script src="/assets/bootstrap/js/bootstrap.min.js"></script><script src="/assets/js/script.min.js"></script><script src="/assets/js/community/editorjs.umd.min.js"></script><script src="/assets/js/community/jquery.timeago.min.js"></script><script src="/assets/js/community/editor.mjs" type="module"></script><script src="/assets/js/community/post-color-changer.mjs" type="module"></script><script src="/assets/js/community/time-ago.mjs" type="module"></script><script src="/assets/js/dictionary/algolia.mjs" type="module"></script></body></html>
3 changes: 2 additions & 1 deletion app/src/main/resources/templates/base/layout.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
<!DOCTYPE html><html data-bs-theme="dark" lang="ko" xmlns:th="https://www.thymeleaf.org" xmlns:sec="https://www.thymeleaf.org/extras/spring-security" xmlns:layout="https://www.ultraq.net.nz/thymeleaf/layout"><head><meta charset="utf-8">
<link rel="manifest" href="/assets/js/manifest.json">
<meta name="_csrf" th:content="${_csrf.token}" />
<meta name="_csrf_header" th:content="${_csrf.headerName}" /><meta name="viewport" content="width=device-width, shrink-to-fit=0, user-scalable=0, initial-scale=1"><title>분리ㅅㄱ</title><meta name="theme-color" content="#ffffff"><link rel="canonical" href="https://blisgo.org/templates/base/layout.html"><meta property="og:url" content="https://blisgo.org/templates/base/layout.html"><meta name="twitter:description" content="분리배출 도우미 사전"><meta name="twitter:image" content="https://blisgo.org/assets/img/favicon/512x512.png"><meta name="twitter:title" content="분리ㅅㄱ"><meta name="twitter:card" content="summary_large_image"><meta property="og:type" content="website"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta property="og:image" content="https://blisgo.org/assets/img/favicon/512x512.png"><meta name="description" content="분리배출 도우미 사전"><link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/assets/img/favicon/180x180.png"><link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicon/16x16.png"><link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicon/32x32.png"><link rel="icon" type="image/png" sizes="180x180" href="/assets/img/favicon/180x180.png"><link rel="icon" type="image/png" sizes="192x192" href="/assets/img/favicon/192x192.png"><link rel="icon" type="image/png" sizes="512x512" href="/assets/img/favicon/512x512.png"><link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css"><link rel="stylesheet" href="/assets/css/dictionary/aos.min.css"><link rel="stylesheet" href="/assets/css/cmmn/style.min.css"><link rel="stylesheet" href="/assets/css/community/editorjs.min.css"><link rel="stylesheet" href="/assets/css/dictionary/autocomplete-theme-bootstrap.min.css"></head><body oncontextmenu="return false" ondragstart="return false"><header th:replace="~{/base/header::header}"></header><main layout:fragment="main"></main><div class="toast-container position-fixed bottom-0 start-50 translate-middle-x p-3" id="toast" th:insert="~{/base/toast::toast}"></div><script src="/assets/js/jquery.min.js"></script><script src="/assets/bootstrap/js/bootstrap.min.js"></script><script src="/assets/js/script.min.js"></script><script src="/assets/js/cmmn/htmx.min.js"></script><script src="/assets/js/app.mjs" type="module"></script><script src="/assets/js/cmmn/theme-switch.mjs" type="module"></script><script src="/assets/js/cmmn/toast.mjs" type="module"></script></body></html>
<meta name="_csrf_header" th:content="${_csrf.headerName}" />
<meta name="htmx-config" content='{"globalViewTransitions":"true"}' /><meta name="viewport" content="width=device-width, shrink-to-fit=0, user-scalable=0, initial-scale=1"><title>분리ㅅㄱ</title><meta name="theme-color" content="#ffffff"><link rel="canonical" href="https://blisgo.org/templates/base/layout.html"><meta property="og:url" content="https://blisgo.org/templates/base/layout.html"><meta name="twitter:description" content="분리배출 도우미 사전"><meta name="twitter:image" content="https://blisgo.org/assets/img/favicon/512x512.png"><meta name="twitter:title" content="분리ㅅㄱ"><meta name="twitter:card" content="summary_large_image"><meta property="og:type" content="website"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta property="og:image" content="https://blisgo.org/assets/img/favicon/512x512.png"><meta name="description" content="분리배출 도우미 사전"><link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/assets/img/favicon/180x180.png"><link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicon/16x16.png"><link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicon/32x32.png"><link rel="icon" type="image/png" sizes="180x180" href="/assets/img/favicon/180x180.png"><link rel="icon" type="image/png" sizes="192x192" href="/assets/img/favicon/192x192.png"><link rel="icon" type="image/png" sizes="512x512" href="/assets/img/favicon/512x512.png"><link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css"><link rel="stylesheet" href="/assets/css/cmmn/style.min.css"><link rel="stylesheet" href="/assets/css/community/editorjs.min.css"><link rel="stylesheet" href="/assets/css/dictionary/autocomplete-theme-bootstrap.min.css"></head><body oncontextmenu="return false" ondragstart="return false"><header th:replace="~{/base/header::header}"></header><main layout:fragment="main"></main><div class="toast-container position-fixed bottom-0 start-50 translate-middle-x p-3" id="toast" th:insert="~{/base/toast::toast}"></div><script src="/assets/js/jquery.min.js"></script><script src="/assets/bootstrap/js/bootstrap.min.js"></script><script src="/assets/js/script.min.js"></script><script src="/assets/js/cmmn/htmx.min.js"></script><script src="/assets/js/app.mjs" type="module"></script><script src="/assets/js/cmmn/theme-switch.mjs" type="module"></script><script src="/assets/js/cmmn/toast.mjs" type="module"></script></body></html>
2 changes: 1 addition & 1 deletion app/src/main/resources/templates/community/board.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<!DOCTYPE html><html data-bs-theme="dark" lang="ko" layout:decorate="~{/base/layout}"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, shrink-to-fit=0, user-scalable=0, initial-scale=1"><title>📑 - 분리ㅅㄱ</title><meta name="theme-color" content="#ffffff"><link rel="canonical" href="https://blisgo.org/templates/community/board.html"><meta property="og:url" content="https://blisgo.org/templates/community/board.html"><meta name="twitter:description" content="분리배출 도우미 사전"><meta name="twitter:image" content="https://blisgo.org/assets/img/favicon/512x512.png"><meta name="twitter:title" content="분리ㅅㄱ"><meta name="twitter:card" content="summary_large_image"><meta property="og:type" content="website"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta property="og:image" content="https://blisgo.org/assets/img/favicon/512x512.png"><meta name="description" content="분리배출 도우미"><link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/assets/img/favicon/180x180.png"><link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicon/16x16.png"><link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicon/32x32.png"><link rel="icon" type="image/png" sizes="180x180" href="/assets/img/favicon/180x180.png"><link rel="icon" type="image/png" sizes="192x192" href="/assets/img/favicon/192x192.png"><link rel="icon" type="image/png" sizes="512x512" href="/assets/img/favicon/512x512.png"><link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css"></head><body><main class="container" layout:fragment="main"><section id="posts"><div class="list-group list-group-flush scrollarea" th:fragment="posts"><!-- Start: hx-get --><a class="list-group-item list-group-item-action border-0 p-0" th:attr="hx-get='/posts?lastPostId='+${posts?.getNumberOfElements() > 0 ? posts.getContent().get(posts.getNumberOfElements()-1).postId() : ''}" hx-trigger="revealed" hx-swap="beforeend" th:if="${posts==null || posts?.hasNext()}" hx-target="#posts"></a><!-- End: hx-get --><a class="list-group-item list-group-item-action border-0 p-1" id="post" th:each="post: ${posts?.getContent()}" aria-current="true" th:href="@{~/community/{postId}(postId=${post.postId})}"><div class="hstack shadow-sm" th:style="'border-left-style: solid;border-left-color: ' + ${post?.color != null ? post?.color : 'var(--bs-info-text-emphasis)'} + ';'"><div class="vstack text-truncate p-2"><h5 class="text-truncate fw-bold" th:text="${post.title}">제목</h5><p class="text-truncate text-break" rows="2" th:utext="${#strings.isEmpty(post?.content?.preview)} ? #{community.board.post.preview.empty} : ${post.content.preview}">글내용</p><div class="hstack gap-1 text-muted"><img class="img-fluid border rounded border-0 d-none d-sm-inline" src="https://i.pravatar.cc/200?mg=2" width="30px" alt="프로필이미지" th:src="${post?.author?.picture?.url}"><small th:text="${post.author.name}">작성자</small><svg xmlns="https://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-clock-fill small">
<!DOCTYPE html><html data-bs-theme="dark" lang="ko" layout:decorate="~{/base/layout}"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, shrink-to-fit=0, user-scalable=0, initial-scale=1"><title>📑 - 분리ㅅㄱ</title><meta name="theme-color" content="#ffffff"><link rel="canonical" href="https://blisgo.org/templates/community/board.html"><meta property="og:url" content="https://blisgo.org/templates/community/board.html"><meta name="twitter:description" content="분리배출 도우미 사전"><meta name="twitter:image" content="https://blisgo.org/assets/img/favicon/512x512.png"><meta name="twitter:title" content="분리ㅅㄱ"><meta name="twitter:card" content="summary_large_image"><meta property="og:type" content="website"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta property="og:image" content="https://blisgo.org/assets/img/favicon/512x512.png"><meta name="description" content="분리배출 도우미"><link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/assets/img/favicon/180x180.png"><link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicon/16x16.png"><link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicon/32x32.png"><link rel="icon" type="image/png" sizes="180x180" href="/assets/img/favicon/180x180.png"><link rel="icon" type="image/png" sizes="192x192" href="/assets/img/favicon/192x192.png"><link rel="icon" type="image/png" sizes="512x512" href="/assets/img/favicon/512x512.png"><link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css"></head><body><main class="container" layout:fragment="main"><section id="posts"><div class="list-group list-group-flush scrollarea" th:fragment="posts"><!-- Start: hx-get --><a class="list-group-item list-group-item-action border-0 p-0" th:attr="hx-get='/posts?lastPostId='+${posts?.getNumberOfElements() > 0 ? posts.getContent().get(posts.getNumberOfElements()-1).postId() : ''}" hx-trigger="revealed" hx-swap="beforeend transition:false" th:if="${posts==null || posts?.hasNext()}" hx-target="#posts"></a><!-- End: hx-get --><a class="list-group-item list-group-item-action border-0 p-1" id="post" th:each="post: ${posts?.getContent()}" aria-current="true" th:href="@{~/community/{postId}(postId=${post.postId})}"><div class="hstack shadow-sm" th:style="'border-left-style: solid;border-left-color: ' + ${post?.color != null ? post?.color : 'var(--bs-info-text-emphasis)'} + ';'"><div class="vstack text-truncate p-2"><h5 class="text-truncate fw-bold" th:text="${post.title}">제목</h5><p class="text-truncate text-break" rows="2" th:utext="${#strings.isEmpty(post?.content?.preview)} ? #{community.board.post.preview.empty} : ${post.content.preview}">글내용</p><div class="hstack gap-1 text-muted"><img class="img-fluid border rounded border-0 d-none d-sm-inline" src="https://i.pravatar.cc/200?mg=2" width="30px" alt="프로필이미지" th:src="${post?.author?.picture?.url}"><small th:text="${post.author.name}">작성자</small><svg xmlns="https://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-clock-fill small">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71z"></path>
</svg><small th:text="${#temporals.format(post?.modifiedDate, 'yyyy-MM-dd')}">작성일</small><svg xmlns="https://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-suit-heart-fill small">
<path d="M4 1c2.21 0 4 1.755 4 3.92C8 2.755 9.79 1 12 1s4 1.755 4 3.92c0 3.263-3.234 4.414-7.608 9.608a.513.513 0 0 1-.784 0C3.234 9.334 0 8.183 0 4.92 0 2.755 1.79 1 4 1"></path>
Expand Down
Loading

0 comments on commit f0bea4f

Please sign in to comment.