mirror/typecho-joe
2
0
Fork 0
mirror of https://dl.bcrjl.com/ghg/HaoOuBa/Joe.git synced 2026-02-17 13:10:05 +08:00
Code Issues Packages Projects Releases Wiki Activity

更新

Browse Source
This commit is contained in:
杜恒
2021-01-25 18:36:43 +08:00
parent 084c7faf84
commit f06c934586
20 changed files with 850 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
assets/css/joe.archive.css Normal file
View File

@@ -0,0 +1 @@
.joe_archive{border-radius:8px;padding:0 15px;background:var(--background);box-shadow:var(--box-shadow)}.joe_archive__title{display:flex;align-items:center;height:45px;line-height:45px;color:var(--main);border-bottom:1px solid var(--classC)}.joe_archive__title-icon{width:20px;height:20px;min-width:20px;min-height:20px;margin-right:5px}.joe_archive__title-title{display:flex;align-items:center}.joe_archive__title-title .muted{color:var(--theme);margin:0 5px}.joe_archive__empty{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:50px 0;color:var(--routine)}.joe_archive__empty-icon{margin-bottom:30px;fill:var(--routine)}

41
assets/css/joe.archive.scss Normal file
View File

@@ -0,0 +1,41 @@
.joe_archive {
border-radius: 8px;
padding: 0 15px;
background: var(--background);
box-shadow: var(--box-shadow);
&__title {
display: flex;
align-items: center;
height: 45px;
line-height: 45px;
color: var(--main);
border-bottom: 1px solid var(--classC);
&-icon {
width: 20px;
height: 20px;
min-width: 20px;
min-height: 20px;
margin-right: 5px;
}
&-title {
display: flex;
align-items: center;
.muted {
color: var(--theme);
margin: 0 5px;
}
}
}
&__empty {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
padding: 50px 0;
color: var(--routine);
&-icon {
margin-bottom: 30px;
fill: var(--routine);
}
}
}

2
assets/css/joe.global.css
View File

File diff suppressed because one or more lines are too long

278
assets/css/joe.global.scss
View File

@@ -3,6 +3,12 @@ html[data-night='night'] {
background: #202122;
z-index: -500;
}
.joe_header__above-logo img {
display: none;
}
.joe_header__above-logo svg {
display: block;
}
}
.joe_dropdown {
@@ -72,6 +78,9 @@ html[data-night='night'] {
max-height: 50px;
object-fit: cover;
}
svg {
display: none;
}
&::after {
content: '';
position: absolute;
@@ -200,9 +209,78 @@ html[data-night='night'] {
transition: transform 0.35s;
transform: translate3d(100%, -50%, 0) rotateY(180deg);
}
.result {
position: absolute;
top: 60px;
left: 0;
right: 0;
background: var(--background);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
border-radius: 4px;
visibility: hidden;
opacity: 0;
transition: visibility 0.35s, opacity 0.35s, transform 0.35s;
transform: translate3d(0, 15px, 0);
&.active {
transform: translate3d(0, 0, 0);
opacity: 1;
visibility: visible;
}
.item {
height: 40px;
line-height: 40px;
border-bottom: 1px solid var(--classD);
display: flex;
align-items: center;
overflow: hidden;
padding: 0 8px;
transition: background 0.35s;
&:last-child {
border-bottom: none;
}
&:nth-child(1) .sort {
background: #fe2d46;
}
&:nth-child(2) .sort {
background: #f60;
}
&:nth-child(3) .sort {
background: #faa90e;
}
&:hover {
background: var(--classD);
}
.sort {
color: #fff;
background: #7f7f8c;
width: 18px;
height: 18px;
line-height: 18px;
border-radius: 50%;
text-align: center;
margin-right: 8px;
font-weight: 500;
}
.text {
flex: 1;
min-width: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: var(--routine);
font-size: 12px;
}
.views {
color: var(--seat);
font-size: 12px;
margin-left: 3px;
}
}
}
}
}
&__below {
position: relative;
border-top: 1px solid var(--classC);
height: 45px;
&-class {
@@ -247,6 +325,15 @@ html[data-night='night'] {
}
}
}
&-progress {
position: absolute;
left: 0;
bottom: -3px;
height: 3px;
border-radius: 1.5px;
background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff);
transition: width 0.35s;
}
}
}
@@ -1425,6 +1512,50 @@ html[data-night='night'] {
}
}
}
&__friends{
display: flex;
flex-wrap: wrap;
margin: 0 -7.5px;
&-item {
width: 25%;
padding: 7.5px;
.contain {
display: block;
border-radius: 4px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding: 15px;
color: #fff;
word-break: break-all;
.title {
position: relative;
&::after{
content: "";
position: absolute;
bottom: -5px;
left: 0;
width: 100%;
height: 1px;
background: #fff;
}
}
.content {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 15px;
.avatar {
width: 40px;
height: 40px;
min-width: 40px;
min-height: 40px;
border-radius: 50%;
}
}
}
}
}
}
.joe_footer {
@@ -1445,6 +1576,48 @@ html[data-night='night'] {
}
}
.joe_pagination {
display: flex;
align-items: center;
justify-content: flex-end;
padding-top: 15px;
li {
margin-left: 5px;
&.active a {
background: var(--theme);
color: #fff;
font-weight: 500;
}
a {
display: flex;
align-items: center;
height: 32px;
color: var(--main);
padding: 0 15px;
background: var(--background);
border-radius: 2px;
transition: background 0.35s, color 0.35s;
user-select: none;
&:hover {
background: var(--theme);
color: #fff;
.icon {
fill: #fff;
}
}
.icon {
width: 12px;
height: 12px;
fill: var(--routine);
transition: fill 0.35s;
&-next {
transform: rotate(180deg);
}
}
}
}
}
.joe_action {
position: fixed;
bottom: 90px;
@@ -1491,12 +1664,91 @@ html[data-night='night'] {
}
}
.profile-color-modes-illu-frame {
opacity: 0;
}
.profile-color-modes-illu-red {
stroke: #da3633;
}
.profile-color-modes-illu-orange {
stroke: #f0883e;
}
.profile-color-modes-illu-purple {
stroke: #8957e5;
}
.profile-color-modes-illu-green {
stroke: #3fb950;
}
.profile-color-modes-illu-blue {
stroke: #388bfd;
}
.profile-color-modes-illu-group {
animation: profile-color-modes-illu-anim 0.2s cubic-bezier(0.72, 0.08, 1, 0.68) backwards;
}
.profile-color-modes-illu-frame {
animation: profile-color-modes-illu-anim-frame-show 0s forwards, profile-color-modes-illu-anim-frame-hide 0s forwards;
}
.profile-color-modes-illu-frame:first-child {
opacity: 1;
animation: profile-color-modes-illu-anim-frame-hide 0s forwards;
}
.profile-color-modes-illu-frame:nth-child(8) {
animation: profile-color-modes-illu-anim-frame-show 0s forwards;
}
.profile-color-modes-illu-red {
animation-delay: 0.4s;
animation-duration: 0.1s;
}
.profile-color-modes-illu-orange {
animation-delay: 0.5s;
animation-duration: 0.1s;
}
.profile-color-modes-illu-purple {
animation-delay: 0.6s;
animation-duration: 0.1s;
}
.profile-color-modes-illu-blue {
animation-delay: 0.7s;
animation-duration: 0.1s;
}
.profile-color-modes-illu-green {
animation-delay: 0.8s;
animation-duration: 0.2s;
animation-timing-function: cubic-bezier(0.47, 2.92, 0.84, -1.5);
}
.profile-color-modes-illu-frame:first-child {
animation-delay: 1.8s;
}
.profile-color-modes-illu-frame:nth-child(2) {
animation-delay: 1.8s, 2.58s;
}
.profile-color-modes-illu-frame:nth-child(3) {
animation-delay: 2.58s, 2.66s;
}
.profile-color-modes-illu-frame:nth-child(4) {
animation-delay: 2.66s, 2.78s;
}
.profile-color-modes-illu-frame:nth-child(5) {
animation-delay: 2.78s, 2.84s;
}
.profile-color-modes-illu-frame:nth-child(6) {
animation-delay: 2.84s, 3.44s;
}
.profile-color-modes-illu-frame:nth-child(7) {
animation-delay: 3.44s, 3.56s;
}
.profile-color-modes-illu-frame:nth-child(8) {
animation-delay: 3.56s;
}
.profile-color-modes-illu-frame:nth-child(9),
.profile-color-modes-illu-frame:nth-child(10) {
animation: none;
}
@keyframes box_shadow {
0% {
box-shadow: 0 0 0 0 #f56c6c;
}
}
@keyframes progress {
0% {
background-position: 0 0;
@@ -1505,7 +1757,6 @@ html[data-night='night'] {
background-position: 30px 0;
}
}
@keyframes list_thumbnail_loading {
0% {
transform: scale(0.85);
@@ -1530,3 +1781,26 @@ html[data-night='night'] {
width: 80%;
}
}
@keyframes profile-color-modes-illu-anim {
0% {
stroke: #666;
}
}
@keyframes profile-color-modes-illu-anim-frame-show {
0% {
opacity: 0;
animation-timing-function: ease-out;
}
to {
opacity: 1;
}
}
@keyframes profile-color-modes-illu-anim-frame-hide {
0% {
opacity: 1;
animation-timing-function: ease-in;
}
to {
opacity: 0;
}
}

2
assets/css/joe.normalize.css
View File

@@ -1 +1 @@
*{margin:0;padding:0;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{border-radius:4px;background:var(--seat)}::-webkit-scrollbar-track{background:transparent}body{font-size:14px;font-family:'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif}body::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;z-index:-520;pointer-events:none}input[type='text']{-webkit-appearance:none;border-radius:0;font-size:13px;font-weight:500}textarea{resize:none;-webkit-appearance:none}li{list-style:none}a{text-decoration:none}h1,h2,h3,h4,h5,h6{font-weight:500}img{border:0;vertical-align:middle}img[src=''],img:not([src]){border:0;opacity:0}svg,canvas{vertical-align:middle}button{cursor:pointer;-webkit-appearance:none;font-size:13px}table{border-collapse:collapse;border-spacing:0}.joe_main{min-width:0;flex:1;padding:15px 0}.joe_container{display:flex;width:100%;margin:0 auto;padding:0 15px}@media (min-width: 576px){.joe_container{max-width:540px}}@media (min-width: 768px){.joe_container{max-width:720px}}@media (min-width: 992px){.joe_container{max-width:960px}}@media (min-width: 1200px){.joe_container{max-width:1140px}}@media (min-width: 1400px){.joe_container{max-width:1320px}}html{--background: #fff;--theme: #f24e4e;--main: #303133;--routine: #606266;--minor: #909399;--seat: #c0c4cc;--classA: #dcdfe6;--classB: #e4e7ed;--classC: #ebeef5;--classD: #f2f6fc;--text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);--box-shadow: 0px 0px 20px -5px rgba(158, 158, 158, 0.22)}html[data-night='night']{--background: #303133;--box-shadow: none}
*{margin:0;padding:0;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{border-radius:4px;background:var(--seat)}::-webkit-scrollbar-track{background:transparent}body{font-size:14px;font-family:'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif}body::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;z-index:-520;pointer-events:none}input[type='text']{-webkit-appearance:none;border-radius:0;font-size:13px;font-weight:500}textarea{resize:none;-webkit-appearance:none}li{list-style:none}a{text-decoration:none}h1,h2,h3,h4,h5,h6{font-weight:500}img{border:0;vertical-align:middle}img[src=''],img:not([src]){border:0;opacity:0}svg,canvas{vertical-align:middle}button{cursor:pointer;-webkit-appearance:none;font-size:13px}table{border-collapse:collapse;border-spacing:0}.joe_main{min-width:0;flex:1;padding:15px 0}.joe_container{display:flex;width:100%;margin:0 auto;padding:0 15px}@media (min-width: 576px){.joe_container{max-width:540px}}@media (min-width: 768px){.joe_container{max-width:720px}}@media (min-width: 992px){.joe_container{max-width:960px}}@media (min-width: 1200px){.joe_container{max-width:1140px}}@media (min-width: 1400px){.joe_container{max-width:1320px}}html{--background: #fff;--theme: #f24e4e;--main: #303133;--routine: #606266;--minor: #909399;--seat: #c0c4cc;--classA: #dcdfe6;--classB: #e4e7ed;--classC: #ebeef5;--classD: #f2f6fc;--text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);--box-shadow: 0px 0px 20px -5px rgba(158, 158, 158, 0.22)}html[data-night='night']{--background: #303133;--box-shadow: none}

1
assets/css/joe.normalize.scss
View File

@@ -8,6 +8,7 @@
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-thumb {

9
assets/js/joe.archive.js Normal file
View File

@@ -0,0 +1,9 @@
console.time('Archive.js执行时长');
document.addEventListener('DOMContentLoaded', () => {
/* 激活列表特效 */
{
const wow = $('.joe_archive__list').attr('data-wow');
if (wow !== 'off' && wow) new WOW({ boxClass: 'wow', animateClass: `animated ${wow}`, offset: 0, mobile: true, live: true, scrollContainer: null }).init();
}
console.timeEnd('Archive.js执行时长');
});

30
assets/js/joe.global.js
View File

@@ -34,6 +34,20 @@ document.addEventListener('DOMContentLoaded', () => {
}
}
/* 搜索框弹窗 */
{
$('.joe_header__above-search .input').on('click', e => {
e.stopPropagation();
$('.joe_header__above-search .result').addClass('active');
});
$(document).on('click', function () {
$('.joe_header__above-search .result').removeClass('active');
});
$(document).on('scroll', function () {
$('.joe_header__above-search .result').removeClass('active');
});
}
/* 激活全局下拉框功能 */
{
$('.joe_dropdown').each(function (index, item) {
@@ -180,6 +194,22 @@ document.addEventListener('DOMContentLoaded', () => {
});
}
}
/* 计算页面滚动多少 */
{
const calcProgress = () => {
let scrollTop = $(window).scrollTop();
let documentHeight = $(document).height();
let windowHeight = $(window).height();
let progress = parseInt((scrollTop / (documentHeight - windowHeight)) * 100);
if (progress <= 0) progress = 0;
if (progress >= 100) progress = 100;
$('.joe_header__below-progress').css('width', progress + '%');
};
calcProgress();
$(window).on('scroll', () => calcProgress());
}
/* 懒加载 */
new LazyLoad('.lazyload');

193
assets/js/joe.post&page.js
View File

@@ -1,105 +1,104 @@
console.time('Post&Page.js执行时长')
console.time('Post&Page.js执行时长');
document.addEventListener('DOMContentLoaded', () => {
/* 获取本篇文章百度收录情况 */
{
$.ajax({
url: Joe.BASE_API,
type: 'POST',
data: { routeType: 'baidu_record', site: window.location.href },
success(res) {
if (res.data && res.data === '已收录') {
$('#Joe_Baidu_Record').css('color', '#67C23A')
$('#Joe_Baidu_Record').html('已收录')
} else {
const url = `https://ziyuan.baidu.com/linksubmit/url?sitename=${encodeURI(window.location.href)}`
$('#Joe_Baidu_Record').html(`<a target="_blank" href="${url}" rel="noopener noreferrer nofollow" style="color: #F56C6C">未收录，提交收录</a>`)
}
}
})
}
/* 获取本篇文章百度收录情况 */
{
$.ajax({
url: Joe.BASE_API,
type: 'POST',
data: { routeType: 'baidu_record', site: window.location.href },
success(res) {
if (res.data && res.data === '已收录') {
$('#Joe_Baidu_Record').css('color', '#67C23A');
$('#Joe_Baidu_Record').html('已收录');
} else {
const url = `https://ziyuan.baidu.com/linksubmit/url?sitename=${encodeURI(window.location.href)}`;
$('#Joe_Baidu_Record').html(`<a target="_blank" href="${url}" rel="noopener noreferrer nofollow" style="color: #F56C6C">未收录，提交收录</a>`);
}
}
});
}
/* 激活代码高亮 */
{
Prism.highlightAll()
}
/* 激活代码高亮 */
{
Prism.highlightAll();
}
/* 激活图片预览功能 */
{
$('.joe_detail__article img:not(img.owo_image)').each(function () {
$(this).wrap($(`<div data-fancybox="Joe" href="${$(this).attr('src')}"></div>`))
})
}
/* 激活图片预览功能 */
{
$('.joe_detail__article img:not(img.owo_image)').each(function () {
$(this).wrap($(`<div data-fancybox="Joe" href="${$(this).attr('src')}"></div>`));
});
}
/* 设置文章内的链接为新窗口打开 */
{
$('.joe_detail__article a').each(() => $(this).attr({ target: '_blank', rel: 'noopener noreferrer nofollow' }))
}
/* 设置文章内的链接为新窗口打开 */
{
$('.joe_detail__article a').each(() => $(this).attr({ target: '_blank', rel: 'noopener noreferrer nofollow' }));
}
/* 当前页的CID */
const cid = $('.joe_detail').attr('data-cid')
/* 当前页的CID */
const cid = $('.joe_detail').attr('data-cid');
/* 激活浏览功能 */
{
let viewsArr = localStorage.getItem(Joe.encryption('views')) ? JSON.parse(Joe.decrypt(localStorage.getItem(Joe.encryption('views')))) : []
const flag = viewsArr.includes(cid)
if (!flag) {
$.ajax({
url: Joe.BASE_API,
type: 'POST',
data: { routeType: 'handle_views', cid },
success(res) {
if (res.code !== 1) return
$('#Joe_Article_Views').html(`${res.data.views} 阅读`)
viewsArr.push(cid)
const name = Joe.encryption('views')
const val = Joe.encryption(JSON.stringify(viewsArr))
localStorage.setItem(name, val)
}
})
}
}
/* 激活浏览功能 */
{
let viewsArr = localStorage.getItem(Joe.encryption('views')) ? JSON.parse(Joe.decrypt(localStorage.getItem(Joe.encryption('views')))) : [];
const flag = viewsArr.includes(cid);
if (!flag) {
$.ajax({
url: Joe.BASE_API,
type: 'POST',
data: { routeType: 'handle_views', cid },
success(res) {
if (res.code !== 1) return;
$('#Joe_Article_Views').html(`${res.data.views} 阅读`);
viewsArr.push(cid);
const name = Joe.encryption('views');
const val = Joe.encryption(JSON.stringify(viewsArr));
localStorage.setItem(name, val);
}
});
}
}
/* 激活文章点赞功能 */
{
let agreeArr = localStorage.getItem(Joe.encryption('agree')) ? JSON.parse(Joe.decrypt(localStorage.getItem(Joe.encryption('agree')))) : []
if (agreeArr.includes(cid)) $('.joe_detail__agree .icon-1').addClass('active')
else $('.joe_detail__agree .icon-2').addClass('active')
let _loading = false
$('.joe_detail__agree .icon').on('click', function () {
if (_loading) return
_loading = true
agreeArr = localStorage.getItem(Joe.encryption('agree')) ? JSON.parse(Joe.decrypt(localStorage.getItem(Joe.encryption('agree')))) : []
let flag = agreeArr.includes(cid)
$.ajax({
url: Joe.BASE_API,
type: 'POST',
data: { routeType: 'handle_agree', cid, type: flag ? 'disagree' : 'agree' },
success(res) {
if (res.code !== 1) return
$('.joe_detail__agree .text').html(res.data.agree)
if (flag) {
const index = agreeArr.findIndex(_ => _ === cid)
agreeArr.splice(index, 1)
$('.joe_detail__agree .icon-1').removeClass('active')
$('.joe_detail__agree .icon-2').addClass('active')
$('.joe_detail__agree .icon').removeClass('active')
} else {
agreeArr.push(cid)
$('.joe_detail__agree .icon-2').removeClass('active')
$('.joe_detail__agree .icon-1').addClass('active')
$('.joe_detail__agree .icon').addClass('active')
}
const name = Joe.encryption('agree')
const val = Joe.encryption(JSON.stringify(agreeArr))
localStorage.setItem(name, val)
},
complete() {
_loading = false
}
})
})
}
console.timeEnd('Post&Page.js执行时长')
})
/* 激活文章点赞功能 */
{
let agreeArr = localStorage.getItem(Joe.encryption('agree')) ? JSON.parse(Joe.decrypt(localStorage.getItem(Joe.encryption('agree')))) : [];
if (agreeArr.includes(cid)) $('.joe_detail__agree .icon-1').addClass('active');
else $('.joe_detail__agree .icon-2').addClass('active');
let _loading = false;
$('.joe_detail__agree .icon').on('click', function () {
if (_loading) return;
_loading = true;
agreeArr = localStorage.getItem(Joe.encryption('agree')) ? JSON.parse(Joe.decrypt(localStorage.getItem(Joe.encryption('agree')))) : [];
let flag = agreeArr.includes(cid);
$.ajax({
url: Joe.BASE_API,
type: 'POST',
data: { routeType: 'handle_agree', cid, type: flag ? 'disagree' : 'agree' },
success(res) {
if (res.code !== 1) return;
$('.joe_detail__agree .text').html(res.data.agree);
if (flag) {
const index = agreeArr.findIndex(_ => _ === cid);
agreeArr.splice(index, 1);
$('.joe_detail__agree .icon-1').removeClass('active');
$('.joe_detail__agree .icon-2').addClass('active');
$('.joe_detail__agree .icon').removeClass('active');
} else {
agreeArr.push(cid);
$('.joe_detail__agree .icon-2').removeClass('active');
$('.joe_detail__agree .icon-1').addClass('active');
$('.joe_detail__agree .icon').addClass('active');
}
const name = Joe.encryption('agree');
const val = Joe.encryption(JSON.stringify(agreeArr));
localStorage.setItem(name, val);
},
complete() {
_loading = false;
}
});
});
}
console.timeEnd('Post&Page.js执行时长');
});