68 lines
1.3 KiB
Vue
68 lines
1.3 KiB
Vue
<template>
|
|
<div>
|
|
<nuxt />
|
|
<b-alert
|
|
:show="showErrorAlert"
|
|
dismissible
|
|
variant="danger"
|
|
class="status-alert"
|
|
@dismissed="showErrorAlert=!showErrorAlert"
|
|
>
|
|
<p>{{ ErrorAlertMessage }}</p>
|
|
</b-alert>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState } from 'vuex'
|
|
|
|
export default {
|
|
computed: {
|
|
...mapState(['ErrorAlertMessage']),
|
|
|
|
showErrorAlert: {
|
|
get () {
|
|
return this.$store.state.showErrorAlert
|
|
},
|
|
set () {
|
|
this.$store.commit('UPDATE_SHOW_ERROR_ALERT', false)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
html, body {
|
|
font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI',
|
|
Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
color: #c4c4c4;
|
|
font-size: 15px;
|
|
word-spacing: 1px;
|
|
-ms-text-size-adjust: 100%;
|
|
-webkit-text-size-adjust: 100%;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
-webkit-font-smoothing: antialiased;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
height: 100%;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
a {
|
|
color: #c4c4c4;
|
|
}
|
|
|
|
.status-alert {
|
|
position: fixed;
|
|
z-index: 1001;
|
|
top: 55px;
|
|
right: 10px;
|
|
width: 400px;
|
|
max-width: 500px;
|
|
height: 100px;
|
|
max-height: 100px;
|
|
}
|
|
</style>
|