minor UI fixes

src/components/FolderView/FolderList.vue

@@ -31,5 +31,7 @@ const props = defineProps({
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
   gap: $medium;
+  border-bottom: 1px solid $gray3;
+  padding-bottom: .55rem;
 }
 </style>

src/components/PlaylistView/Header.vue

@@ -70,7 +70,6 @@ function showDropdown(e: any) {
   grid-template-columns: 1fr;
   height: 16rem;
   position: relative;
-  margin-top: $small;
   border-radius: 0.75rem;
   color: $white;
   background-color: transparent;

src/components/contextMenu.vue

@@ -82,7 +82,7 @@ const context = useContextStore();
       width: 1.5rem;
       position: absolute;
       right: 0;
-      background-image: url("../assets/icons/more.svg");
+      background-image: url("../assets/icons/expand.svg");
     }
 
     .children {

src/components/nav/NavBar.vue

@@ -8,11 +8,6 @@
       <div class="info">
         <div class="title" v-if="$route.name == 'Playlists'">Playlists</div>
         <div class="folder" v-else-if="$route.name == 'FolderView'">
-          <div class="play">
-            <PlayBtnRect />
-          </div>
-          <Option v-if="$route.name === 'FolderView'" />
-
           <div class="fname">
             <div class="icon image"></div>
             <div class="ellip">
@@ -27,6 +22,7 @@
       <Loader />
     </div>
     <div class="right">
+      <div class="more image"></div>
       <Search />
     </div>
   </div>
@@ -35,9 +31,7 @@
 <script setup>
 import NavButtons from "./NavButtons.vue";
 import Loader from "../shared/Loader.vue";
-import PlayBtnRect from "../shared/PlayBtnRect.vue";
 import Search from "./Search.vue";
-import Option from "../shared/Option.vue";
 </script>
 
 <style lang="scss">
@@ -85,6 +79,7 @@ import Option from "../shared/Option.vue";
           align-items: center;
           padding-right: $small;
           gap: 0.25rem;
+          margin-left: $smaller;
 
           .icon {
             width: 1.5rem;
@@ -106,6 +101,16 @@ import Option from "../shared/Option.vue";
     width: 100%;
     display: flex;
     gap: $small;
+
+    .more {
+      width: 2.25rem;
+      aspect-ratio: 1;
+      height: 100%;
+      background-color: $gray5;
+      background-image: url("../../assets/icons/more.svg");
+      transform: rotate(90deg);
+      border-radius: $small;
+    }
   }
 }
 </style>

src/components/nav/Search.vue

@@ -23,7 +23,6 @@
       border: none;
       padding: $small;
       width: 100%;
-      min-width: 24rem;
       color: $white;
       font-size: 1rem;