885 lines
64 KiB
HTML
885 lines
64 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'about')}"
|
|
xmlns:th="http://www.thymeleaf.org">
|
|
|
|
<th:block th:fragment="content">
|
|
|
|
<div class="page" id="body-wrap">
|
|
|
|
<!-- 头部导航栏 -->
|
|
<header class="not-top-img" id="page-header">
|
|
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
|
</header>
|
|
<main class="layout hide-aside" id="content-inner">
|
|
<div id="page">
|
|
|
|
<div id="about-page">
|
|
|
|
|
|
<div class="author-info">
|
|
<div class="author-tag-left"
|
|
th:if="${not #lists.isEmpty(theme.config.about.authorInfoLeftTags)}"
|
|
th:with="authorTags = ${theme.config.about.authorInfoLeftTags}">
|
|
<span class="author-tag" th:each="authorTag : ${authorTags}"
|
|
th:text="${authorTag.tag}"></span>
|
|
</div>
|
|
<div class="author-img">
|
|
<img th:src="@{${#strings.isEmpty(site.favicon) ? '/assets/images/hao-logo.jpg' : site.favicon}}">
|
|
</div>
|
|
<div class="author-tag-right"
|
|
th:if="${not #lists.isEmpty(theme.config.about.authorInfoRightTags)}"
|
|
th:with="authorTags = ${theme.config.about.authorInfoRightTags}">
|
|
<span class="author-tag" th:each="authorTag : ${authorTags}"
|
|
th:text="${authorTag.tag}"></span>
|
|
</div>
|
|
</div>
|
|
<div class="author-title">关于本站</div>
|
|
|
|
|
|
<div class="author-content">
|
|
<div class="author-content-item myInfoAndSayHello"
|
|
th:utext="${theme.config.about.content}"></div>
|
|
<div class="aboutsiteTips author-content-item" th:utext="${theme.config.about.idea}"></div>
|
|
</div>
|
|
<script>
|
|
var pursuitInterval = null;
|
|
pursuitInterval = setInterval(function () {
|
|
const show = document.querySelector('span[data-show]')
|
|
const next = show.nextElementSibling || document.querySelector('.first-tips')
|
|
const up = document.querySelector('span[data-up]')
|
|
if (up) {
|
|
up.removeAttribute('data-up')
|
|
}
|
|
show.removeAttribute('data-show')
|
|
show.setAttribute('data-up', '')
|
|
next.setAttribute('data-show', '')
|
|
}, 2000)
|
|
|
|
document.addEventListener('pjax:send', function () {
|
|
clearInterval(pursuitInterval);
|
|
});
|
|
</script>
|
|
|
|
<div class="author-content">
|
|
|
|
<div class="author-content-item skills">
|
|
<div class="card-content">
|
|
<div class="author-content-item-tips">技能</div>
|
|
<span class="author-content-item-title">开启创造力</span>
|
|
<div class="skills-style-group">
|
|
<div class="tags-group-all">
|
|
<div class="tags-group-wrapper">
|
|
<div class="tags-group-all">
|
|
<!-- banners 使用默认值-->
|
|
<div class="tags-group-wrapper"
|
|
th:if="${#strings.equals(theme.config.top.bannersBackground, 'default')}">
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#989bf8">
|
|
<img th:src="@{/assets/images/icons/AfterEffect.png}"
|
|
title="AfterEffect">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#fff">
|
|
<img th:src="@{/assets/images/icons/Sketch.png}"
|
|
title="Sketch">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#57b6e6">
|
|
<img th:src="@{/assets/images/icons/Docker.png}"
|
|
title="Docker">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#4082c3">
|
|
<img th:src="@{/assets/images/icons/Photoshop.png}"
|
|
title="Photoshop">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#fff">
|
|
<img th:src="@{/assets/images/icons/FinalCutPro.png}"
|
|
title="FinalCutPro">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#fff">
|
|
<img th:src="@{/assets/images/icons/Python.png}"
|
|
title="Python">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#eb6840">
|
|
<img th:src="@{/assets/images/icons/Swift.png}"
|
|
title="Swift">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#8f55ba">
|
|
<img th:src="@{/assets/images/icons/Principle.png}"
|
|
title="Principle">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#f29e39">
|
|
<img th:src="@{/assets/images/icons/illustrator.png}"
|
|
title="illustrator">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#2c51db">
|
|
<img th:src="@{/assets/images/icons/CSS3.png}" title="CSS3">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#f7cb4f">
|
|
<img th:src="@{/assets/images/icons/JS.png}" title="JS">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#e9572b">
|
|
<img th:src="@{/assets/images/icons/HTML.png}" title="HTML">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#df5b40">
|
|
<img th:src="@{/assets/images/icons/Git.webp}" title="Git">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#e65164">
|
|
<img th:src="@{/assets/images/icons/Apifox.webp}"
|
|
title="Apifox">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#989bf8">
|
|
<img th:src="@{/assets/images/icons/AfterEffect.png}"
|
|
title="AfterEffect">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#fff">
|
|
<img th:src="@{/assets/images/icons/Sketch.png}"
|
|
title="Sketch">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#57b6e6">
|
|
<img th:src="@{/assets/images/icons/Docker.png}"
|
|
title="Docker">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#4082c3">
|
|
<img th:src="@{/assets/images/icons/Photoshop.png}"
|
|
title="Photoshop">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#fff">
|
|
<img th:src="@{/assets/images/icons/FinalCutPro.png}"
|
|
title="FinalCutPro">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#fff">
|
|
<img th:src="@{/assets/images/icons/Python.png}"
|
|
title="Python">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#eb6840">
|
|
<img th:src="@{/assets/images/icons/Swift.png}"
|
|
title="Swift">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#8f55ba">
|
|
<img th:src="@{/assets/images/icons/Principle.png}"
|
|
title="Principle">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#f29e39">
|
|
<img th:src="@{/assets/images/icons/illustrator.png}"
|
|
title="illustrator">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#2c51db">
|
|
<img th:src="@{/assets/images/icons/CSS3.png}" title="CSS3">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#f7cb4f">
|
|
<img th:src="@{/assets/images/icons/JS.png}" title="JS">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#e9572b">
|
|
<img th:src="@{/assets/images/icons/HTML.png}" title="HTML">
|
|
</div>
|
|
</div>
|
|
<div class="tags-group-icon-pair">
|
|
<div class="tags-group-icon" style="background:#df5b40">
|
|
<img th:src="@{/assets/images/icons/Git.webp}" title="Git">
|
|
</div>
|
|
<div class="tags-group-icon" style="background:#e65164">
|
|
<img th:src="@{/assets/images/icons/Apifox.webp}"
|
|
title="Apifox">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- banners 使用默认值-->
|
|
<div class="tags-group-wrapper"
|
|
th:if="${#strings.equals(theme.config.top.bannersBackground, 'techStack')}"
|
|
th:with="techs = ${theme.config.about.techStack}">
|
|
<th:block th:each="tech,iterStat : ${techs}">
|
|
<div class="tags-group-icon-pair" th:if="${iterStat.odd}">
|
|
<div class="tags-group-icon"
|
|
th:style="'background:' + ${techOdd.background}"
|
|
th:with="techOdd = ${techs.get(iterStat.index - 1)}">
|
|
<img th:src="@{${techOdd.url}}"
|
|
th:title="${techOdd.name}">
|
|
</div>
|
|
|
|
<div class="tags-group-icon"
|
|
th:style="'background:' + ${techEven.background}"
|
|
th:with="techEven = ${tech}">
|
|
<img th:src="@{${techEven.url}}"
|
|
th:title="${techEven.name}">
|
|
</div>
|
|
</div>
|
|
</th:block>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- banners 使用默认值-->
|
|
<div class="skills-list"
|
|
th:if="${#strings.equals(theme.config.top.bannersBackground, 'default')}"
|
|
th:with="techs = ${theme.config.about.techStack}">
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#989bf8">
|
|
<img th:src="@{/assets/images/icons/AfterEffect.png}"
|
|
title="AfterEffect">
|
|
</div>
|
|
<div class="skill-name"><span>AfterEffect</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#ffffff">
|
|
<img th:src="@{/assets/images/icons/Sketch.png}" title="Sketch">
|
|
</div>
|
|
<div class="skill-name"><span>Sketch</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#57b6e6">
|
|
<img th:src="@{/assets/images/icons/Docker.png}" title="Docker">
|
|
</div>
|
|
<div class="skill-name"><span>Docker</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#4082c3">
|
|
<img th:src="@{/assets/images/icons/Photoshop.png}" title="Photoshop">
|
|
</div>
|
|
<div class="skill-name"><span>Photoshop</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#ffffff">
|
|
<img th:src="@{/assets/images/icons/FinalCutPro.png}"
|
|
title="FinalCutPro">
|
|
</div>
|
|
<div class="skill-name"><span>FinalCutPro</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#ffffff">
|
|
<img th:src="@{/assets/images/icons/Python.png}" title="Python">
|
|
</div>
|
|
<div class="skill-name"><span>Python</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#eb6840">
|
|
<img th:src="@{/assets/images/icons/Swift.png}" title="Swift">
|
|
</div>
|
|
<div class="skill-name"><span>Swift</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#8f55ba">
|
|
<img th:src="@{/assets/images/icons/Principle.png}" title="Principle">
|
|
</div>
|
|
<div class="skill-name"><span>Principle</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#f29e39">
|
|
<img th:src="@{/assets/images/icons/illustrator.png}"
|
|
title="illustrator">
|
|
</div>
|
|
<div class="skill-name"><span>illustrator</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#2c51db">
|
|
<img th:src="@{/assets/images/icons/CSS3.png}" title="CSS3">
|
|
</div>
|
|
<div class="skill-name"><span>CSS3</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#f7cb4f">
|
|
<img th:src="@{/assets/images/icons/JS.png}" title="JS">
|
|
</div>
|
|
<div class="skill-name"><span>JS</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#e9572b">
|
|
<img th:src="@{/assets/images/icons/HTML.png}" title="HTML">
|
|
</div>
|
|
<div class="skill-name"><span>HTML</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#df5b40">
|
|
<img th:src="@{/assets/images/icons/Git.webp}" title="Git">
|
|
</div>
|
|
<div class="skill-name"><span>Git</span></div>
|
|
</div>
|
|
|
|
<div class="skill-info">
|
|
<div class="skill-icon" style="background:#1f1f1f">
|
|
<img th:src="@{/assets/images/icons/Apifox.webp}" title="Apifox">
|
|
</div>
|
|
<div class="skill-name"><span>Apifox</span></div>
|
|
</div>
|
|
|
|
<div class="etc">...</div>
|
|
</div>
|
|
<div class="skills-list"
|
|
th:if="${#strings.equals(theme.config.top.bannersBackground, 'techStack')}"
|
|
th:with="techs = ${theme.config.about.techStack}">
|
|
<th:block th:each="tech : ${techs}">
|
|
<div class="skill-info">
|
|
<div class="skill-icon" th:style="'background:' + ${tech.background}">
|
|
<img th:src="@{${tech.url}}" th:title="${tech.name}">
|
|
</div>
|
|
<div class="skill-name"><span th:title="${tech.name}"></span></div>
|
|
</div>
|
|
</th:block>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="author-content-item careers">
|
|
<div class="card-content">
|
|
<div class="author-content-item-tips">生涯</div>
|
|
<span class="author-content-item-title"
|
|
th:text="${theme.config.about.authorCareersTitle}">无限进步</span>
|
|
<div class="careers-group"
|
|
th:if="${not #lists.isEmpty(theme.config.about.authorCareersTags)}"
|
|
th:with="careersTags = ${theme.config.about.authorCareersTags}">
|
|
<div class="careers-item" th:each="tag : ${careersTags}">
|
|
<div class="circle" th:style="'background:' + ${tag.background}"></div>
|
|
<div class="name" th:text="${tag.desc}"></div>
|
|
</div>
|
|
</div>
|
|
<img alt="生涯" class="author-content-img"
|
|
th:src="${#strings.isEmpty(theme.config.about.authorCareersBackground) ? '/assets/images/hao-logo.jpg' : theme.config.about.authorCareersBackground}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- personalities -->
|
|
<div class="author-content">
|
|
<div class="author-content-item personalities"
|
|
th:with="personality = ${theme.config.about.personalities}">
|
|
<div class="author-content-item-tips">性格</div>
|
|
|
|
<th:block th:if="${personality == 'infp'}">
|
|
<span class="author-content-item-title">调停者</span>
|
|
<div class="title2" style="color: #56a178;">INFP</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/infp.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/INFP-%E4%BA%BA%E6%A0%BC'}">调停者</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'intj'}">
|
|
<span class="author-content-item-title">建筑师</span>
|
|
<div class="title2" style="color: #56a178;">INTJ</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/intj.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/INTJ-%E4%BA%BA%E6%A0%BC'}">建筑师</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'intp'}">
|
|
<span class="author-content-item-title">逻辑学家</span>
|
|
<div class="title2" style="color: #56a178;">INTP</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/intp.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/INTP-%E4%BA%BA%E6%A0%BC'}">逻辑学家</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'entj'}">
|
|
<span class="author-content-item-title">指挥官</span>
|
|
<div class="title2" style="color: #56a178;">ENTJ</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/entj.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ENTJ-%E4%BA%BA%E6%A0%BC'}">指挥官</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'entp'}">
|
|
<span class="author-content-item-title">辩论家</span>
|
|
<div class="title2" style="color: #56a178;">ENTP</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/entp.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ENTP-%E4%BA%BA%E6%A0%BC'}">辩论家</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'enfj'}">
|
|
<span class="author-content-item-title">主人公</span>
|
|
<div class="title2" style="color: #56a178;">ENFJ</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/enfj.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ENFJ-%E4%BA%BA%E6%A0%BC'}">主人公</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'enfp'}">
|
|
<span class="author-content-item-title">竞选者</span>
|
|
<div class="title2" style="color: #56a178;">ENFP</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/enfp.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ENFP-%E4%BA%BA%E6%A0%BC'}">竞选者</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'estj'}">
|
|
<span class="author-content-item-title">总经理</span>
|
|
<div class="title2" style="color: #56a178;">ESTJ</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/estj.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ESTJ-%E4%BA%BA%E6%A0%BC'}">总经理</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'estp'}">
|
|
<span class="author-content-item-title">企业家</span>
|
|
<div class="title2" style="color: #56a178;">ESTP</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/estp.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ESTP-%E4%BA%BA%E6%A0%BC'}">企业家</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'esfj'}">
|
|
<span class="author-content-item-title">执政官</span>
|
|
<div class="title2" style="color: #56a178;">ESFJ</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/esfj.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ESFJ-%E4%BA%BA%E6%A0%BC'}">执政官</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'esfp'}">
|
|
<span class="author-content-item-title">表演者</span>
|
|
<div class="title2" style="color: #56a178;">ESFP</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/esfp.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ESFP-%E4%BA%BA%E6%A0%BC'}">表演者</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'infj'}">
|
|
<span class="author-content-item-title">提倡者</span>
|
|
<div class="title2" style="color: #56a178;">INFJ</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/infj.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/INFJ-%E4%BA%BA%E6%A0%BC'}">提倡者</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'istj'}">
|
|
<span class="author-content-item-title">物流师</span>
|
|
<div class="title2" style="color: #56a178;">ISTJ</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/istj.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ISTJ-%E4%BA%BA%E6%A0%BC'}">物流师</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'istp'}">
|
|
<span class="author-content-item-title">鉴赏家</span>
|
|
<div class="title2" style="color: #56a178;">ISTP</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/istp.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ISTP-%E4%BA%BA%E6%A0%BC'}">鉴赏家</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'isfj'}">
|
|
<span class="author-content-item-title">守卫者</span>
|
|
<div class="title2" style="color: #56a178;">ISFJ</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/isfj.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ISFJ-%E4%BA%BA%E6%A0%BC'}">守卫者</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
<th:block th:if="${personality == 'isfp'}">
|
|
<span class="author-content-item-title">探险家</span>
|
|
<div class="title2" style="color: #56a178;">ISFP</div>
|
|
<div class="image"><img src="/themes/theme-hao/assets/images/isfp.svg"
|
|
style="transform: rotateY(180deg);"></div>
|
|
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
|
rel="noopener nofollow" target="_blank">16personalities</a>
|
|
了解更多关于 <a
|
|
rel="noopener external nofollow"
|
|
target="_blank"
|
|
th:href="@{'https://www.16personalities.com/ch/ISFP-%E4%BA%BA%E6%A0%BC'}">探险家</a>
|
|
</div>
|
|
</th:block>
|
|
|
|
</div>
|
|
<div class="author-content-item myphoto"><img alt="自拍" class="author-content-img"
|
|
th:src="${theme.config.about.authorCareersPhoto}">
|
|
</div>
|
|
</div>
|
|
|
|
<!-- motto -->
|
|
<div class="author-content" th:with="texts = ${theme.config.about.textarea}">
|
|
<div class="author-content-item maxim">
|
|
<div class="author-content-item-tips" th:text="${texts[0].tittle}">座右铭</div>
|
|
<span class="maxim-title">
|
|
<span style="opacity: 0.6;margin-bottom:8px;" th:text="${texts[0].textarea_up}">生活原本沉闷，</span>
|
|
<span th:text="${texts[0].textarea_down}">但跑起来就有风。</span>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="author-content-item buff">
|
|
<div class="card-content">
|
|
<div class="author-content-item-tips" th:text="${texts[1].tittle}">特长</div>
|
|
<span class="buff-title">
|
|
<span style="opacity: 0.6;margin-bottom:8px;" th:text="${texts[1].textarea_up}">玄学流电脑疑难问题解决
|
|
<span class="inline-word">专家</span>
|
|
</span>
|
|
<span th:text="${texts[1].textarea_down}">软件学习能力</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- hobbies -->
|
|
<!-- <div class="author-content">-->
|
|
<!-- <div class="author-content-item left-side">-->
|
|
<!-- <img alt="" src="https://p.zhheo.com/2023788ba3b8739936f844e64f483faacaf1085602.png!cover">-->
|
|
<!-- <div class="card-content">-->
|
|
<!-- <div class="author-content-item-tips">英雄联盟</div>-->
|
|
<!-- <span class="author-content-item-title"></span>-->
|
|
<!-- <div class="content-bottom">-->
|
|
<!-- <div class="tips"></div>-->
|
|
<!-- <div class="tips"></div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- <div class="author-content-item right-side">-->
|
|
<!-- <img alt="" src="https://p.zhheo.com/2023ff56a55649cf81989b9e1f4efc836907085102.png!cover">-->
|
|
<!-- <div class="card-content">-->
|
|
<!-- <div class="author-content-item-tips">狼人杀</div>-->
|
|
<!-- <span class="author-content-item-title"></span>-->
|
|
<!-- <div class="content-bottom">-->
|
|
<!-- <div class="tips"></div>-->
|
|
<!-- <div class="tips"></div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- <div class="author-content">-->
|
|
|
|
<!-- <div-->
|
|
<!-- class="author-content-item like-technology"-->
|
|
<!-- style="background: url(https://p.zhheo.com/2023e6940f5f56f0004af2705c3586d1fdf5190802.png!cover)">-->
|
|
<!-- <div class="card-content">-->
|
|
<!-- <div class="author-content-item-tips">关注偏好</div>-->
|
|
<!-- <span class="author-content-item-title">数码科技</span>-->
|
|
<!-- <div class="content-bottom">-->
|
|
<!-- <div class="tips">手机、电脑软硬件</div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- <div-->
|
|
<!-- class="author-content-item like-music"-->
|
|
<!-- style="background: url(https://bu.dusays.com/2023/03/12/640dc6bed6d2d.jpg)">-->
|
|
<!-- <div class="card-content">-->
|
|
<!-- <div class="author-content-item-tips">音乐偏好</div>-->
|
|
<!-- <span class="author-content-item-title">Hiphop、民谣、华语流行</span>-->
|
|
<!-- <div class="content-bottom">-->
|
|
<!-- <div class="tips"></div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<div class="author-content">
|
|
<div class="about-statistic author-content-item"
|
|
style="background: url(https://bu.dusays.com/2023/03/12/640dc8c72f623.webp);">
|
|
<div class="card-content">
|
|
<div class="author-content-item-tips">数据</div>
|
|
<span class="author-content-item-title">访问统计</span>
|
|
<div id="statistic"></div>
|
|
<div class="post-tips">统计信息来自 <a href="https://invite.51.la/1NzKqTeb?target=V6"
|
|
rel="noopener nofollow"
|
|
target="_blank">51la网站统计</a></div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
fetch("https://v6-widget.51.la/v6/K0yfsHaZHpjPWap0/quote.js")
|
|
.then(res => res.text())
|
|
.then(data => {
|
|
let title = ["最近活跃", "今日人数", "今日访问", "昨日人数", "昨日访问", "本月访问", "总访问量"];
|
|
let num = data.match(/(<\/span><span>).*?(\/span><\/p>)/g);
|
|
num = num.map(el => {
|
|
let val = el.replace(/(<\/span><span>)/g, "");
|
|
let str = val.replace(/(<\/span><\/p>)/g, "");
|
|
return str;
|
|
});
|
|
let s = document.getElementById("statistic");
|
|
let statistic = [];
|
|
for (let i = 0; i < num.length; i++) {
|
|
if (i == 0 || i == num.length - 1) continue;
|
|
s.innerHTML += "<div><span>" + title[i] + "</span><span id=" + title[i] + ">" + num[i] + "</span></div>";
|
|
}
|
|
});
|
|
</script>
|
|
|
|
|
|
<div class="author-content-item-group column mapAndInfo">
|
|
<div class="author-content-item map single"
|
|
th:style="'background:' + ${theme.config.about.authorInfoAddressBackground} ">
|
|
<span class="map-title">我现在住在
|
|
<b th:text="${theme.config.about.authorInfoAddress}"></b>
|
|
</span>
|
|
</div>
|
|
<div class="author-content-item selfInfo single"
|
|
th:if="${not #lists.isEmpty(theme.config.about.authorInfo)}"
|
|
th:with="authorInfo = ${theme.config.about.authorInfo}">
|
|
<div th:each="info : ${authorInfo}">
|
|
<span class="selfInfo-title" th:text="${info.authorInfoTitle}"></span>
|
|
<span class="selfInfo-content" th:style="'color:' + ${info.authorInfoColor} "
|
|
th:text="${info.authorInfoContent}"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="author-content">
|
|
<div class="create-site-post author-content-item single">
|
|
<div class="author-content-item-tips">心路历程</div>
|
|
<span class="author-content-item-title"
|
|
th:text="${singlePage.spec.title}">为什么建站？</span>
|
|
<p th:utext="${singlePage.content.content}"></p>
|
|
</div>
|
|
</div>
|
|
<!-- <div class="author-content">-->
|
|
<!-- <div class="author-content-item single reward">-->
|
|
<!-- <div class="author-content-item-tips">致谢</div>-->
|
|
<!-- <span class="author-content-item-title">赞赏名单</span>-->
|
|
<!-- <div class="author-content-item-description">-->
|
|
<!-- 感谢赞赏的人，因为你们，让我感受到写博客这件事情能够给你们创造了价值。这会让我在这条路上走得更远。-->
|
|
<!-- </div>-->
|
|
<!-- <div class="reward-list-all">-->
|
|
|
|
<!-- <div class="reward-list-item">-->
|
|
<!-- <div class="reward-list-item-name">思宁</div>-->
|
|
<!-- <div class="reward-list-bottom-group">-->
|
|
<!-- <div class="reward-list-item-money">¥ 1</div>-->
|
|
<!-- <time class="datatime reward-list-item-time"-->
|
|
<!-- datetime="2021-05-06T08:00:00+08:00"></time>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- <div class="reward-list-item">-->
|
|
<!-- <div class="reward-list-item-name">小屁卡</div>-->
|
|
<!-- <div class="reward-list-bottom-group">-->
|
|
<!-- <div class="reward-list-item-money">¥ 3</div>-->
|
|
<!-- <time class="datatime reward-list-item-time"-->
|
|
<!-- datetime="2021-04-20T08:00:00+08:00"></time>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- <div class="reward-list-item">-->
|
|
<!-- <div class="reward-list-item-name">Adil</div>-->
|
|
<!-- <div class="reward-list-bottom-group">-->
|
|
<!-- <div class="reward-list-item-money" style="background: var(--heo-vip);">¥ 50-->
|
|
<!-- </div>-->
|
|
<!-- <time class="datatime reward-list-item-time"-->
|
|
<!-- datetime="2021-03-25T08:00:00+08:00"></time>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- <div class="reward-list-item">-->
|
|
<!-- <div class="reward-list-item-name">ғᴏᴜʀʏ</div>-->
|
|
<!-- <div class="reward-list-bottom-group">-->
|
|
<!-- <div class="reward-list-item-money">¥ 1</div>-->
|
|
<!-- <time class="datatime reward-list-item-time"-->
|
|
<!-- datetime="2021-03-13T08:00:00+08:00"></time>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- <div class="reward-list-item">-->
|
|
<!-- <div class="reward-list-item-name">**才</div>-->
|
|
<!-- <div class="reward-list-bottom-group">-->
|
|
<!-- <div class="reward-list-item-money">¥ 2</div>-->
|
|
<!-- <time class="datatime reward-list-item-time"-->
|
|
<!-- datetime="2021-02-17T08:00:00+08:00"></time>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- <div class="reward-list-item">-->
|
|
<!-- <div class="reward-list-item-name">ZEvan</div>-->
|
|
<!-- <div class="reward-list-bottom-group">-->
|
|
<!-- <div class="reward-list-item-money">¥ 1</div>-->
|
|
<!-- <time class="datatime reward-list-item-time"-->
|
|
<!-- datetime="2021-01-11T08:00:00+08:00"></time>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
<!-- <div class="post-reward">-->
|
|
<!-- <div class="post-reward" onclick="AddRewardMask()"></div>-->
|
|
<!-- <div class="reward-button" title="赞赏作者"><i-->
|
|
<!-- class="heofont icon-hand-heart-fill"></i>-->
|
|
<!-- 打赏作者-->
|
|
<!-- </div>-->
|
|
<!-- <div class="reward-main">-->
|
|
<!-- <ul class="reward-all">-->
|
|
<!-- <span class="reward-title">感谢你赐予我前进的力量</span>-->
|
|
<!-- <ul class="reward-group">-->
|
|
|
|
|
|
<!-- <li class="reward-item">-->
|
|
<!-- <a href="" target="_blank">-->
|
|
<!-- <img alt="微信" class="post-qr-code-img" src="">-->
|
|
<!-- </a>-->
|
|
<!-- <div class="post-qr-code-desc">-->
|
|
<!-- 微信-->
|
|
<!-- </div>-->
|
|
<!-- </li>-->
|
|
|
|
<!-- <li class="reward-item">-->
|
|
<!-- <a href="" target="_blank">-->
|
|
<!-- <img alt="支付宝" class="post-qr-code-img" src="">-->
|
|
<!-- </a>-->
|
|
<!-- <div class="post-qr-code-desc">-->
|
|
<!-- 支付宝-->
|
|
<!-- </div>-->
|
|
<!-- </li>-->
|
|
|
|
<!-- </ul>-->
|
|
<!-- </ul>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
|
|
</div>
|
|
|
|
<!-- 评论模块 -->
|
|
<div id="post-comment"
|
|
th:if="${pluginFinder.available('PluginCommentWidget') and singlePage.spec.allowComment}">
|
|
<div class="comment-head">
|
|
<div class="comment-headline"><i class="iconfont icon-comment-alt"></i> <span>评论</span></div>
|
|
<div class="comment-privacy"><a href="#">隐私政策</a></div>
|
|
<div class="comment-tips" id="comment-tips">
|
|
<span>你无需删除空行，直接评论以获取最佳展示效果</span>
|
|
</div>
|
|
</div>
|
|
<halo:comment colorScheme="document.documentElement.getAttribute('data-theme')"
|
|
group="content.halo.run"
|
|
kind="SinglePage"
|
|
th:attr="name=${singlePage.metadata.name}"/>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- 侧栏 -->
|
|
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.pageWidgets})}"></div>
|
|
|
|
</main>
|
|
<!-- 底部 -->
|
|
<footer th:replace="~{modules/footer :: footer}"></footer>
|
|
</div>
|
|
|
|
</th:block>
|
|
|
|
</html>
|
|
|