ffplayout/layouts/default.vue
2020-09-10 16:29:19 +02:00

67 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;
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>