Style improvements

src/routes/journals/+page.svelte

@@ -11,7 +11,8 @@ import { goto } from '$app/navigation';
 import {
         BookPlus,
         FolderPlus, Library,
-        SquareLibrary
+        SquareLibrary,
+        Wrench
     } from '@lucide/svelte';
 import { liveQuery } from "dexie";
 import { Modal } from 'flowbite-svelte';
@@ -21,7 +22,7 @@ import { Modal } from 'flowbite-svelte';
 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';
-import { journals_loc, journals_slct, journals_trig } from '$lib/ae_journals/ae_journals_stores';
+import { journals_loc, journals_sess, journals_slct, journals_trig } from '$lib/ae_journals/ae_journals_stores';
 import { ae_util } from '$lib/ae_utils/ae_utils';
 interface Props {
     data: any;
@@ -31,7 +32,6 @@ let { data }: Props = $props();
 
 
 import Journal_obj_li from './ae_comp__journal_obj_li.svelte';
-	import { journals_sess } from '$lib/ae_journals/ae_journals_stores';
 
 // import Element_data_store from '$lib/element_data_store_v2.svelte';
 
@@ -161,24 +161,55 @@ async function create_journal() {
     Journals for {$ae_loc.account_name ?? 'Æ loading...'}
 </h1>
 
-<div class="flex flex-row items-center justify-center w-full border-gray-200 border-y-2 py-2">
+<div
+    class="flex flex-row flex-wrap gap-1 items-center justify-center w-full border-gray-200 border-y-2 py-2"
+    class:hidden={!$ae_loc.edit_mode}
+    >
     <!-- Add new journal button -->
     <button
+        type="button"
         class="
-        btn btn-sm
+            btn btn-sm
-        variant-ghost-secondary
+            variant-ghost-secondary
-        hover:variant-filled-secondary
+            hover:variant-filled-secondary
-        transition
+            transition
-        "
+            "
         onclick={
             () => {
                 $journals_sess.show__modal_new__journal_obj = true;
             }
         }
+        title="Create a new journal"
         >
         <!-- <FolderPlus class="mx-1" /> -->
-        <BookPlus />
+        <BookPlus class="mx-1" />
-        New Journal
+        <span class="hidden md:inline">
+            New Journal
+        </span>
+    </button>
+
+    <!-- Show Journals Config button -->
+    <button
+        disabled={true}
+        type="button"
+        class="
+            btn btn-sm
+            variant-ghost-secondary
+            hover:variant-filled-secondary
+            transition
+            "
+        onclick={
+            () => {
+                // Redirect to the journals config page
+                // goto('/journals/config');
+            }
+        }
+        title="Configure Journals"
+        >
+        <Wrench class="mx-1" />
+        <span class="hidden md:inline">
+            Journals Config
+        </span>
     </button>
 
 </div>

src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte

@@ -726,7 +726,14 @@ $effect(() => {
     tabindex={$ae_loc.edit_mode ? 0 : -1}
     class:bg-orange-100={$ae_loc.edit_mode}
     class:hidden={!$ae_loc.trusted_access || $journals_loc.entry.edit_kv[$lq__journal_entry_obj?.journal_entry_id]}
-    class="flex-grow w-full font-mono shadow-md rounded-lg border-gray-500 bg-gray-100 p-2"
+    class="
+        flex-grow min-h-48 w-full max-w-6xl
+        p-2
+        font-mono shadow-md rounded-lg
+        border border-gray-200 dark:border-gray-700
+        hover:border-gray-500 dark:hover:border-gray-500
+        "
+
     >
     <article
         class="prose"
@@ -739,7 +746,10 @@ $effect(() => {
 
 <div
     class:hidden={!$journals_loc.entry.edit_kv[$lq__journal_entry_obj?.journal_entry_id] && $lq__journal_entry_obj?.content?.length}
-    class="flex-grow flex flex-col items-center justify-center w-full max-w-6xl"
+    class="
+        flex-grow flex flex-col items-center justify-center
+        w-full max-w-6xl
+        "
     >
 
 <textarea
@@ -752,9 +762,15 @@ $effect(() => {
         }
     }}
     class:bg-orange-100={$ae_loc.edit_mode}
-    class="flex-grow w-full min-h-48 h-full p-2 border border-gray-300 rounded-lg"
+    class="
-    placeholder="Edit journal entry content here..."
+        flex-grow min-h-48 w-full h-full
-    ></textarea>
+        p-2
+        bg-white shadow-lg rounded-lg
+        border border-gray-200 dark:border-gray-700
+        hover:border-gray-500 dark:hover:border-gray-500
+        "
+        placeholder="Edit journal entry content here..."
+        ></textarea>
 
     <!-- Only enable editing if the user has trusted access -->
     <button

src/routes/journals/ae_comp__journal_entry_obj_li.svelte

@@ -95,12 +95,12 @@ let tmp_entry_obj: key_val = $state({});
                     });
                 }}
                 class:hidden={journals_journal_entry_obj.template}
-                class="btn btn-sm p-1 variant-soft-secondary hover:variant-filled-secondary *:hover:inline lg:text-xs"
+                class="btn btn-sm p-1 variant-soft-secondary hover:variant-filled-secondary *:hover:inline text-xs lg:text-sm"
                 title="Copy the markdown content"
                 >
                 <!-- <span class="fas fa-copy mx-1"></span> -->
                 <Copy size="1em" />
-                <RemoveFormatting size="2em" />
+                <RemoveFormatting size="1.25em" />
                 <span class="hidden">
                 Copy Plaintext Markdown
                 </span>
@@ -127,7 +127,7 @@ let tmp_entry_obj: key_val = $state({});
                 >
                 <!-- <span class="fas fa-copy mx-1"></span> -->
                 <Copy size="1em" />
-                <CodeXml size="2em" />
+                <CodeXml size="1.25em" />
                 <span class="hidden">
                 Copy Rendered HTML
                 </span>
@@ -168,7 +168,7 @@ let tmp_entry_obj: key_val = $state({});
                 >
                 <!-- class="btn btn-sm variant-soft-surface hover:variant-filled-warning transition py-1 px-2" -->
                 <!-- <Copy strokeWidth="1" /> -->
-                <Copy size="2em" />
+                <Copy size="1.25em" />
                 <span class="hidden md:inline">Clone</span>
             </button>
 
@@ -205,7 +205,7 @@ let tmp_entry_obj: key_val = $state({});
                 title="Copy the rich text (rendered HTML) content"
             >
                 <Copy size="1em" />
-                <TypeOutline size="2em" />
+                <TypeOutline size="1.25em" />
                 <span class="hidden">Copy Rich Text</span>
             </button>
 
@@ -270,17 +270,21 @@ let tmp_entry_obj: key_val = $state({});
         </header>
 
 
-
-
         {#if journals_journal_entry_obj.content}
             <div
                 class:hidden={journals_journal_entry_obj.hide}
                 class="
-                    journal__content w-full p-2 bg-white shadow-md rounded-lg text-wrap text-sm font-mono whitespace-pre-wrap
+                    journal__content
+                    w-full p-1
+                    bg-white shadow-lg rounded-lg
+                    border border-gray-200 dark:border-gray-700
+                    hover:border-gray-500 dark:hover:border-gray-500
+                    text-wrap text-sm font-mono whitespace-pre-wrap
+
                     {$journals_slct.journal_obj.cfg_json.entry_li_max_height ? `${$journals_slct.journal_obj.cfg_json.entry_li_max_height} overflow-scroll` : ''}
                     "
                 >
-            {@html journals_journal_entry_obj.content}
+                {@html journals_journal_entry_obj.content}
             </div>
 
             <!-- This needs to remain hidden for the copy function to work and us not seeing the rendered HTML version. -->

src/routes/journals/ae_comp__journal_obj_li.svelte

@@ -67,7 +67,7 @@ let { lq__journal_obj_li }: Props = $props();
 
         <section
             class="ae_section ae_footer ae_meta journal__meta mt-2 flex flex-col sm:flex-row gap-1 items-center justify-center text-sm text-gray-500"
-            class:hidden={!$ae_loc.administrator_access && !$ae_loc.edit_mode}
+            class:hidden={!$ae_loc.administrator_access || !$ae_loc.edit_mode}
             >
             <div class="ae_group">
                 {#if !journals_journal_obj.updated_on}