Merge pull request #132 from franklinqin0/develop

add custom blocks: right, theorem, details
This commit is contained in:
reco_luan 2020-03-05 12:46:48 +08:00 committed by GitHub
commit eb419a53d1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 59 additions and 2 deletions

View File

@ -37,6 +37,17 @@ keys:
3. 你可以打开 [午后南杂](http://recoluan.gitlab.io) 来查看效果。
:::
::: theorem 牛顿第一定律
假若施加于某物体的外力为零,则该物体的运动速度不变。
::: right
来自 [维基百科](https://zh.wikipedia.org/wiki/%E7%89%9B%E9%A1%BF%E8%BF%90%E5%8A%A8%E5%AE%9A%E5%BE%8B)
:::
::: details
这是一个详情块,在 IE / Edge 中不生效
:::
> 测试
## Use

View File

@ -58,20 +58,41 @@ module.exports = (options, ctx) => ({
['container', {
type: 'tip',
defaultTitle: {
'/': '',
'/zh/': '提示'
}
}],
['container', {
type: 'warning',
defaultTitle: {
'/': '',
'/zh/': '注意'
}
}],
['container', {
type: 'danger',
defaultTitle: {
'/': '',
'/zh/': '警告'
}
}],
['container', {
type: 'right',
defaultTitle: ''
}],
['container', {
type: 'theorem',
before: info => `<div class="custom-block theorem"><p class="title">${info}</p>`,
after: '</div>'
}],
['container', {
type: 'details',
before: info => `<details class="custom-block details">${info ? `<summary>${info}</summary>` : ''}\n`,
after: () => '</details>\n',
defaultTitle: {
'/': 'See More',
'/zh/': '更多'
}
}]
]
})

View File

@ -22,5 +22,30 @@
border-color #f26d6d
.custom-block-title
color #f26d6d
&.right
color transparentify($textColor, 0.4)
font-size 0.9rem
text-align right
&.theorem
margin 1rem 0
padding .1rem 1.5rem
border-radius 0.4rem
background-color #f0f4f8
.title
font-weight bold
&.details
display block
position relative
border-radius 2px
margin 1em 0
padding 1rem
background-color #eee
h4
margin-top 0
figure, p
&:last-child
margin-bottom 0
padding-bottom 0
summary
outline none
cursor pointer