This commit is contained in:
haoouba 2021-02-05 20:12:22 +08:00
parent 0425121f77
commit 1144a882e2
6 changed files with 2572 additions and 2521 deletions

File diff suppressed because one or more lines are too long

View File

@ -1532,7 +1532,7 @@ html[data-night='night'] {
} }
} }
&-card { &-card {
margin: 0 auto 15px; margin: 0 auto;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
border-radius: var(--radius-inner); border-radius: var(--radius-inner);
border: 1px solid var(--classC); border: 1px solid var(--classC);
@ -1625,6 +1625,34 @@ html[data-night='night'] {
} }
} }
} }
&-mtitle {
display: flex;
justify-content: center;
.text {
position: relative;
color: var(--minor);
padding: 0 15px;
transition: padding 0.35s;
&:hover {
padding: 0;
}
&::before,
&::after {
content: '';
position: absolute;
top: 50%;
width: 20px;
height: 1px;
background: var(--theme);
}
&::before {
left: -35px;
}
&::after {
right: -35px;
}
}
}
} }
&__agree { &__agree {
display: flex; display: flex;

View File

@ -1 +1 @@
*{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}iframe{display:block;border:none;margin:0 auto;vertical-align:middle}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}} *{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}::-moz-selection{color:#fff;background:var(--theme)}::selection{color:#fff;background:var(--theme)}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}iframe{display:block;border:none;margin:0 auto;vertical-align:middle}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}}

View File

@ -20,6 +20,11 @@
background: transparent; background: transparent;
} }
::selection {
color: #fff;
background: var(--theme);
}
body { body {
font-size: 14px; font-size: 14px;
/* 我们对字体进行统一规范,力求在各个操作系统下都有最佳展示效果。 */ /* 我们对字体进行统一规范,力求在各个操作系统下都有最佳展示效果。 */

View File

@ -73,6 +73,16 @@ function _parseShortCode($content)
$content $content
); );
} }
/* 过滤居中标题 */
if (preg_match('/\[mtitle\].{0,}\[\/mtitle\]/sSU', $content)) {
$content = preg_replace(
'/\[mtitle\](.{0,})\[\/mtitle\]/sSU',
'<span class="joe_detail__article-mtitle">
<span class="text">$1</span>
</span>',
$content
);
}
return $content; return $content;
} }

View File

@ -1,8 +1,8 @@
$(function () { $(function () {
$('#wmd-editarea textarea').attr('placeholder', '请输入文章内容...(支持图片粘贴上传)'); $('#wmd-editarea textarea').attr('placeholder', '请输入文章内容...(支持图片粘贴上传)')
$('#wmd-button-bar .wmd-edittab').remove(); $('#wmd-button-bar .wmd-edittab').remove()
$('#wmd-button-row .wmd-spacer').remove(); $('#wmd-button-row .wmd-spacer').remove()
$('#wmd-button-row #wmd-code-button').remove(); $('#wmd-button-row #wmd-code-button').remove()
/* 增加自定义功能 */ /* 增加自定义功能 */
const items = [ const items = [
@ -76,62 +76,70 @@ $(function () {
id: 'wmd-message-button', id: 'wmd-message-button',
svg: '<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M669.1328 281.6a307.456 307.456 0 0 0-428.0832 0 295.68 295.68 0 0 0 31.744 445.44v27.0848a29.6448 29.6448 0 0 0 59.2896 0v-40.3968a30.72 30.72 0 0 0-1.0752-7.5264 30.1568 30.1568 0 0 0-12.4416-18.8928 236.4928 236.4928 0 0 1-104.3456-196.4032c0-130.56 110.7456-236.8 241.3056-236.8s241.3056 106.24 241.3056 236.8c0 6.1952 0 12.6464-0.6656 19.0976a235.52 235.52 0 0 1-104.96 178.176 30.3616 30.3616 0 0 0-12.6464 32.2048v33.9456a29.6448 29.6448 0 0 0 59.2896 0v-26.8288a299.2128 299.2128 0 0 0 76.1856-84.8384 291.2768 291.2768 0 0 0 40.96-128c0.6656-7.936 0.8704-15.872 0.8704-23.808A295.1168 295.1168 0 0 0 669.1328 281.6zM513.4848 880.3328l-118.9376 0.8704a29.7472 29.7472 0 1 0 0.6144 59.4432l118.9376-0.8704a29.7472 29.7472 0 1 0-0.6144-59.4432zM603.4432 804.352H305.2032a29.6448 29.6448 0 0 0 0 59.2384h298.24a29.6448 29.6448 0 0 0 0-59.2384z" fill="#666666" p-id="36814"></path><path d="M485.3248 342.1184A29.5424 29.5424 0 0 0 455.68 312.32a178.688 178.688 0 0 0-178.3808 178.5856 29.6448 29.6448 0 0 0 59.2896 0A118.9376 118.9376 0 0 1 455.68 371.968a29.7472 29.7472 0 0 0 29.6448-29.8496z" fill="#9b9b9b" p-id="36815"></path></svg>' svg: '<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M669.1328 281.6a307.456 307.456 0 0 0-428.0832 0 295.68 295.68 0 0 0 31.744 445.44v27.0848a29.6448 29.6448 0 0 0 59.2896 0v-40.3968a30.72 30.72 0 0 0-1.0752-7.5264 30.1568 30.1568 0 0 0-12.4416-18.8928 236.4928 236.4928 0 0 1-104.3456-196.4032c0-130.56 110.7456-236.8 241.3056-236.8s241.3056 106.24 241.3056 236.8c0 6.1952 0 12.6464-0.6656 19.0976a235.52 235.52 0 0 1-104.96 178.176 30.3616 30.3616 0 0 0-12.6464 32.2048v33.9456a29.6448 29.6448 0 0 0 59.2896 0v-26.8288a299.2128 299.2128 0 0 0 76.1856-84.8384 291.2768 291.2768 0 0 0 40.96-128c0.6656-7.936 0.8704-15.872 0.8704-23.808A295.1168 295.1168 0 0 0 669.1328 281.6zM513.4848 880.3328l-118.9376 0.8704a29.7472 29.7472 0 1 0 0.6144 59.4432l118.9376-0.8704a29.7472 29.7472 0 1 0-0.6144-59.4432zM603.4432 804.352H305.2032a29.6448 29.6448 0 0 0 0 59.2384h298.24a29.6448 29.6448 0 0 0 0-59.2384z" fill="#666666" p-id="36814"></path><path d="M485.3248 342.1184A29.5424 29.5424 0 0 0 455.68 312.32a178.688 178.688 0 0 0-178.3808 178.5856 29.6448 29.6448 0 0 0 59.2896 0A118.9376 118.9376 0 0 1 455.68 371.968a29.7472 29.7472 0 0 0 29.6448-29.8496z" fill="#9b9b9b" p-id="36815"></path></svg>'
}, },
]; {
title: '居中标题',
id: 'wmd-mtitle-button',
svg: '<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M921.6 460.8h-266.24c-20.48-61.44-76.8-102.4-143.36-102.4s-122.88 40.96-143.36 102.4H102.4c-30.72 0-51.2 20.48-51.2 51.2s20.48 51.2 51.2 51.2h266.24c20.48 61.44 76.8 102.4 143.36 102.4s122.88-40.96 143.36-102.4H921.6c30.72 0 51.2-20.48 51.2-51.2s-20.48-51.2-51.2-51.2z m-409.6 102.4c-30.72 0-51.2-20.48-51.2-51.2s20.48-51.2 51.2-51.2 51.2 20.48 51.2 51.2-20.48 51.2-51.2 51.2z" fill="#9b9b9b" p-id="11537"></path></svg>'
}
]
/* 用于设置插入到文章的短代码内容 */ /* 用于设置插入到文章的短代码内容 */
function getInsertTextById(id) { function getInsertTextById(id) {
let str = ''; let str = ''
switch (id) { switch (id) {
case 'wmd-hide-button': case 'wmd-hide-button':
str = `\n\n[hide]${$('#text').selectionRange() ? $('#text').selectionRange() : '回复可见'}[/hide]\n\n`; str = `\n\n[hide]${$('#text').selectionRange() ? $('#text').selectionRange() : '回复可见'}[/hide]\n\n`
break; break
case 'wmd-mlist-button': case 'wmd-mlist-button':
str = `\n\n[music-list id="网易云歌单ID" /]\n\n`; str = `\n\n[music-list id="网易云歌单ID" /]\n\n`
break; break
case 'wmd-music-button': case 'wmd-music-button':
str = `\n\n[music id="网易云音乐ID" /]\n\n`; str = `\n\n[music id="网易云音乐ID" /]\n\n`
break; break
case 'wmd-bili-button': case 'wmd-bili-button':
str = `\n\n[bilibili bvid="哔哩哔哩的Bvid" /]\n\n`; str = `\n\n[bilibili bvid="哔哩哔哩的Bvid" /]\n\n`
break; break
case 'wmd-dplayer-button': case 'wmd-dplayer-button':
str = `\n\n[dplayer src="M3U8或MP4地址" /]\n\n`; str = `\n\n[dplayer src="M3U8或MP4地址" /]\n\n`
break; break
case 'wmd-html-button': 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`; str = `\n\n!!!\n<span class="test">Hello Joe</span>\n<style>\n .test { color: #ff6800 }\n</style>\n!!!\n\n`
break; break
case 'wmd-title-button': case 'wmd-title-button':
str = `\n\n# 一级标题\n## 二级标题\n### 三级标题\n#### 四级标题\n##### 五级标题\n###### 六级标题\n\n`; str = `\n\n# 一级标题\n## 二级标题\n### 三级标题\n#### 四级标题\n##### 五级标题\n###### 六级标题\n\n`
break; break
case 'wmd-table-button': case 'wmd-table-button':
str = `\n\n| 左对齐 | 右对齐 | 居中对齐 |\n| :-----| ----: | :----: |\n| 单元格 | 单元格 | 单元格 |\n\n`; str = `\n\n| 左对齐 | 右对齐 | 居中对齐 |\n| :-----| ----: | :----: |\n| 单元格 | 单元格 | 单元格 |\n\n`
break; break
case 'wmd-delete-button': case 'wmd-delete-button':
str = `~~${$('#text').selectionRange() ? $('#text').selectionRange() : '删除线'}~~`; str = `~~${$('#text').selectionRange() ? $('#text').selectionRange() : '删除线'}~~`
break; break
case 'wmd-snippet-button': case 'wmd-snippet-button':
str = `\n\n\`\`\`php\necho 'Hello Joe';\n\`\`\`\n\n`; str = `\n\n\`\`\`php\necho 'Hello Joe';\n\`\`\`\n\n`
break; break
case 'wmd-code-button': case 'wmd-code-button':
str = ` \`${$('#text').selectionRange() ? $('#text').selectionRange() : '行内代码'}\` `; str = ` \`${$('#text').selectionRange() ? $('#text').selectionRange() : '行内代码'}\` `
break; break
case 'wmd-task-button': case 'wmd-task-button':
str = `[x] 任务已完成\n[ ] 任务未完成`; str = `[x] 任务已完成\n[ ] 任务未完成`
break; break
case 'wmd-card-button': case 'wmd-card-button':
str = `\n\n[card-default width="100%" label="卡片标题"]${$('#text').selectionRange() ? $('#text').selectionRange() : '卡片内容'}[/card-default]\n\n`; str = `\n\n[card-default width="100%" label="卡片标题"]${$('#text').selectionRange() ? $('#text').selectionRange() : '卡片内容'}[/card-default]\n\n`
break; break
case 'wmd-message-button': case 'wmd-message-button':
str = `\n\n[message type="success|info|warning|error"]${$('#text').selectionRange() ? $('#text').selectionRange() : '提示内容'}[/message]\n\n`; str = `\n\n[message type="success|info|warning|error"]${$('#text').selectionRange() ? $('#text').selectionRange() : '提示内容'}[/message]\n\n`
break; break
case 'wmd-mtitle-button':
str = `\n\n[mtitle]${$('#text').selectionRange() ? $('#text').selectionRange() : '居中标题'}[/mtitle]\n\n`
break
} }
return str; return str
} }
/* 此处无需修改 */ /* 此处无需修改 */
items.forEach(_ => { items.forEach(_ => {
let item = $(`<li class="wmd-button" id="${_.id}" title="${_.title}">${_.svg}</li>`); let item = $(`<li class="wmd-button" id="${_.id}" title="${_.title}">${_.svg}</li>`)
item.on('mousedown touchstart', () => $('#text').insertContent(getInsertTextById(_.id))); item.on('mousedown touchstart', () => $('#text').insertContent(getInsertTextById(_.id)))
$('#wmd-button-row').append(item); $('#wmd-button-row').append(item)
}); })
}); })