diff options
Diffstat (limited to 'src/components/Global/StatusIcon.vue')
-rw-r--r-- | src/components/Global/StatusIcon.vue | 38 |
1 files changed, 38 insertions, 0 deletions
diff --git a/src/components/Global/StatusIcon.vue b/src/components/Global/StatusIcon.vue new file mode 100644 index 00000000..bb208409 --- /dev/null +++ b/src/components/Global/StatusIcon.vue @@ -0,0 +1,38 @@ +<template> + <span :class="['status-icon', status]"> + <icon-success v-if="status === 'success'" /> + <icon-danger v-else-if="status === 'danger'" /> + <icon-secondary v-else /> + </span> +</template> + +<script> +import IconCheckmark from "@carbon/icons-vue/es/checkmark--filled/20"; +import IconWarning from "@carbon/icons-vue/es/warning--filled/20"; +import IconError from "@carbon/icons-vue/es/error--filled/20"; + +export default { + name: "StatusIcon", + props: ["status"], + components: { + iconSuccess: IconCheckmark, + iconDanger: IconWarning, + iconSecondary: IconError + } +}; +</script> + +<style lang="scss" scoped> +.status-icon { + vertical-align: text-bottom; + &.success { + fill: $success; + } + &.danger { + fill: $danger; + } + &.secondary { + fill: $secondary; + } +} +</style> |