diff options
Diffstat (limited to '')
| -rw-r--r-- | doc/docs/.vuepress/theme/global-components/Badge.vue | 44 |
1 files changed, 44 insertions, 0 deletions
diff --git a/doc/docs/.vuepress/theme/global-components/Badge.vue b/doc/docs/.vuepress/theme/global-components/Badge.vue new file mode 100644 index 0000000..53951f9 --- /dev/null +++ b/doc/docs/.vuepress/theme/global-components/Badge.vue | |||
| @@ -0,0 +1,44 @@ | |||
| 1 | <script> | ||
| 2 | export default { | ||
| 3 | functional: true, | ||
| 4 | props: { | ||
| 5 | type: { | ||
| 6 | type: String, | ||
| 7 | default: 'tip' | ||
| 8 | }, | ||
| 9 | text: String, | ||
| 10 | vertical: { | ||
| 11 | type: String, | ||
| 12 | default: 'top' | ||
| 13 | } | ||
| 14 | }, | ||
| 15 | render (h, { props, slots }) { | ||
| 16 | return h('span', { | ||
| 17 | class: ['badge', props.type], | ||
| 18 | style: { | ||
| 19 | verticalAlign: props.vertical | ||
| 20 | } | ||
| 21 | }, props.text || slots().default) | ||
| 22 | } | ||
| 23 | } | ||
| 24 | </script> | ||
| 25 | |||
| 26 | <style lang="stylus" scoped> | ||
| 27 | .badge | ||
| 28 | display inline-block | ||
| 29 | font-size 14px | ||
| 30 | height 18px | ||
| 31 | line-height 18px | ||
| 32 | border-radius 3px | ||
| 33 | padding 0 6px | ||
| 34 | color white | ||
| 35 | background-color #42b983 | ||
| 36 | &.tip, &.green | ||
| 37 | background-color $badgeTipColor | ||
| 38 | &.error | ||
| 39 | background-color $badgeErrorColor | ||
| 40 | &.warning, &.warn, &.yellow | ||
| 41 | background-color $badgeWarningColor | ||
| 42 | & + & | ||
| 43 | margin-left 5px | ||
| 44 | </style> | ||
