mirror of
https://gitee.com/vnotex/vnote.git
synced 2025-07-05 05:49:53 +08:00
markdown-it: support alert text via markdown-it-container plugin
::: alert-info This is an info text. :::
This commit is contained in:
parent
1951b30b11
commit
2637fd90ec
@ -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)
|
||||
|
@ -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)
|
||||
|
@ -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 */
|
||||
|
@ -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.
|
||||
|
||||
|
@ -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`来辅助用户输入两个空格并换行。
|
||||
|
||||
|
@ -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;
|
||||
|
@ -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
|
||||
|
2
src/utils/markdown-it/markdown-it-container.min.js
vendored
Normal file
2
src/utils/markdown-it/markdown-it-container.min.js
vendored
Normal 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)});
|
@ -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";
|
||||
|
@ -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";
|
||||
|
@ -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;
|
||||
|
@ -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>
|
||||
|
Loading…
x
Reference in New Issue
Block a user