34 lines
592 B
Vue
34 lines
592 B
Vue
<template lang="pug">
|
|
main
|
|
RouterView(v-slot="{ Component }")
|
|
Transition
|
|
KeepAlive
|
|
Component.page(:is="Component")
|
|
</template>
|
|
|
|
<style lang="sass" scoped>
|
|
main
|
|
position: relative
|
|
overflow: hidden
|
|
font-size: 1.5em
|
|
background: #16a085
|
|
|
|
> .page
|
|
position: absolute
|
|
width: 100%
|
|
height: 100%
|
|
|
|
display: flex
|
|
flex-direction: column
|
|
overflow-y: auto
|
|
padding: 1em 4em
|
|
|
|
background: inherit
|
|
|
|
> .page.v-leave-active, > .page.v-enter-active
|
|
transition: transform 0.3s ease
|
|
|
|
> .page.v-enter-from
|
|
transform: translateY(100%)
|
|
</style>
|