You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
45 lines
850 B
45 lines
850 B
<template> |
|
<span :class="['wkb-tag', type]"> |
|
<slot /> |
|
</span> |
|
</template> |
|
|
|
<script lang="ts" setup> |
|
import { useStore } from "vuex"; |
|
import { reactive, onMounted, ref } from "vue"; |
|
|
|
const { state, commit, dispatch } = useStore(); |
|
const prop = defineProps({ |
|
type: { |
|
type: String, |
|
default: 'primary' |
|
} |
|
}); |
|
|
|
onMounted(() => { }); |
|
</script> |
|
<style scoped lang="scss"> |
|
.wkb-tag { |
|
font-weight: 500; |
|
font-size: 18px; |
|
line-height: 24px; |
|
text-transform: uppercase; |
|
padding: 2px 10px; |
|
border-radius: 10.5px; |
|
|
|
&.primary { |
|
color: #387dff; |
|
background-color: rgba(#387dff, 0.2); |
|
} |
|
|
|
&.success { |
|
color: #23b899; |
|
background-color: rgba(#23b899, 0.2); |
|
} |
|
|
|
&.danger { |
|
color: #fe7c4b; |
|
background-color: rgba(#fe7c4b, 0.2); |
|
} |
|
} |
|
</style> |