Can now edit some basic Journal cfg and other clean up

src/routes/journals/+page.svelte

@@ -3,12 +3,17 @@ let log_lvl: number = 0;
 // console.log(`ae_journals +page data:`, data);
 // console.log(`ae_journals Data Params:`, data.url.searchParams.get('journal_id'));
 
+// *** Import Svelte specific
 import { onMount } from 'svelte';
 import { goto } from '$app/navigation';
-import { FolderPlus } from '@lucide/svelte';
 
-// import { api } from '$lib/api';
+// *** Import other supporting libraries
+import { FolderPlus } from '@lucide/svelte';
 import { liveQuery } from "dexie";
+import { Modal } from 'flowbite-svelte';
+
+// *** Import Aether specific variables and functions
+// import { api } from '$lib/api';
 import { db_journals } from "$lib/ae_journals/db_journals";
 import { journals_func } from '$lib/ae_journals/ae_journals_functions';
 import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
@@ -211,6 +216,14 @@ async function create_journal() {
 
 <!-- Modal for creating new journal -->
 {#if $journals_sess.show__modal_new__journal_obj}
+<Modal
+    title="Create New Journal"
+    bind:open={$journals_sess.show__modal_new__journal_obj}
+    autoclose={false}
+    placement="top-center"
+    size="xl"
+    class="top-center bg-white dark:bg-gray-800 text-gray-800 dark:text-gray-200 rounded-lg border-gray-200 dark:border-gray-700 divide-gray-200 dark:divide-gray-700 shadow-md relative flex flex-col mx-auto w-full divide-y"
+    >
 <div class="modal">
     <div class="modal-box">
         <h3 class="font-bold text-lg">Create New Journal</h3>
@@ -226,6 +239,8 @@ async function create_journal() {
         </div>
     </div>
 </div>
+
+</Modal>
 {/if}