diff options
Diffstat (limited to 'doc/docs/.vuepress/theme/global-components/Badge.vue')
-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> | ||