feat: info custom container

pull/363/head
Evan You 3 years ago
parent de2628983d
commit 4925fb5c29

@ -128,6 +128,10 @@ Custom containers can be defined by their types, titles, and contents.
This is a tip This is a tip
::: :::
::: info
This is an info box
:::
::: warning ::: warning
This is a warning This is a warning
::: :::
@ -143,6 +147,10 @@ This is a dangerous warning
This is a tip This is a tip
::: :::
::: info
This is an info box
:::
::: warning ::: warning
This is a warning This is a warning
::: :::

@ -1,4 +1,5 @@
.custom-block.tip, .custom-block.tip,
.custom-block.info,
.custom-block.warning, .custom-block.warning,
.custom-block.danger { .custom-block.danger {
margin: 1rem 0; margin: 1rem 0;
@ -12,6 +13,11 @@
border-color: var(--c-brand); border-color: var(--c-brand);
} }
.custom-block.info {
background-color: #f3f5f7;
border-color: var(--c-text-light-2);
}
.custom-block.warning { .custom-block.warning {
border-color: #e7c000; border-color: #e7c000;
color: #6b5900; color: #6b5900;

@ -5,6 +5,7 @@ const container = require('markdown-it-container')
export const containerPlugin = (md: MarkdownIt) => { export const containerPlugin = (md: MarkdownIt) => {
md.use(...createContainer('tip', 'TIP')) md.use(...createContainer('tip', 'TIP'))
.use(...createContainer('info', 'INFO'))
.use(...createContainer('warning', 'WARNING')) .use(...createContainer('warning', 'WARNING'))
.use(...createContainer('danger', 'WARNING')) .use(...createContainer('danger', 'WARNING'))
// explicitly escape Vue syntax // explicitly escape Vue syntax

Loading…
Cancel
Save