[Vuejs]-Smooth Nuxt/Vue transition on the rest of the page when displaying and hidding a list of elements

Try this

.list-enter-active, .list-leave-active {
  transition: all 1s;
  opacity: 1;
}
.list-enter, .list-leave-to {
  opacity: 0; height: 0;
}

https://jsfiddle.net/w4v9g6us/

Also here is a good place to read more about vue and transitions https://v2.vuejs.org/v2/guide/transitions.html