152 lines
5.9 KiB
HTML
152 lines
5.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
|
<!-- 公共的 head 部分，可以定义部分 links,scripts,styles -->
|
|
<head th:fragment="head(metas,links,scripts)">
|
|
<meta charset="UTF-8">
|
|
<meta content="IE=edge" http-equiv="X-UA-Compatible">
|
|
<meta content="width=device-width,initial-scale=1" name="viewport">
|
|
<title th:text="${site.title}"></title>
|
|
<meta content="telephone=no" name="format-detection">
|
|
<meta content="var(--heo-card-bg)" name="theme-color">
|
|
|
|
<link rel="shortcut icon"
|
|
th:href="@{${#strings.isEmpty(site.favicon) ? '/assets/images/hao-logo.jpg' : site.favicon}}"/>
|
|
|
|
<script th:src="@{/assets/js/heo.js}"></script>
|
|
|
|
<link rel="stylesheet" th:href="@{/assets/zhheo/zhheoblog.css}">
|
|
|
|
<link rel="stylesheet" th:href="@{/assets/zhheo/custom.css}">
|
|
|
|
<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/6.2.0/css/all.min.css">
|
|
|
|
<link media="print"
|
|
onload='this.media="all"'
|
|
rel="stylesheet"
|
|
th:href="@{/assets/libs/iconfont/iconfont.css}">
|
|
|
|
<!-- 右下角通知 -->
|
|
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/node-snackbar/0.1.16/snackbar.min.css"
|
|
media="print"
|
|
onload='this.media="all"'
|
|
rel="stylesheet"
|
|
/>
|
|
|
|
<script>
|
|
(win => {
|
|
win.saveToLocal = {
|
|
set: function setWithExpiry(key, value, ttl) {
|
|
if (ttl === 0) return
|
|
const now = new Date()
|
|
const expiryDay = ttl * 86400000
|
|
const item = {
|
|
value: value,
|
|
expiry: now.getTime() + expiryDay,
|
|
}
|
|
localStorage.setItem(key, JSON.stringify(item))
|
|
},
|
|
|
|
get: function getWithExpiry(key) {
|
|
const itemStr = localStorage.getItem(key)
|
|
|
|
if (!itemStr) {
|
|
return undefined
|
|
}
|
|
const item = JSON.parse(itemStr)
|
|
const now = new Date()
|
|
|
|
if (now.getTime() > item.expiry) {
|
|
localStorage.removeItem(key)
|
|
return undefined
|
|
}
|
|
return item.value
|
|
}
|
|
}
|
|
|
|
win.getScript = url => new Promise((resolve, reject) => {
|
|
const script = document.createElement('script')
|
|
script.src = url
|
|
script.async = true
|
|
script.onerror = reject
|
|
script.onload = script.onreadystatechange = function () {
|
|
const loadState = this.readyState
|
|
if (loadState && loadState !== 'loaded' && loadState !== 'complete') return
|
|
script.onload = script.onreadystatechange = null
|
|
resolve()
|
|
}
|
|
document.head.appendChild(script)
|
|
})
|
|
|
|
win.activateDarkMode = function () {
|
|
document.documentElement.setAttribute('data-theme', 'dark')
|
|
heo.initThemeColor()
|
|
}
|
|
win.activateLightMode = function () {
|
|
document.documentElement.setAttribute('data-theme', 'light')
|
|
heo.initThemeColor()
|
|
}
|
|
const t = saveToLocal.get('theme')
|
|
|
|
const isDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches
|
|
const isLightMode = window.matchMedia('(prefers-color-scheme: light)').matches
|
|
const isNotSpecified = window.matchMedia('(prefers-color-scheme: no-preference)').matches
|
|
const hasNoSupport = !isDarkMode && !isLightMode && !isNotSpecified
|
|
|
|
if (t === undefined) {
|
|
if (isLightMode) activateLightMode()
|
|
else if (isDarkMode) activateDarkMode()
|
|
else if (isNotSpecified || hasNoSupport) {
|
|
const now = new Date()
|
|
const hour = now.getHours()
|
|
const isNight = hour <= 6 || hour >= 18
|
|
isNight ? activateDarkMode() : activateLightMode()
|
|
}
|
|
window.matchMedia('(prefers-color-scheme: dark)').addListener(function (e) {
|
|
if (saveToLocal.get('theme') === undefined) {
|
|
e.matches ? activateDarkMode() : activateLightMode()
|
|
}
|
|
})
|
|
} else if (t === 'light') activateLightMode()
|
|
else activateDarkMode()
|
|
|
|
const asideStatus = saveToLocal.get('aside-status')
|
|
if (asideStatus !== undefined) {
|
|
if (asideStatus === 'hide') {
|
|
document.documentElement.classList.add('hide-aside')
|
|
} else {
|
|
document.documentElement.classList.remove('hide-aside')
|
|
}
|
|
}
|
|
})(window)
|
|
</script>
|
|
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.6.0/jquery.min.js"></script>
|
|
|
|
<!-- 动态加载条 -->
|
|
<script data-pace-options='{ "restartOnRequestAfter":false,"eventLag":false}'
|
|
src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/pace/1.2.4/pace.min.js"
|
|
th:if="${theme.config.other.loadProgressBar}">
|
|
</script>
|
|
|
|
<!-- 复制 https://github.com/zenorocha/clipboard.js -->
|
|
<script th:src="@{/assets/libs/clipboard/clipboard.min.js}"></script>
|
|
|
|
<!-- swiper 在瞬间滚动时会使用 -->
|
|
<link rel="stylesheet" th:href="@{/assets/libs/swiper/swiper-bundle.min.css}"/>
|
|
<script th:src="@{/assets/libs/swiper/swiper-bundle.min.js}"></script>
|
|
|
|
<!-- 补充部分 -->
|
|
<th:block th:if="${metas != null}">
|
|
<th:block th:replace="${metas}"/>
|
|
</th:block>
|
|
|
|
<th:block th:if="${links != null}">
|
|
<th:block th:replace="${links}"/>
|
|
</th:block>
|
|
|
|
<th:block th:if="${scripts != null}">
|
|
<th:block th:replace="${scripts}"/>
|
|
</th:block>
|
|
</head>
|
|
|
|
</html>
|