markdown-it: support alert text via markdown-it-container plugin

::: alert-info
This is an info text.
:::
This commit is contained in:
Le Tan 2018-11-09 20:37:44 +08:00
parent 1951b30b11
commit 2637fd90ec
12 changed files with 149 additions and 1 deletions

View File

@ -207,6 +207,7 @@ In VNote, almost everything is configurable, such as background color, font, and
- [markdown-it-imsize](https://github.com/tatsy/markdown-it-imsize) (Unknown) (Thanks @Kinka for help)
- [markdown-it-emoji](https://github.com/markdown-it/markdown-it-emoji) (MIT License)
- [markdown-it-texmath](https://github.com/goessner/markdown-it-texmath) (MIT License)
- [markdown-it-container 2.0.0](https://github.com/markdown-it/markdown-it-container) (MIT License)
- [mermaid 7.0.0](https://github.com/knsv/mermaid) (MIT License)
- [MathJax](https://www.mathjax.org/) (Apache-2.0)
- [showdown](https://github.com/showdownjs/showdown) (Unknown)

View File

@ -208,6 +208,7 @@ VNote中几乎一切都是可以定制的例如背景颜色、字体以及
- [markdown-it-imsize](https://github.com/tatsy/markdown-it-imsize) (Unknown) (Thanks @Kinka for help)
- [markdown-it-emoji](https://github.com/markdown-it/markdown-it-emoji) (MIT License)
- [markdown-it-texmath](https://github.com/goessner/markdown-it-texmath) (MIT License)
- [markdown-it-container 2.0.0](https://github.com/markdown-it/markdown-it-container) (MIT License)
- [mermaid 7.0.0](https://github.com/knsv/mermaid) (MIT License)
- [MathJax](https://www.mathjax.org/) (Apache-2.0)
- [showdown](https://github.com/showdownjs/showdown) (Unknown)

View File

@ -128,3 +128,61 @@ span.modal-close:focus {
}
}
/* Print*/
/* Alert */
.alert {
position: relative;
padding: .75rem 1.25rem;
margin-bottom: 1rem;
border: 1px solid transparent;
border-radius: .25rem;
}
.alert-primary {
color: #004085;
background-color: #cce5ff;
border-color: #b8daff;
}
.alert-secondary {
color: #383d41;
background-color: #e2e3e5;
border-color: #d6d8db;
}
.alert-success {
color: #155724;
background-color: #d4edda;
border-color: #c3e6cb;
}
.alert-info {
color: #0c5460;
background-color: #d1ecf1;
border-color: #bee5eb;
}
.alert-warning {
color: #856404;
background-color: #fff3cd;
border-color: #ffeeba;
}
.alert-danger {
color: #721c24;
background-color: #f8d7da;
border-color: #f5c6cb;
}
.alert-light {
color: #818182;
background-color: #fefefe;
border-color: #fdfdfe;
}
.alert-dark {
color: #1b1e21;
background-color: #d6d8d9;
border-color: #c6c8ca;
}
/* Alert */

View File

@ -216,6 +216,36 @@ This is the 1^st^ superscript.
This is the H~2~O subscript.
```
### Alert
With `Markdown-it` renderer, you can add some alert text.
```md
::: alert-info
This is an info text.
:::
::: alert-danger
This is a danger text.
:::
```
Available variants:
```
alert-primary
alert-secondary
alert-success
alert-info
alert-warning
alert-danger
alert-light
alert-dark
```
### New Line and Paragraph
If you want to enter a new line, you should add two spaces after current line and then continue your input. VNote provides `Shift+Enter` to help.

View File

@ -217,6 +217,36 @@ This is the 1^st^ superscript.
This is the H~2~O subscript.
```
### 警告
使用`Markdown-it`渲染引擎时,可以添加警告信息。
```md
::: alert-info
这是一个信息文本。
:::
::: alert-danger
这是一个危险文本。
:::
```
可用的一些警告形式如下:
```
alert-primary
alert-secondary
alert-success
alert-info
alert-warning
alert-danger
alert-light
alert-dark
```
### 换行和段落
如果需要换行您应该在当前行末尾添加两个空格然后换行。VNote提供快捷键`Shift+Enter`来辅助用户输入两个空格并换行。

View File

@ -112,6 +112,24 @@ if (typeof texmath != 'undefined') {
mdit = mdit.use(texmath, { delimiters: ['dollars', 'raw'] });
}
mdit.use(window.markdownitContainer, 'alert', {
validate: function(params) {
return params.trim().match(/^alert-\S+$/);
},
render: function (tokens, idx) {
let type = tokens[idx].info.trim().match(/^(alert-\S+)$/);
if (tokens[idx].nesting === 1) {
// opening tag
let alertClass = type[1];
return '<div class="alert ' + alertClass + '" role="alert">';
} else {
// closing tag
return '</div>\n';
}
}
});
var mdHasTocSection = function(markdown) {
var n = markdown.search(/(\n|^)\[toc\]/i);
return n != -1;

View File

@ -39,3 +39,7 @@ Vitaly Puzrin
# [markdown-it-texmath](https://github.com/goessner/markdown-it-texmath)
v0.0.0
Stefan Goessner
# [markdown-it-container](https://github.com/markdown-it/markdown-it-container)
v2.0.0
Vitaly Puzrin

View File

@ -0,0 +1,2 @@
/*! markdown-it-container 2.0.0 https://github.com//markdown-it/markdown-it-container @license MIT */
!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var r;r="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,r.markdownitContainer=e()}}(function(){return function e(r,n,t){function o(f,a){if(!n[f]){if(!r[f]){var u="function"==typeof require&&require;if(!a&&u)return u(f,!0);if(i)return i(f,!0);var c=new Error("Cannot find module '"+f+"'");throw c.code="MODULE_NOT_FOUND",c}var s=n[f]={exports:{}};r[f][0].call(s.exports,function(e){var n=r[f][1][e];return o(n?n:e)},s,s.exports,e,r,n,t)}return n[f].exports}for(var i="function"==typeof require&&require,f=0;f<t.length;f++)o(t[f]);return o}({1:[function(e,r,n){"use strict";r.exports=function(e,r,n){function t(e){return e.trim().split(" ",2)[0]===r}function o(e,n,t,o,i){return 1===e[n].nesting&&e[n].attrPush(["class",r]),i.renderToken(e,n,t,o,i)}function i(e,n,t,o){var i,l,d,p,k,h,b,m,v=!1,y=e.bMarks[n]+e.tShift[n],_=e.eMarks[n];if(u!==e.src.charCodeAt(y))return!1;for(i=y+1;_>=i&&a[(i-y)%c]===e.src[i];i++);if(d=Math.floor((i-y)/c),f>d)return!1;if(i-=(i-y)%c,p=e.src.slice(y,i),k=e.src.slice(i,_),!s(k))return!1;if(o)return!0;for(l=n;(l++,!(l>=t))&&(y=e.bMarks[l]+e.tShift[l],_=e.eMarks[l],!(_>y&&e.sCount[l]<e.blkIndent));)if(u===e.src.charCodeAt(y)&&!(e.sCount[l]-e.blkIndent>=4)){for(i=y+1;_>=i&&a[(i-y)%c]===e.src[i];i++);if(!(Math.floor((i-y)/c)<d||(i-=(i-y)%c,i=e.skipSpaces(i),_>i))){v=!0;break}}return b=e.parentType,m=e.lineMax,e.parentType="container",e.lineMax=l,h=e.push("container_"+r+"_open","div",1),h.markup=p,h.block=!0,h.info=k,h.map=[n,l],e.md.block.tokenize(e,n+1,l),h=e.push("container_"+r+"_close","div",-1),h.markup=e.src.slice(y,i),h.block=!0,e.parentType=b,e.lineMax=m,e.line=l+(v?1:0),!0}n=n||{};var f=3,a=n.marker||":",u=a.charCodeAt(0),c=a.length,s=n.validate||t,l=n.render||o;e.block.ruler.before("fence","container_"+r,i,{alt:["paragraph","reference","blockquote","list"]}),e.renderer.rules["container_"+r+"_open"]=l,e.renderer.rules["container_"+r+"_close"]=l}},{}]},{},[1])(1)});

View File

@ -705,7 +705,8 @@ QString VUtils::generateHtmlTemplate(const QString &p_template,
"<script src=\"qrc" + VNote::c_markdownitAnchorExtraFile + "\"></script>\n" +
"<script src=\"qrc" + VNote::c_markdownitTaskListExtraFile + "\"></script>\n" +
"<script src=\"qrc" + VNote::c_markdownitImsizeExtraFile + "\"></script>\n" +
"<script src=\"qrc" + VNote::c_markdownitFootnoteExtraFile + "\"></script>\n";
"<script src=\"qrc" + VNote::c_markdownitFootnoteExtraFile + "\"></script>\n" +
"<script src=\"qrc" + VNote::c_markdownitContainerExtraFile + "\"></script>\n";
if (g_config->getEnableMathjax()) {
extraFile += "<script src=\"qrc" + VNote::c_markdownitTexMathExtraFile + "\"></script>\n";

View File

@ -43,6 +43,7 @@ const QString VNote::c_markdownitFrontMatterExtraFile = ":/utils/markdown-it/mar
const QString VNote::c_markdownitImsizeExtraFile = ":/utils/markdown-it/markdown-it-imsize.min.js";
const QString VNote::c_markdownitEmojiExtraFile = ":/utils/markdown-it/markdown-it-emoji.min.js";
const QString VNote::c_markdownitTexMathExtraFile = ":/utils/markdown-it/markdown-it-texmath.js";
const QString VNote::c_markdownitContainerExtraFile = ":/utils/markdown-it/markdown-it-container.min.js";
const QString VNote::c_showdownJsFile = ":/resources/showdown.js";
const QString VNote::c_showdownExtraFile = ":/utils/showdown/showdown.min.js";

View File

@ -54,6 +54,7 @@ public:
static const QString c_markdownitImsizeExtraFile;
static const QString c_markdownitEmojiExtraFile;
static const QString c_markdownitTexMathExtraFile;
static const QString c_markdownitContainerExtraFile;
// Showdown
static const QString c_showdownJsFile;

View File

@ -276,5 +276,6 @@
<file>resources/docs/welcome_en.md</file>
<file>resources/docs/welcome_zh.md</file>
<file>resources/icons/256x256/vnote.png</file>
<file>utils/markdown-it/markdown-it-container.min.js</file>
</qresource>
</RCC>