fix some minor issues with the playlists page and navbar

src/components/NavBar.vue

@@ -126,15 +126,18 @@
 
 <script>
 import SearchSuggestions from "./SearchSuggestions.vue";
+import LoginModal from "./LoginModal.vue";
 import hotkeys from "hotkeys-js";
 export default {
     components: {
         SearchSuggestions,
+        LoginModal,
     },
     data() {
         return {
             searchText: "",
             suggestionsVisible: false,
+            showLoginModal: false,
             showTopNav: false,
         };
     },

src/components/PlaylistsPage.vue

@@ -4,17 +4,25 @@
     <hr />
 
     <div>
-        <div class="flex">
+        <div class="flex justify-between">
             <button v-t="'actions.create_playlist'" class="btn mr-2" @click="onCreatePlaylist" />
+            <div class="flex">
                 <button
                     v-if="this.playlists.length > 0"
                     v-t="'actions.export_to_json'"
                     class="btn"
                     @click="exportPlaylists"
                 />
-            <input id="fileSelector" ref="fileSelector" type="file" class="display-none" @change="importPlaylists" />
+                <input
+                    id="fileSelector"
+                    ref="fileSelector"
+                    type="file"
+                    class="display-none"
+                    @change="importPlaylists"
+                />
                 <label for="fileSelector" v-t="'actions.import_from_json'" class="btn ml-2" role="button" />
             </div>
+        </div>
 
         <div class="video-grid">
             <div v-for="playlist in playlists" :key="playlist.id" class="efy_trans_filter">