1<template>
2  <b-alert :show="show" :variant="variant" :class="{ small }">
3    <div v-if="variant == 'warning' || variant == 'danger'" class="alert-icon">
4      <status-icon :status="variant" />
5    </div>
6    <div class="alert-content">
7      <div class="alert-msg"><slot /></div>
8    </div>
9  </b-alert>
10</template>
11
12<script>
13import StatusIcon from '../Global/StatusIcon';
14import { BAlert } from 'bootstrap-vue';
15
16export default {
17  name: 'Alert',
18  components: {
19    BAlert: BAlert,
20    StatusIcon: StatusIcon
21  },
22  props: {
23    show: {
24      type: Boolean,
25      default: true
26    },
27    variant: {
28      type: String,
29      default: ''
30    },
31    small: Boolean
32  }
33};
34</script>
35
36<style lang="scss" scoped>
37.alert.small {
38  padding: $spacer / 2;
39  font-size: 1rem;
40}
41</style>
42