add color to error msg

src/views/components/OperationModal/index.vue

@@ -118,7 +118,15 @@
             </b-col>
           </b-row>
         </b-form>
-        {{ error }}
+        <b-alert
+          v-model="showDismissibleAlert"
+          variant="danger"
+          dismissible
+        >
+          <div class="alert-body">
+            <span>{{ error }}</span>
+          </div>
+        </b-alert>
       </validation-observer>
 
       <TransactionResult
@@ -163,7 +171,7 @@
 import { ValidationProvider, ValidationObserver } from 'vee-validate'
 import {
   BAvatar, BModal, BRow, BCol, BInputGroup, BFormInput, BFormGroup, BFormSelect, BFormSelectOption,
-  BForm, BButton, BInputGroupAppend, BFormCheckbox, BOverlay,
+  BForm, BButton, BInputGroupAppend, BFormCheckbox, BOverlay, BAlert,
 } from 'bootstrap-vue'
 import Ripple from 'vue-ripple-directive'
 import {
@@ -190,6 +198,7 @@ import TransactionResult from './TransactionResult.vue'
 export default {
   name: 'DelegateDialogue',
   components: {
+    BAlert,
     BAvatar,
     BModal,
     BRow,
@@ -265,6 +274,7 @@ export default {
       balance: [],
       IBCDenom: {},
       error: null,
+      showDismissibleAlert: false,
       sequence: 1,
       accountNumber: 0,
       advance: false,
@@ -422,10 +432,14 @@ export default {
             time: new Date(),
           })
         }).catch(e => {
+          this.showResult = false
           this.error = e
+          this.showDismissibleAlert = true
         })
       }).catch(e => {
+        this.showResult = false
         this.error = e
+        this.showDismissibleAlert = true
       })
       return ''
     },