提交 352533c5 编写于 作者: 他们都叫我老廾's avatar 他们都叫我老廾

add:标题

上级 8c56ab19
(self.webpackChunkmarkdown_editor=self.webpackChunkmarkdown_editor||[]).push([[339],{8632:(e,n,l)=>{"use strict";l.d(n,{Z:()=>s});var r=l(3645),i=l.n(r)()((function(e){return e[1]}));i.push([e.id,"/*\n\nDark style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>\n\n*/\n.md_preview .md_hljs {\n color: #ddd;\n background: #444;\n}\n.md_preview .hljs-keyword,\n.md_preview .hljs-selector-tag,\n.md_preview .hljs-literal,\n.md_preview .hljs-section,\n.md_preview .hljs-link {\n color: white;\n}\n.md_preview .hljs-subst {\n /* default */\n}\n.md_preview .hljs-string,\n.md_preview .hljs-title,\n.md_preview .hljs-name,\n.md_preview .hljs-type,\n.md_preview .hljs-attribute,\n.md_preview .hljs-symbol,\n.md_preview .hljs-bullet,\n.md_preview .hljs-built_in,\n.md_preview .hljs-addition,\n.md_preview .hljs-variable,\n.md_preview .hljs-template-tag,\n.md_preview .hljs-template-variable {\n color: #d88;\n}\n.md_preview .hljs-comment,\n.md_preview .hljs-quote,\n.md_preview .hljs-deletion,\n.md_preview .hljs-meta {\n color: #777;\n}\n.md_preview .hljs-keyword,\n.md_preview .hljs-selector-tag,\n.md_preview .hljs-literal,\n.md_preview .hljs-title,\n.md_preview .hljs-section,\n.md_preview .hljs-doctag,\n.md_preview .hljs-type,\n.md_preview .hljs-name,\n.md_preview .hljs-strong {\n font-weight: bold;\n}\n.md_preview .hljs-emphasis {\n font-style: italic;\n}\n",""]);const s=i},1339:(e,n,l)=>{"use strict";l.r(n),l.d(n,{default:()=>d});var r=l(3379),i=l.n(r),s=l(8632);i()(s.Z,{insert:"head",singleton:!1});const d=s.Z.locals||{}}}]);
\ No newline at end of file
(self.webpackChunkmarkdown_editor=self.webpackChunkmarkdown_editor||[]).push([[642],{8657:(e,n,l)=>{"use strict";l.d(n,{Z:()=>i});var r=l(3645),s=l.n(r)()((function(e){return e[1]}));s.push([e.id,"/*\n\nAtom One Dark by Daniel Gamage\nOriginal One Dark Syntax theme from https://github.com/atom/one-dark-syntax\n\nbase: #282c34\nmono-1: #abb2bf\nmono-2: #818896\nmono-3: #5c6370\nhue-1: #56b6c2\nhue-2: #61aeee\nhue-3: #c678dd\nhue-4: #98c379\nhue-5: #e06c75\nhue-5-2: #be5046\nhue-6: #d19a66\nhue-6-2: #e6c07b\n\n*/\n.md_preview .md_hljs {\n color: #abb2bf;\n background: #282c34;\n}\n.md_preview .hljs-comment,\n.md_preview .hljs-quote {\n color: #5c6370;\n font-style: italic;\n}\n.md_preview .hljs-doctag,\n.md_preview .hljs-keyword,\n.md_preview .hljs-formula {\n color: #c678dd;\n}\n.md_preview .hljs-section,\n.md_preview .hljs-name,\n.md_preview .hljs-selector-tag,\n.md_preview .hljs-deletion,\n.md_preview .hljs-subst {\n color: #e06c75;\n}\n.md_preview .hljs-literal {\n color: #56b6c2;\n}\n.md_preview .hljs-string,\n.md_preview .hljs-regexp,\n.md_preview .hljs-addition,\n.md_preview .hljs-attribute,\n.md_preview .hljs-meta .hljs-string {\n color: #98c379;\n}\n.md_preview .hljs-attr,\n.md_preview .hljs-variable,\n.md_preview .hljs-template-variable,\n.md_preview .hljs-type,\n.md_preview .hljs-selector-class,\n.md_preview .hljs-selector-attr,\n.md_preview .hljs-selector-pseudo,\n.md_preview .hljs-number {\n color: #d19a66;\n}\n.md_preview .hljs-symbol,\n.md_preview .hljs-bullet,\n.md_preview .hljs-link,\n.md_preview .hljs-meta,\n.md_preview .hljs-selector-id,\n.md_preview .hljs-title {\n color: #61aeee;\n}\n.md_preview .hljs-built_in,\n.md_preview .hljs-title.class_,\n.md_preview .hljs-class .hljs-title {\n color: #e6c07b;\n}\n.md_preview .hljs-emphasis {\n font-style: italic;\n}\n.md_preview .hljs-strong {\n font-weight: bold;\n}\n.md_preview .hljs-link {\n text-decoration: underline;\n}\n",""]);const i=s},642:(e,n,l)=>{"use strict";l.r(n),l.d(n,{default:()=>t});var r=l(3379),s=l.n(r),i=l(8657);s()(i.Z,{insert:"head",singleton:!1});const t=i.Z.locals||{}}}]);
\ No newline at end of file
(self.webpackChunkmarkdown_editor=self.webpackChunkmarkdown_editor||[]).push([[749],{7290:(e,n,l)=>{"use strict";l.d(n,{Z:()=>s});var r=l(3645),i=l.n(r)()((function(e){return e[1]}));i.push([e.id,"/*\n\nLightfair style (c) Tristian Kelly <tristian.kelly560@gmail.com>\n\n*/\n.md_preview .md_hljs {\n color: #444;\n background: var(--md-editor-code-bg-color);\n}\n.md_preview .hljs-name {\n color: #01a3a3;\n}\n.md_preview .hljs-tag,\n.md_preview .hljs-meta {\n color: #778899;\n}\n.md_preview .hljs-subst {\n /* default */\n}\n.md_preview .hljs-comment {\n color: #888888;\n}\n.md_preview .hljs-keyword,\n.md_preview .hljs-attribute,\n.md_preview .hljs-selector-tag,\n.md_preview .hljs-meta .hljs-keyword,\n.md_preview .hljs-doctag,\n.md_preview .hljs-name {\n font-weight: bold;\n}\n.md_preview .hljs-type,\n.md_preview .hljs-string,\n.md_preview .hljs-number,\n.md_preview .hljs-selector-id,\n.md_preview .hljs-selector-class,\n.md_preview .hljs-quote,\n.md_preview .hljs-template-tag,\n.md_preview .hljs-deletion {\n color: #4286f4;\n}\n.md_preview .hljs-title,\n.md_preview .hljs-section {\n color: #4286f4;\n font-weight: bold;\n}\n.md_preview .hljs-regexp,\n.md_preview .hljs-symbol,\n.md_preview .hljs-variable,\n.md_preview .hljs-template-variable,\n.md_preview .hljs-link,\n.md_preview .hljs-selector-attr,\n.md_preview .hljs-selector-pseudo {\n color: #bc6060;\n}\n.md_preview .hljs-literal {\n color: #62bcbc;\n}\n.md_preview .hljs-built_in,\n.md_preview .hljs-bullet,\n.md_preview .hljs-code,\n.md_preview .hljs-addition {\n color: #25c6c6;\n}\n.md_preview .hljs-meta .hljs-string {\n color: #4d99bf;\n}\n.md_preview .hljs-emphasis {\n font-style: italic;\n}\n.md_preview .hljs-strong {\n font-weight: bold;\n}\n",""]);const s=i},1749:(e,n,l)=>{"use strict";l.r(n),l.d(n,{default:()=>d});var r=l(3379),i=l.n(r),s=l(7290);i()(s.Z,{insert:"head",singleton:!1});const d=s.Z.locals||{}}}]);
\ No newline at end of file
此差异已折叠。
<template>
<div class="headline_select_container">
<ul>
<li
@click="$emit('select', index)"
v-for="(item, index) in sortList"
:key="index"
>
{{ item }}
</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
list: [
"1级标题",
"2级标题",
"3级标题",
"4级标题",
"5级标题",
"6级标题",
]
};
},
computed: {
sortList() {
return this.list.sort((a, b) => {
return a.charCodeAt(0) - b.charCodeAt(0);
});
}
}
};
</script>
<style lang="less" scoped>
.headline_select_container {
position: relative;
&::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 18px;
pointer-events: none;
background: linear-gradient(to top, #fff, transparent);
}
}
ul {
max-height: 150px;
overflow-y: auto;
margin-top: 2px;
margin-bottom: 6px;
border-top: 1px solid #e1e1e1;
padding-top: 4px;
box-sizing: border-box;
scrollbar-color: transparent transparent;
scrollbar-width: none;
&::-webkit-scrollbar {
display: none;
}
&::-webkit-scrollbar-thumb {
border-radius: 1em;
background-color: rgba(50, 50, 50, 0.3);
}
&::-webkit-scrollbar-track {
border-radius: 1em;
background-color: rgba(50, 50, 50, 0);
}
li {
cursor: pointer;
height: 24px;
line-height: 24px;
&:hover {
color: var(--md-editor-border-color-active);
}
}
}
</style>
......@@ -10,6 +10,14 @@
>
<span :class="['icon iconfont', `icon-${info.icon}`]"></span>
</div>
<div
v-else-if="info.name === 'headline'"
@click="handleTool(info.name, info.startStr, info.endStr)"
v-tip.bottom="headlineOptions"
class="tool_button"
>
<span :class="['icon iconfont', `icon-${info.icon}`]"></span>
</div>
<div
v-else-if="info.name === 'table'"
@click="handleTool(info.name, info.startStr, info.endStr)"
......@@ -33,8 +41,9 @@ import { checkBoswer } from "@/assets/js/utils";
import codeSelect from "./code-select";
import tableSelect from "./table-select";
import markdownDoc from "./markdown-doc";
import headlineSelect from "./headline-select";
export default {
components: { codeSelect, tableSelect },
components: { codeSelect, tableSelect, headlineSelect },
props: {
info: {
type: Object,
......@@ -103,6 +112,23 @@ export default {
zIndex: parseInt(this.zIndex) + 1,
theme: this.darkMode ? "dark" : "light"
};
},
headlineOptions() {
return {
content: this.info.tip,
customComponent: headlineSelect,
customClass: "headlineSelectDialog",
width: 110,
customListeners: {
select: val => {
this.closeTips();
const lang = '#'.repeat(val+1);
this.handleTool("code", "\n" + lang + " ");
}
},
zIndex: parseInt(this.zIndex) + 1,
theme: this.darkMode ? "dark" : "light"
};
},
tableOptions() {
return {
......@@ -144,6 +170,7 @@ export default {
case "italic":
case "quote":
case "code":
case "headline":
case "link":
case "ul":
case "task":
......
......@@ -163,6 +163,13 @@ export default {
tip: "全屏模式"
},
toolButtonList: [
{
name: "headline",
icon: "yijibiaoti",
tip: "添加标题",
startStr: "\n",
endStr: "\n",
},
{
name: "bold",
icon: "bold",
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册