优化阅读体验、前台编辑、播放器等

This commit is contained in:
anian
2026-07-22 01:54:46 +08:00
parent 041fd0f7cf
commit 32bf39f733
20 changed files with 896 additions and 653 deletions
+1 -1
View File
@@ -1,5 +1,5 @@
<th:block th:fragment="footer">
<th:block th:with="customJsVersion='1.2.5-7'">
<th:block th:with="customJsVersion='1.2.5-7-TYIL'">
<!-- 奇遇容器 -->
<div class="center-img-container" id="centerImgContainer">
+1 -56
View File
@@ -1,4 +1,4 @@
<th:block th:fragment="head" th:with="customJsVersion=${'1.2.5-7'}">
<th:block th:fragment="head" th:with="customJsVersion=${'1.2.5-7-DFQP'}">
<th:block th:replace="~{'modules/variables/msg'}" />
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
@@ -6,61 +6,6 @@
<link rel="shortcut icon" th:href="@{${theme.config.base_set.favicon}}" title="Favicon">
<meta name="robots" content="max-image-preview:large">
<!-- <style>
.dl-warning-card { overflow: hidden; position: fixed; bottom: 1rem; left: 0; right: 0; margin: 0 auto; background-color: #ffffff; border-radius: 0.5rem; max-width: 720px; width: calc(100% - 2rem); box-shadow: 0 4px 12px rgba(0,0,0,0.1); z-index: 9999; display: none; opacity: 0; transform: translateY(20px); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-sizing: border-box; border-left: 4px solid #f59e0b; }
.dl-warning-header { display: flex; align-items: center; padding: 1rem; gap: 1rem; }
.dl-warning-image { flex-shrink: 0; background-color: #fef3c7; justify-content: center; align-items: center; width: 2.5rem; height: 2.5rem; border-radius: 9999px; display: flex; }
.dl-warning-image svg { color: #f59e0b; width: 1.25rem; height: 1.25rem; }
.dl-warning-content { flex: 1; text-align: left; word-wrap: break-word; word-break: break-all; min-width: 0; }
.dl-warning-title { color: #F59E0B; font-size: 0.95rem; font-weight: 600; line-height: 1.3rem; display: block; margin-bottom: 0.25rem; }
.dl-warning-message { color: #6b7280; font-size: 0.875rem; line-height: 1.25rem; margin: 0; }
.dl-warning-actions { display: flex; flex-direction: row; gap: 0.75rem; align-items: center; flex-shrink: 0; }
.dl-warning-desactivate { padding: 0.375rem 0.75rem; background-color: #f59e0b; color: #ffffff; font-size: 0.875rem; line-height: 1.25rem; font-weight: 500; justify-content: center; align-items: center; display: inline-flex; border-radius: 0.375rem; border: none; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05); cursor: pointer; white-space: nowrap; }
.dl-warning-desactivate.loading { background-color: #d97706; cursor: not-allowed; opacity: 0.8; pointer-events: none; }
.dl-warning-desactivate.loading::after { content: ""; width: 0.75rem; height: 0.75rem; border: 2px solid rgba(255,255,255,0.5); border-top-color: #ffffff; border-radius: 50%; margin-left: 0.5rem; margin-right: 0.25rem; animation: spin 1s linear infinite; flex-shrink: 0; }
.dl-warning-desactivate:not(.loading):hover { background-color: #fbbf24; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.06); transition: all 0.2s ease-in-out; }
.dl-warning-cancel { padding: 0.375rem 0.75rem; background-color: #ffffff; color: #374151; font-size: 0.875rem; line-height: 1.25rem; font-weight: 500; justify-content: center; align-items: center; display: inline-flex; border-radius: 0.375rem; border: 1px solid #d1d5db; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05); cursor: pointer; white-space: nowrap; }
.dl-warning-cancel:hover { background-color: #ededed; border-color: #e5e7eb; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.06); transition: all 0.2s ease-in-out; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@media (max-width: 480px) {
.dl-warning-card { bottom: 1rem; width: calc(100% - 1rem); max-width: 100%; }
.dl-warning-header { padding: 0.75rem; gap: 0.75rem; align-items: center; }
.dl-warning-image { width: 2rem; height: 2rem; }
.dl-warning-image svg { width: 1rem; height: 1rem; }
.dl-warning-title { font-size: 0.9rem; }
.dl-warning-message { font-size: 0.85rem; }
.dl-warning-actions { flex-direction: column; gap: 0.375rem; align-items: stretch; flex-shrink: 0; width: auto; margin-top: 0; }
.dl-warning-desactivate, .dl-warning-cancel { font-size: 0.75rem; padding: 0.25rem 0.5rem; width: 100%; }
.dl-warning-content { min-width: 0; word-wrap: break-word; word-break: break-all; }
}
</style>
<div class="dl-warning-card" id="lineCard">
<div class="dl-warning-header">
<div class="dl-warning-image"><svg aria-hidden="true" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" fill="none"><path d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" stroke-linejoin="round" stroke-linecap="round"></path></svg></div>
<div class="dl-warning-content"><span class="dl-warning-title" id="cardHeading"></span><p class="dl-warning-message" id="cardPara"></p></div>
<div class="dl-warning-actions"><button class="dl-warning-desactivate" id="switchBtn"></button><button class="dl-warning-cancel" id="cancelBtn">取消</button></div>
</div>
</div>
<script>
(function () {
const lineCardEl = document.getElementById('lineCard'), cardHeadingEl = document.getElementById('cardHeading'), cardParaEl = document.getElementById('cardPara'), switchLineBtn = document.getElementById('switchBtn'), cancelLineBtn = document.getElementById('cancelBtn');
const getCookie = (name) => document.cookie.split('; ').find(row => row.startsWith(`${name}=`))?.split('=')[1];
const setSessionCookie = (name, value, domain = 'anian.cc') => document.cookie = `${name}=${value}; path=/; domain=${domain}; SameSite=Lax`;
const showLineCard = () => { lineCardEl.style.display = 'block'; setTimeout(() => { lineCardEl.style.opacity = '1'; lineCardEl.style.transform = 'translateY(0)'; }, 10) };
const hideLineCard = (setNoPrompt = false, setNoSpeedTest = false) => { lineCardEl.style.opacity = '0'; lineCardEl.style.transform = 'translateY(20px)'; setTimeout(() => { lineCardEl.style.display = 'none'; if (setNoPrompt) setSessionCookie('noPrompt_anian_cc', 'true'); if (setNoSpeedTest) setSessionCookie('noSpeedTest_anian_cc', 'true'); }, 300) };
const handleLineSwitch = (baseUrl) => { switchLineBtn.classList.add('loading'); switchLineBtn.textContent = '切换中'; switchLineBtn.disabled = true; const currentScrollTop = window.scrollY || document.documentElement.scrollTop; document.cookie = `scrollParam=${currentScrollTop}; path=/; domain=anian.cc`; let finalUrl = baseUrl + location.pathname + location.search + location.hash; setTimeout(() => location.href = finalUrl, 500) };
let isResourceLoaded = false, pageLoadTimeoutTimer = null, isLoadTimeoutAborted = false;
const currentHost = location.hostname, isMainDomain = currentHost === 'anian.cc', isSubDomain = currentHost === 'www.anian.cc', isTestDomain = !isMainDomain && !isSubDomain;
const scrollParam = getCookie('scrollParam'), noPromptCookie = getCookie('noPrompt_anian_cc'), noSpeedTestCookie = getCookie('noSpeedTest_anian_cc');
cancelLineBtn.addEventListener('click', () => { hideLineCard(!isMainDomain, isMainDomain); });
if (isSubDomain) { if (!scrollParam && !noPromptCookie) { cardHeadingEl.textContent = '温馨提示'; cardParaEl.textContent = '当前为备用线路,若主线路正常,请优先选择主线路'; switchLineBtn.textContent = '切换主线路'; switchLineBtn.onclick = () => handleLineSwitch('https://anian.cc'); showLineCard(); } }
if (isMainDomain) { if (!noSpeedTestCookie) { pageLoadTimeoutTimer = setTimeout(() => { if (!isResourceLoaded) { isLoadTimeoutAborted = true; cardHeadingEl.textContent = '线路异常'; cardParaEl.textContent = '当前线路拥塞,若本地网络正常,可尝试切换至备用线路'; switchLineBtn.textContent = '切换副线路'; switchLineBtn.onclick = () => handleLineSwitch('https://www.anian.cc'); showLineCard(); } }, 15000); window.onload = () => { isResourceLoaded = true; clearTimeout(pageLoadTimeoutTimer); if (isLoadTimeoutAborted) return; const xhr = new XMLHttpRequest(); xhr.open('GET', `/upload/%E4%B8%8B%E8%BD%BD%20(9).mp4?_t=${Date.now()}`, true); let t = setTimeout(() => { xhr.abort(); cardHeadingEl.textContent = '线路异常'; cardParaEl.textContent = '当前线路拥塞,若本地网络正常,可尝试切换至备用线路'; switchLineBtn.textContent = '切换副线路'; switchLineBtn.onclick = () => handleLineSwitch('https://www.anian.cc'); showLineCard() }, 7500); xhr.onload = xhr.onerror = xhr.onabort = () => clearTimeout(t); xhr.send(); } } }
if (isTestDomain) { if (!noPromptCookie) { cardHeadingEl.textContent = '线路警告'; cardParaEl.textContent = '当前为测试线路,若非开发所需,请优先选择主线路'; switchLineBtn.textContent = '切换主线路'; switchLineBtn.onclick = () => handleLineSwitch('https://anian.cc'); showLineCard(); } }
})();
</script> -->
<link rel="stylesheet" id="wp-block-library-css" th:href="@{/assets/css/style.min.css(v=${customJsVersion})}" media="all">
<link rel="stylesheet" id="pix-style-css" th:href="@{/assets/css/style.css(v=${customJsVersion})}" media="all">
<link rel="stylesheet" id="fancybox.css-css" th:href="@{/assets/libs/fancybox/jquery.fancybox.min.css(v=${customJsVersion})}" media="all">
-13
View File
@@ -20,19 +20,6 @@
</header><!-- #masthead -->
<!-- <div class="index_banner">
<div class="bg bg1"></div>
<div class="bg bg2"></div>
<div class="user_info">
<div class="top">
<div class="left">
<div class="name">[[${theme.config.base_set.nice_name}]]</div>
<div class="des">[[${theme.config.base_set.admin_des}]]</div>
</div>
<div class="avatar"><img th:src="${theme.config.base_set.default_avatar}"></div>
</div>
</div>
</div> -->
<div class="index_banner" id="banner" uk-img="loading: eager">
<div class="user_info">
<div class="top">
@@ -28,70 +28,6 @@
</a>
</div>
<!-- <div class="m_top_nav top_tool is_mobile">
<a class="top_nav_btn" uk-toggle="target: #m_offcanvas"><i class="ri-menu-2-line"></i></a>
<div id="m_offcanvas" class="m_offcanvas uk-animation-fast"
uk-offcanvas="overlay: true;mode: push;container:.main_wrap">
<div class="uk-offcanvas-bar inner"
th:with="topMenu = ${#strings.isEmpty(theme.config.base_set.left_nav) ? menuFinder.getPrimary() : menuFinder.getByName(theme.config.base_set.left_nav)}">
<div class="m_logo"><a href="/"><img th:src="${theme.config.base_top_set.mobile_logo}"></a></div>
<div class="menu-top-container" th:if="${not #lists.isEmpty(topMenu)}">
<ul id="top_menu" class="menu">
<th:block th:each="menuItem : ${topMenu.menuItems}">
<li th:unless="${not #lists.isEmpty(menuItem.children)}"
class="menu-item menu-item-type-post_type menu-item-object-page">
<a th:target="${menuItem.spec.target?.value}" th:href="@{${menuItem.status.href}}"
th:with="icon = ${#annotations.getOrDefault(menuItem, 'icon', '')}">
<th:block th:if="${not #strings.isEmpty(icon)}"
th:with="index = ${icon.lastIndexOf('.')}">
<i th:unless="${index!=-1}" th:class="${icon}"></i>
<img th:if="${index!=-1}" th:src="${icon}">
</th:block>
<span class="nav_title" th:text="${menuItem.status.displayName}"></span>
</a>
</li>
<li th:if="${not #lists.isEmpty(menuItem.children)}"
class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children has_children"
th:classappend="${'menu-item-'+iterStat.index}">
<a href="#" th:with="icon = ${#annotations.getOrDefault(menuItem, 'icon', '')}">
<th:block th:if="${not #strings.isEmpty(icon)}"
th:with="index = ${icon.lastIndexOf('.')}">
<i th:unless="${index!=-1}" th:class="${icon}"></i>
<img th:if="${index!=-1}" th:src="${icon}">
</th:block>
<span class="nav_title">[[${menuItem.status.displayName}]]</span>
<i class="ri-arrow-down-s-line drop_icon"></i>
</a>
<ul class="sub-menu">
<li th:each="childMenu,iterStat : ${menuItem.children}"
th:id="${'menu-item-'+iterStat.index}"
class="menu-item menu-item-type-custom menu-item-object-custom"
th:classappend="${'menu-item-'+iterStat.index}">
<a th:href="@{${childMenu.status.href}}"
th:with="icon = ${#annotations.getOrDefault(childMenu, 'icon', '')}"
th:target="${childMenu.spec.target?.value}">
<th:block th:if="${not #strings.isEmpty(icon)}"
th:with="index = ${icon.lastIndexOf('.')}">
<i th:unless="${index!=-1}" th:class="${icon}"></i>
<img th:if="${index!=-1}" th:src="${icon}">
</th:block>
<span class="nav_title">[[${childMenu.status.displayName}]]</span>
</a>
</li>
</ul>
</li>
</th:block>
</ul>
</div>
<div th:unless="${not #lists.isEmpty(topMenu)}" class="nav_tips">请前往后台设置左侧菜单/移动端菜单</div>
</div>
</div>
</div> -->
<!-- 搜索区域 -->
<div class="search_mod">
<div th:if="${pluginFinder.available('PluginSearchWidget')}" class="t_search_on top_tool icon_color">