animate navigation list and logo

- move search main into right-sidebar > search
-

src/components/PlaylistView/Header.vue

@@ -1,7 +1,6 @@
 <template>
   <div
     class="p-header image"
-    
     :style="[
       {
         backgroundImage: `url(${imguri + props.info.image})`,
@@ -12,7 +11,7 @@
     <div class="carddd">
       <div class="info">
         <div class="btns">
-          <PlayBtnRect :source="playSources.playlist" v-motion-slide-visible-once-bottom/>
+          <PlayBtnRect :source="playSources.playlist" />
           <Option @showDropdown="showDropdown" :src="context.src" />
         </div>
         <div class="duration">
@@ -26,10 +25,10 @@
           {{ props.info.description }}
         </div>
         <div class="title ellip">{{ props.info.name }}</div>
-        <div class="type" >Playlist</div>
+        <div class="type">Playlist</div>
       </div>
     </div>
-    <div class="last-updated">
+    <div class="last-updated" v-motion-slide-from-right>
       <span class="status"
         >Last updated {{ props.info.lastUpdated }} &#160;|&#160;&#160;</span
       >
@@ -47,8 +46,9 @@ import Option from "../shared/Option.vue";
 import pContext from "../../contexts/playlist";
 import useContextStore from "../../stores/context";
 import { paths } from "../../config";
+import { onBeforeUnmount } from "vue";
 
-const imguri = paths.images.playlist
+const imguri = paths.images.playlist;
 const context = useContextStore();
 const modal = useModalStore();