This commit is contained in:
syuilo 2018-09-04 11:34:36 +09:00
parent a5eb19c878
commit f42665d4bc

View file

@ -1,7 +1,9 @@
<template>
<div class="mk-notify">
<div>
<mk-notification-preview :notification="notification"/>
</div>
</div>
</template>
<script lang="ts">
@ -22,7 +24,7 @@ export default Vue.extend({
setTimeout(() => {
anime({
targets: this.$el,
bottom: '-64px',
bottom: '-72px',
duration: 500,
easing: 'easeOutQuad',
complete: () => this.$destroy()
@ -37,13 +39,22 @@ export default Vue.extend({
.mk-notify
position fixed
z-index 1024
bottom -64px
bottom -72px
left 0
right 0
width 100%
height 64px
max-width 500px
height 72px
margin 0 auto
padding 8px
pointer-events none
font-size 80%
> div
height 100%
-webkit-backdrop-filter blur(2px)
backdrop-filter blur(2px)
background-color rgba(#000, 0.5)
border-radius 6px
</style>