适配瞬间插件

Roozenlz · Aug 22, 2023 · 9f0c46b · 9f0c46b
1 parent 237a3bb
commit 9f0c46b
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 0 deletions.
diff --git a/settings.yaml b/settings.yaml
@@ -566,6 +566,14 @@ spec:
               label: "xonokai"
             - value: "z-touch"
               label: "z-touch"
+    - group: title
+      label: 标题
+      formSchema:
+        - $formkit: text
+          name: moments_title
+          label: 瞬间页面顶部文字
+          help: 需要安装瞬间插件，然后访问 /moments
+          value: 我的动态
     - group: other
       label: 其他设置
       formSchema:

diff --git a/templates/moments.html b/templates/moments.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html xmlns:th="https://www.thymeleaf.org"
+      th:replace="~{layout :: html(head = null,content = ~{::content})}">
+<th:block th:fragment="content">
+    <th:block th:replace="~{macro/app-banner :: app-banner(img=${theme.config.top.archives_img})}"/>
+    <link rel="stylesheet" th:href="@{/assets/css/archives.css}">
+    <div class="relative z-10">
+        <div class="flex flex-col">
+            <!--面包屑-->
+            <th:block th:replace="~{macro/breadcrumbs :: breadcrumbs('首页','说说')}"/>
+            <div class="bg-ob-deep-800 px-14 py-16 rounded-2xl shadow-xl block min-h-screen">
+                <ul class="timeline timeline-centered">
+                    <li class="timeline-item period">
+                        <div class="timeline-info"></div>
+                        <div class="timeline-marker"></div>
+                        <div class="timeline-content">
+                            <h2 class="timeline-title" th:text="${theme.config.title.moments_title}"></h2>
+                        </div>
+                    </li>
+                    <li class="timeline-item"
+                        th:each="moment : ${moments.items}"
+                        th:with="content=${moment.spec.content}">
+                        <div class="timeline-info">
+                            <span th:text="${#dates.format(moment.spec.releaseTime, 'MM/dd/yyyy')}"></span></div>
+                        <div class="timeline-marker"></div>
+                        <div class="timeline-content">
+                            <div class="timeline-title" th:if="${not #strings.isEmpty(content.html)}"
+                                 th:utext="${content.html}"></div>
+                            <div style="display: flex;justify-content: space-between;flex-wrap: wrap">
+                                <th:block th:if="${not #lists.isEmpty(content.medium)}"
+                                          th:each="momentItem : ${content.medium}">
+                                    <img th:if="${momentItem.type.name == 'PHOTO'}" th:src="${momentItem.url}"/>
+                                    <video th:if="${momentItem.type.name == 'VIDEO'}"
+                                           th:src="${momentItem.url}"></video>
+                                </th:block>
+                            </div>
+                        </div>
+                    </li>
+                </ul>
+                <!--                 分页 -->
+                <div th:replace="~{modules/widgets/page :: page('/moments',${moments})}"></div>
+            </div>
+        </div>
+    </div>
+</th:block>
+</html>