diff --git a/src/components/AppSnackbar.vue b/src/components/AppSnackbar.vue
index 609d54a88..fd9f9060f 100644
--- a/src/components/AppSnackbar.vue
+++ b/src/components/AppSnackbar.vue
@@ -3,16 +3,17 @@
v-model="show"
:timeout="timeout"
:color="color"
- :class="className"
- variant="elevated"
+ :class="[className, { outlined: variant === 'outlined' }]"
+ :variant="variant"
location="bottom"
width="100%"
:multi-line="message.length > 50"
+ @click:outside="show = false"
>
{{ message }}
({
@@ -12,11 +13,12 @@ const state = () => ({
})
const mutations = {
- show(state, { message = '', timeout = SNACKBAR_TIMEOUT, color = '' }) {
+ show(state, { message = '', timeout = SNACKBAR_TIMEOUT, color = '', variant = '' }) {
if (message) {
state.message = message
state.color = color
state.timeout = timeout
+ state.variant = variant
state.show = true
}
@@ -28,6 +30,7 @@ const mutations = {
state.message = initialState.message
state.timeout = initialState.timeout
state.color = initialState.color
+ state.variant = initialState.variant
}
}
diff --git a/src/views/SendFunds.vue b/src/views/SendFunds.vue
index 0a2761ba5..69bf5e680 100644
--- a/src/views/SendFunds.vue
+++ b/src/views/SendFunds.vue
@@ -80,8 +80,8 @@ export default {
onError(message) {
this.$store.dispatch('snackbar/show', {
message,
- color: '#ED5270',
- timeout: 5000
+ timeout: -1,
+ variant: 'outlined'
})
}
}