🎨
This commit is contained in:
parent
a5eb19c878
commit
f42665d4bc
1 changed files with 18 additions and 7 deletions
|
@ -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>
|
||||
|
|
Loading…
Reference in a new issue