更新
This commit is contained in:
haoouba
parent
767426a56d
commit
0ca3af693d
File diff suppressed because one or more lines are too long
@ -1311,7 +1311,7 @@ html[data-night='night'] {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
a:not(.joe_detail__article-anote) {
|
||||
a:not(.joe_detail__article-anote):not(.joe_detail__article-abtn) {
|
||||
display: inline-block;
|
||||
line-height: 26px;
|
||||
color: var(--theme);
|
||||
@ -1700,6 +1700,41 @@ html[data-night='night'] {
|
||||
background: #3498db;
|
||||
}
|
||||
}
|
||||
&-abtn {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
padding: 0 15px;
|
||||
transform-origin: 100% 0;
|
||||
transform: translateZ(0);
|
||||
&:hover {
|
||||
animation-name: wobble-bottom;
|
||||
animation-duration: 1s;
|
||||
animation-timing-function: ease-in-out;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
.icon {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
.fa {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
}
|
||||
[class^='fa-'] {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
max-width: 500px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
&__agree {
|
||||
display: flex;
|
||||
@ -2344,6 +2379,32 @@ html[data-night='night'] {
|
||||
animation: none;
|
||||
}
|
||||
|
||||
@keyframes wobble-bottom {
|
||||
16.65% {
|
||||
transform: skew(-12deg);
|
||||
}
|
||||
|
||||
33.3% {
|
||||
transform: skew(10deg);
|
||||
}
|
||||
|
||||
49.95% {
|
||||
transform: skew(-6deg);
|
||||
}
|
||||
|
||||
66.6% {
|
||||
transform: skew(4deg);
|
||||
}
|
||||
|
||||
83.25% {
|
||||
transform: skew(-2deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: skew(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes showComment {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
||||
@ -104,5 +104,15 @@ function _parseContent($post, $login)
|
||||
$content
|
||||
);
|
||||
}
|
||||
/* 过滤note button */
|
||||
if (preg_match('/\{abtn\s{0,}icon=".{0,}"\s{0,}color=".{0,}"\s{0,}href=".{0,}"\s{0,}radius=".{0,}"\s{0,}\}.{0,}\{\/abtn\}/sSU', $content)) {
|
||||
$content = preg_replace(
|
||||
'/\{abtn\s{0,}icon="(.{0,})"\s{0,}color="(.{0,})"\s{0,}href="(.{0,})"\s{0,}radius="(.{0,})"\s{0,}\}(.{0,})\{\/abtn\}/sSU',
|
||||
'<a class="joe_detail__article-abtn" style="background: $2; border-radius: $4" href="$3" target="_blank" rel="noopener noreferrer nofollow">
|
||||
<span class="icon"><i class="$1 fa"></i></span><span class="content">$5</span>
|
||||
</a>',
|
||||
$content
|
||||
);
|
||||
}
|
||||
echo $content;
|
||||
}
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
$(function () {
|
||||
$('#wmd-editarea textarea').attr('placeholder', '请输入文章内容...（支持图片粘贴上传）');
|
||||
$('#wmd-button-bar .wmd-edittab').remove();
|
||||
$('#wmd-button-row .wmd-spacer').remove();
|
||||
$('#wmd-button-row #wmd-code-button').remove();
|
||||
$('#wmd-editarea textarea').attr('placeholder', '请输入文章内容...（支持图片粘贴上传）')
|
||||
$('#wmd-button-bar .wmd-edittab').remove()
|
||||
$('#wmd-button-row .wmd-spacer').remove()
|
||||
$('#wmd-button-row #wmd-code-button').remove()
|
||||
|
||||
/* 增加自定义功能 */
|
||||
const items = [
|
||||
@ -84,70 +84,78 @@ $(function () {
|
||||
{
|
||||
title: '便条按钮',
|
||||
id: 'wmd-anote-button',
|
||||
svg: '<svg t="1612604897877" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13842" width="20" height="20"><path d="M910.222222 227.555556a113.777778 113.777778 0 0 1 113.777778 113.777777v341.333334a113.777778 113.777778 0 0 1-113.777778 113.777777H113.777778a113.777778 113.777778 0 0 1-113.777778-113.777777V341.333333a113.777778 113.777778 0 0 1 113.777778-113.777777h796.444444z m0 56.888888H113.777778a56.888889 56.888889 0 0 0-56.888889 56.888889v341.333334a56.888889 56.888889 0 0 0 56.888889 56.888889h796.444444a56.888889 56.888889 0 0 0 56.888889-56.888889V341.333333a56.888889 56.888889 0 0 0-56.888889-56.888889zM282.225778 369.891556c25.486222 0 45.937778 5.831111 61.326222 17.521777 15.388444 11.662222 23.096889 29.326222 23.096889 52.963556 0 14.336-3.527111 26.624-10.552889 36.835555-7.025778 10.24-17.066667 18.119111-30.065778 23.694223v0.796444c17.521778 3.697778 30.805333 12.003556 39.822222 24.888889 9.016889 12.885333 13.539556 29.013333 13.539556 48.384 0 11.150222-1.991111 21.560889-5.973333 31.260444-3.982222 9.671111-10.24 18.062222-18.716445 25.088-8.504889 7.025778-19.370667 12.600889-32.654222 16.725334-13.283556 4.124444-29.070222 6.172444-47.388444 6.172444H144.042667v-284.330666h138.183111z m345.258666 0v43.008h-90.396444V654.222222h-49.777778v-241.322666h-89.998222v-43.008h230.172444z m83.626667 0l129.820445 209.464888h0.796444v-209.464888h47.388444V654.222222H836.551111l-129.422222-209.066666h-1.194667V654.222222h-47.388444v-284.330666H711.111111zM281.827556 524.8H193.820444v88.803556h88.007112c15.132444 0 26.88-3.925333 35.242666-11.747556 8.362667-7.822222 12.544-18.915556 12.544-33.251556 0-14.08-4.181333-24.888889-12.544-32.455111-8.362667-7.566222-20.110222-11.349333-35.242666-11.349333z m-6.769778-114.289778H193.820444v78.449778H275.057778c11.946667 0 21.902222-3.384889 29.866666-10.154667s11.946667-16.526222 11.946667-29.269333c0-14.336-3.584-24.433778-10.752-30.264889-7.168-5.831111-17.521778-8.760889-31.061333-8.760889z" p-id="13843" fill="#9b9b9b"></path></svg>'
|
||||
svg: '<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M910.222222 227.555556a113.777778 113.777778 0 0 1 113.777778 113.777777v341.333334a113.777778 113.777778 0 0 1-113.777778 113.777777H113.777778a113.777778 113.777778 0 0 1-113.777778-113.777777V341.333333a113.777778 113.777778 0 0 1 113.777778-113.777777h796.444444z m0 56.888888H113.777778a56.888889 56.888889 0 0 0-56.888889 56.888889v341.333334a56.888889 56.888889 0 0 0 56.888889 56.888889h796.444444a56.888889 56.888889 0 0 0 56.888889-56.888889V341.333333a56.888889 56.888889 0 0 0-56.888889-56.888889zM282.225778 369.891556c25.486222 0 45.937778 5.831111 61.326222 17.521777 15.388444 11.662222 23.096889 29.326222 23.096889 52.963556 0 14.336-3.527111 26.624-10.552889 36.835555-7.025778 10.24-17.066667 18.119111-30.065778 23.694223v0.796444c17.521778 3.697778 30.805333 12.003556 39.822222 24.888889 9.016889 12.885333 13.539556 29.013333 13.539556 48.384 0 11.150222-1.991111 21.560889-5.973333 31.260444-3.982222 9.671111-10.24 18.062222-18.716445 25.088-8.504889 7.025778-19.370667 12.600889-32.654222 16.725334-13.283556 4.124444-29.070222 6.172444-47.388444 6.172444H144.042667v-284.330666h138.183111z m345.258666 0v43.008h-90.396444V654.222222h-49.777778v-241.322666h-89.998222v-43.008h230.172444z m83.626667 0l129.820445 209.464888h0.796444v-209.464888h47.388444V654.222222H836.551111l-129.422222-209.066666h-1.194667V654.222222h-47.388444v-284.330666H711.111111zM281.827556 524.8H193.820444v88.803556h88.007112c15.132444 0 26.88-3.925333 35.242666-11.747556 8.362667-7.822222 12.544-18.915556 12.544-33.251556 0-14.08-4.181333-24.888889-12.544-32.455111-8.362667-7.566222-20.110222-11.349333-35.242666-11.349333z m-6.769778-114.289778H193.820444v78.449778H275.057778c11.946667 0 21.902222-3.384889 29.866666-10.154667s11.946667-16.526222 11.946667-29.269333c0-14.336-3.584-24.433778-10.752-30.264889-7.168-5.831111-17.521778-8.760889-31.061333-8.760889z" p-id="13843" fill="#9b9b9b"></path></svg>'
|
||||
},
|
||||
{
|
||||
title: '多彩按钮',
|
||||
id: 'wmd-abtn-button',
|
||||
svg: '<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M360 651c-74.1 0-134.3-60.3-134.3-134.3 0-74.1 60.3-134.3 134.3-134.3s134.3 60.3 134.3 134.3c0 74-60.2 134.3-134.3 134.3z m0-204.6c-38.8 0-70.3 31.5-70.3 70.3S321.2 587 360 587s70.3-31.5 70.3-70.3-31.5-70.3-70.3-70.3z" p-id="5116" fill="#9b9b9b"></path><path d="M666.9 778.9H360c-70 0-135.9-27.3-185.4-76.8S97.8 586.7 97.8 516.7s27.3-135.9 76.8-185.4S290 254.5 360 254.5h306.9c70 0 135.9 27.3 185.4 76.8s76.8 115.4 76.8 185.4-27.3 135.9-76.8 185.4-115.3 76.8-185.4 76.8zM360 318.5c-109.3 0-198.2 88.9-198.2 198.2S250.7 714.9 360 714.9h306.9c109.3 0 198.2-88.9 198.2-198.2s-88.9-198.2-198.2-198.2H360z" p-id="5117" fill="#9b9b9b"></path></svg>'
|
||||
}
|
||||
];
|
||||
]
|
||||
|
||||
/* 用于设置插入到文章的短代码内容 */
|
||||
function getInsertTextById(id) {
|
||||
let str = '';
|
||||
let str = ''
|
||||
switch (id) {
|
||||
case 'wmd-hide-button':
|
||||
str = `\n\n{hide}${$('#text').selectionRange() ? $('#text').selectionRange() : '回复可见'}{/hide}\n\n`;
|
||||
break;
|
||||
str = `\n\n{hide}${$('#text').selectionRange() ? $('#text').selectionRange() : '回复可见'}{/hide}\n\n`
|
||||
break
|
||||
case 'wmd-mlist-button':
|
||||
str = `\n\n{music-list id="网易云歌单ID" /}\n\n`;
|
||||
break;
|
||||
str = `\n\n{music-list id="网易云歌单ID" /}\n\n`
|
||||
break
|
||||
case 'wmd-music-button':
|
||||
str = `\n\n{music id="网易云音乐ID" /}\n\n`;
|
||||
break;
|
||||
str = `\n\n{music id="网易云音乐ID" /}\n\n`
|
||||
break
|
||||
case 'wmd-bili-button':
|
||||
str = `\n\n{bilibili bvid="哔哩哔哩的Bvid" /}\n\n`;
|
||||
break;
|
||||
str = `\n\n{bilibili bvid="哔哩哔哩的Bvid" /}\n\n`
|
||||
break
|
||||
case 'wmd-dplayer-button':
|
||||
str = `\n\n{dplayer src="M3U8或MP4地址" /}\n\n`;
|
||||
break;
|
||||
str = `\n\n{dplayer src="M3U8或MP4地址" /}\n\n`
|
||||
break
|
||||
case 'wmd-html-button':
|
||||
str = `\n\n!!!\n<span class="test">Hello Joe</span>\n<style>\n .test { color: #ff6800 }\n</style>\n!!!\n\n`;
|
||||
break;
|
||||
str = `\n\n!!!\n<span class="test">Hello Joe</span>\n<style>\n .test { color: #ff6800 }\n</style>\n!!!\n\n`
|
||||
break
|
||||
case 'wmd-title-button':
|
||||
str = `\n\n# 一级标题\n## 二级标题\n### 三级标题\n#### 四级标题\n##### 五级标题\n###### 六级标题\n\n`;
|
||||
break;
|
||||
str = `\n\n# 一级标题\n## 二级标题\n### 三级标题\n#### 四级标题\n##### 五级标题\n###### 六级标题\n\n`
|
||||
break
|
||||
case 'wmd-table-button':
|
||||
str = `\n\n| 左对齐 | 右对齐 | 居中对齐 |\n| :-----| ----: | :----: |\n| 单元格 | 单元格 | 单元格 |\n\n`;
|
||||
break;
|
||||
str = `\n\n| 左对齐 | 右对齐 | 居中对齐 |\n| :-----| ----: | :----: |\n| 单元格 | 单元格 | 单元格 |\n\n`
|
||||
break
|
||||
case 'wmd-delete-button':
|
||||
str = `~~${$('#text').selectionRange() ? $('#text').selectionRange() : '删除线'}~~`;
|
||||
break;
|
||||
str = `~~${$('#text').selectionRange() ? $('#text').selectionRange() : '删除线'}~~`
|
||||
break
|
||||
case 'wmd-snippet-button':
|
||||
str = `\n\n\`\`\`php\necho 'Hello Joe';\n\`\`\`\n\n`;
|
||||
break;
|
||||
str = `\n\n\`\`\`php\necho 'Hello Joe';\n\`\`\`\n\n`
|
||||
break
|
||||
case 'wmd-code-button':
|
||||
str = ` \`${$('#text').selectionRange() ? $('#text').selectionRange() : '行内代码'}\` `;
|
||||
break;
|
||||
str = ` \`${$('#text').selectionRange() ? $('#text').selectionRange() : '行内代码'}\` `
|
||||
break
|
||||
case 'wmd-task-button':
|
||||
str = `{x} 任务已完成\n{ } 任务未完成`;
|
||||
break;
|
||||
str = `{x} 任务已完成\n{ } 任务未完成`
|
||||
break
|
||||
case 'wmd-card-button':
|
||||
str = `\n\n{card-default width="100%" label="卡片标题"}${$('#text').selectionRange() ? $('#text').selectionRange() : '卡片内容'}{/card-default}\n\n`;
|
||||
break;
|
||||
str = `\n\n{card-default width="100%" label="卡片标题"}${$('#text').selectionRange() ? $('#text').selectionRange() : '卡片内容'}{/card-default}\n\n`
|
||||
break
|
||||
case 'wmd-message-button':
|
||||
str = `\n\n{message type="success|info|warning|error"}${$('#text').selectionRange() ? $('#text').selectionRange() : '提示内容'}{/message}\n\n`;
|
||||
break;
|
||||
str = `\n\n{message type="success|info|warning|error"}${$('#text').selectionRange() ? $('#text').selectionRange() : '提示内容'}{/message}\n\n`
|
||||
break
|
||||
case 'wmd-mtitle-button':
|
||||
str = `\n\n{mtitle}${$('#text').selectionRange() ? $('#text').selectionRange() : '居中标题'}{/mtitle}\n\n`;
|
||||
break;
|
||||
str = `\n\n{mtitle}${$('#text').selectionRange() ? $('#text').selectionRange() : '居中标题'}{/mtitle}\n\n`
|
||||
break
|
||||
case 'wmd-anote-button':
|
||||
str = `{anote icon="Font Awesome图标" href="跳转地址" type="secondary|success|warning|error|info"}${$('#text').selectionRange() ? $('#text').selectionRange() : '便条按钮'}{/anote}`;
|
||||
break;
|
||||
str = `{anote icon="Font Awesome图标" href="跳转地址" type="secondary|success|warning|error|info"}${$('#text').selectionRange() ? $('#text').selectionRange() : '便条按钮'}{/anote}`
|
||||
break
|
||||
case 'wmd-abtn-button':
|
||||
str = `{abtn icon="Font Awesome图标" color="颜色值" href="跳转地址" radius="圆角（半圆17.5px）"}${$('#text').selectionRange() ? $('#text').selectionRange() : '多彩按钮'}{/abtn}`
|
||||
break
|
||||
}
|
||||
return str;
|
||||
return str
|
||||
}
|
||||
|
||||
/* 此处无需修改 */
|
||||
items.forEach(_ => {
|
||||
let item = $(`<li class="wmd-button" id="${_.id}" title="${_.title}">${_.svg}</li>`);
|
||||
item.on('mousedown touchstart', () => $('#text').insertContent(getInsertTextById(_.id)));
|
||||
$('#wmd-button-row').append(item);
|
||||
});
|
||||
});
|
||||
let item = $(`<li class="wmd-button" id="${_.id}" title="${_.title}">${_.svg}</li>`)
|
||||
item.on('mousedown touchstart', () => $('#text').insertContent(getInsertTextById(_.id)))
|
||||
$('#wmd-button-row').append(item)
|
||||
})
|
||||
})
|
||||
|
||||
Loading…
Reference in New Issue
Block a user