From 372cafeb014438d1d457477a0d1911c1affbfe84 Mon Sep 17 00:00:00 2001
From: Scott Idem <stidem@gmail.com>
Date: Wed, 14 May 2025 18:02:24 -0400
Subject: [PATCH] Now with extra save buttons

---
 .../journals/[journal_id]/+layout.svelte      | 548 +++++++++---------
 .../ae_comp__journal_entry_obj_id_view.svelte |  25 +
 2 files changed, 311 insertions(+), 262 deletions(-)

diff --git a/src/routes/journals/[journal_id]/+layout.svelte b/src/routes/journals/[journal_id]/+layout.svelte
index 70401b4d..18a94fd5 100644
--- a/src/routes/journals/[journal_id]/+layout.svelte
+++ b/src/routes/journals/[journal_id]/+layout.svelte
@@ -384,9 +384,9 @@ async function handle_update_journal() {
     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 mx-2 mb-10">
+        <div class="modal-box mx-2 mb-14 space-y-4">
             <!-- <h3 class="font-bold text-lg">Edit Journal</h3> -->
-            <div class="py-4 mb-2">
+            <div class="py-2 mb-2">
                 <label class="text-sm text-gray-500 hidden sm:inline">
                     Journal Name:
                 <input type="text" placeholder="Journal Name" bind:value={$journals_slct.tmp_journal_obj.name} class="input input-bordered w-full mb-2" />
@@ -403,8 +403,6 @@ async function handle_update_journal() {
                     ></textarea>
                 </label>
 
-
-
                 <div class="*:hover:inline">
                     <!-- input for passcode -->
                     <label
@@ -429,16 +427,16 @@ async function handle_update_journal() {
                     <input type="text" placeholder="Auth Key" bind:value={$journals_slct.tmp_journal_obj.auth_key} class="input input-bordered w-64 mb-2" />
                 </label>
 
-
                 <label class="text-sm text-gray-500">
                     Journal Type:
                 <input type="text" placeholder="Journal Type" bind:value={$journals_slct.tmp_journal_obj.type_code} class="input input-bordered w-48 mb-2" />
                 </label>
+
                 <!-- select option for journal type_code -->
                 <div>
-                <span class="text-sm text-gray-500 sm:inline">
-                    Journal Type:
-                </span>
+                    <span class="text-sm text-gray-500 sm:inline">
+                        Journal Type:
+                    </span>
                     <select
                         class="btn btn-sm
                         variant-ghost-surface
@@ -461,7 +459,7 @@ async function handle_update_journal() {
                     </select>
                 </div>
 
-                <div>
+                <div class="flex flex-row gap-1 items-center judify-start">
                     <!-- inputs for customizable journal category list -->
                     <!-- each category has a code and name; need to be able to add and remove categories -->
                     <div class="text-sm text-gray-500 hidden sm:inline">
@@ -500,7 +498,7 @@ async function handle_update_journal() {
                 </div>
 
                 <!-- Select max height options (Tailwind CSS) -->
-                <div>
+                <div class="flex flex-row gap-1 items-center judify-start">
                     <span class="text-sm text-gray-500 hidden sm:inline">
                         Journal Entry List Max Height:
                     </span>
@@ -525,7 +523,7 @@ async function handle_update_journal() {
                 </div>
 
                 <!-- Select hover max height options (Tailwind CSS) -->
-                <div>
+                <div class="flex flex-row gap-1 items-center judify-start">
                     <span class="text-sm text-gray-500 hidden sm:inline">
                         Journal Entry List Hover Max Height:
                     </span>
@@ -552,7 +550,7 @@ async function handle_update_journal() {
                 <!-- Select color scheme for the journal entries -->
                 <!-- Should select from the common Tailwind CSS options. Examples: slate, blue, gray, green, orange, red, yellow, etc. -->
                 <!-- Saves to cfg_json.color_scheme -->
-                <div>
+                <div class="flex flex-row gap-1 items-center judify-start">
                     <span class="text-sm text-gray-500 hidden sm:inline">
                         Color Scheme:
                     </span>
@@ -577,292 +575,306 @@ async function handle_update_journal() {
                 </div>
 
                 <!-- Toggles for automatically hiding Entries marked as either: private, personal, or professional  -->
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_private = !$journals_slct.tmp_journal_obj.cfg_json.hide_private;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of private entries"
-                    >
-                    {#if $journals_slct.tmp_journal_obj.cfg_json.hide_private}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <Fingerprint strokeWidth="1" color="gray" class="mx-1" />
-                        <span class="hidden">
-                            Hiding
-                        </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <Fingerprint strokeWidth="2.5" color="green" class="mx-1" />
-                        <span class="hidden">
-                            Showing
-                        </span>
-                    {/if}
-                    <span class="hidden">
-                        Private Entries
-                    </span>
-                </button>
+                <div class="flex flex-row gap-1 items-center judify-start">
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_personal = !$journals_slct.tmp_journal_obj.cfg_json.hide_personal;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of personal entries"
-                    >
-                    {#if $journals_slct.tmp_journal_obj.cfg_json.hide_personal}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <BookHeart strokeWidth="1" color="gray" />
-                        <span class="hidden">
-                            Hiding
-                        </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <BookHeart strokeWidth="2.5" color="green" />
-                        <span class="hidden">
-                            Showing
-                        </span>
-                    {/if}
-                    <span class="hidden">
-                        Personal Entries
+                    <span class="text-sm text-gray-500 hidden sm:inline">
+                        Journal Entry Visibility:
                     </span>
-                </button>
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_professional = !$journals_slct.tmp_journal_obj.cfg_json.hide_professional;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of professional entries"
-                    >
-                    {#if $journals_slct.tmp_journal_obj.cfg_json.hide_professional}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <BriefcaseBusiness strokeWidth="1" color="gray" />
+                    <span class="flex flex-row gap-1 items-center justify-center">
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_private = !$journals_slct.tmp_journal_obj.cfg_json.hide_private;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of private entries"
+                        >
+                        {#if $journals_slct.tmp_journal_obj.cfg_json.hide_private}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <Fingerprint strokeWidth="1" color="gray" class="mx-1" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <Fingerprint strokeWidth="2.5" color="green" class="mx-1" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Hiding
+                            Private Entries
                         </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <BriefcaseBusiness strokeWidth="2.5" color="green" />
+                    </button>
+
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_personal = !$journals_slct.tmp_journal_obj.cfg_json.hide_personal;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of personal entries"
+                        >
+                        {#if $journals_slct.tmp_journal_obj.cfg_json.hide_personal}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <BookHeart strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <BookHeart strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Showing
+                            Personal Entries
                         </span>
-                    {/if}
-                    <span class="hidden">
-                        Professional Entries
+                    </button>
+
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_professional = !$journals_slct.tmp_journal_obj.cfg_json.hide_professional;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of professional entries"
+                        >
+                        {#if $journals_slct.tmp_journal_obj.cfg_json.hide_professional}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <BriefcaseBusiness strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <BriefcaseBusiness strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
+                        <span class="hidden">
+                            Professional Entries
+                        </span>
+                    </button>
                     </span>
-                </button>
+                </div>
 
 
                 <!-- Toggle buttons for showing/hiding various Journal Entry page view buttons: alert, alert message, private, public, personal, professional, template -->
-                <div class="flex flox-row gap-1">
+                <div class="flex flox-row gap-1 items-center judify-start">
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_btn_alert = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_alert;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of alert icon button(s) on Journal Entry view page"
-                    >
-                    {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_alert}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <Siren strokeWidth="1" color="gray" />
-                        <span class="hidden">
-                            Hiding
-                        </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <Siren strokeWidth="2.5" color="green" />
-                        <span class="hidden">
-                            Showing
-                        </span>
-                    {/if}
-                    <span class="hidden">
-                        Alert Button
+                    <span class="text-sm text-gray-500 hidden sm:inline">
+                        Journal Entry View Buttons:
                     </span>
-                </button>
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_btn_alert_msg = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_alert_msg;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of alert message icon button(s) on Journal Entry view page"
-                    >
-                    {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_alert_msg}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <MessageSquareWarning strokeWidth="1" color="gray" />
+                    <span class="flex flex-row gap-1 items-center justify-center">
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_btn_alert = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_alert;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of alert icon button(s) on Journal Entry view page"
+                        >
+                        {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_alert}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <Siren strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <Siren strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Hiding
+                            Alert Button
                         </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <MessageSquareWarning strokeWidth="2.5" color="green" />
-                        <span class="hidden">
-                            Showing
-                        </span>
-                    {/if}
-                    <span class="hidden">
-                        Alert Message Button
-                    </span>
-                </button>
+                    </button>
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_btn_private = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_private;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of private icon button(s) on Journal Entry view page"
-                    >
-                    {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_private}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <Fingerprint strokeWidth="1" color="gray" />
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_btn_alert_msg = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_alert_msg;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of alert message icon button(s) on Journal Entry view page"
+                        >
+                        {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_alert_msg}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <MessageSquareWarning strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <MessageSquareWarning strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Hiding
+                            Alert Message Button
                         </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <Fingerprint strokeWidth="2.5" color="green" />
-                        <span class="hidden">
-                            Showing
-                        </span>
-                    {/if}
-                    <span class="hidden">
-                        Private Button
-                    </span>
-                </button>
+                    </button>
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_btn_public = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_public;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of public icon button(s) on Journal Entry view page"
-                    >
-                    {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_public}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <EyeOff strokeWidth="1" color="gray" />
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_btn_private = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_private;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of private icon button(s) on Journal Entry view page"
+                        >
+                        {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_private}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <Fingerprint strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <Fingerprint strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Hiding
+                            Private Button
                         </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <Eye strokeWidth="2.5" color="green" />
-                        <span class="hidden">
-                            Showing
-                        </span>
-                    {/if}
-                    <span class="hidden">
-                        Public Button
-                    </span>
-                </button>
+                    </button>
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_btn_personal = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_personal;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of personal icon button(s) on Journal Entry view page"
-                    >
-                    {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_personal}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <BookHeart strokeWidth="1" color="gray" />
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_btn_public = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_public;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of public icon button(s) on Journal Entry view page"
+                        >
+                        {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_public}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <EyeOff strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <Eye strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Hiding
+                            Public Button
                         </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <BookHeart strokeWidth="2.5" color="green" />
-                        <span class="hidden">
-                            Showing
-                        </span>
-                    {/if}
-                    <span class="hidden">
-                        Personal Button
-                    </span>
-                </button>
+                    </button>
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_btn_professional = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_professional;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of professional icon button(s) on Journal Entry view page"
-                    >
-                    {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_professional}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <BriefcaseBusiness strokeWidth="1" color="gray" />
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_btn_personal = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_personal;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of personal icon button(s) on Journal Entry view page"
+                        >
+                        {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_personal}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <BookHeart strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <BookHeart strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Hiding
+                            Personal Button
                         </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <BriefcaseBusiness strokeWidth="2.5" color="green" />
-                        <span class="hidden">
-                            Showing
-                        </span>
-                    {/if}
-                    <span class="hidden">
-                        Professional Button
-                    </span>
-                </button>
+                    </button>
 
-                <button
-                    type="button"
-                    onclick={() => {
-                        $journals_slct.tmp_journal_obj.cfg_json.hide_btn_template = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_template;
-                    }}
-                    class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
-                    title="Toggle visibility of template icon button(s) on Journal Entry view page"
-                    >
-                    {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_template}
-                        <!-- <EyeOff strokeWidth="1" color="red" /> -->
-                        <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
-                        <FilePlus strokeWidth="1" color="gray" />
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_btn_professional = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_professional;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of professional icon button(s) on Journal Entry view page"
+                        >
+                        {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_professional}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <BriefcaseBusiness strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <BriefcaseBusiness strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Hiding
+                            Professional Button
                         </span>
-                    {:else}
-                        <!-- <Eye strokeWidth="2.5" color="green" /> -->
-                        <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
-                        <FilePlus strokeWidth="2.5" color="green" />
+                    </button>
+
+                    <button
+                        type="button"
+                        onclick={() => {
+                            $journals_slct.tmp_journal_obj.cfg_json.hide_btn_template = !$journals_slct.tmp_journal_obj.cfg_json.hide_btn_template;
+                        }}
+                        class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition *:hover:inline"
+                        title="Toggle visibility of template icon button(s) on Journal Entry view page"
+                        >
+                        {#if $journals_slct?.tmp_journal_obj?.cfg_json.hide_btn_template}
+                            <!-- <EyeOff strokeWidth="1" color="red" /> -->
+                            <ToggleLeft strokeWidth="1" color="red" class="mx-1" />
+                            <FilePlus strokeWidth="1" color="gray" />
+                            <span class="hidden">
+                                Hiding
+                            </span>
+                        {:else}
+                            <!-- <Eye strokeWidth="2.5" color="green" /> -->
+                            <ToggleRight strokeWidth="2.5" color="green" class="mx-1" />
+                            <FilePlus strokeWidth="2.5" color="green" />
+                            <span class="hidden">
+                                Showing
+                            </span>
+                        {/if}
                         <span class="hidden">
-                            Showing
+                            Template Button
                         </span>
-                    {/if}
-                    <span class="hidden">
-                        Template Button
+                    </button>
                     </span>
-                </button>
                 </div>
 
-
                 <!-- JSON configuration editor for advanced users -->
                 <!-- textarea for json_cfg editing -->
             </div>
@@ -1089,7 +1101,19 @@ async function handle_update_journal() {
                     <X />
                     Cancel
                 </button>
+
+
             </div>
+
+            <button
+                type="button"
+                onclick={handle_update_journal}
+                class="btn variant-ghost-warning hover:variant-filled-warning transition absolute top-0 right-16 m-2"
+                title="Save changes to this journal"
+                >
+                <Check />
+                Update
+            </button>
         </div>
     </div>
 </Modal>
diff --git a/src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte b/src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte
index 313e5e54..1ffd4eb0 100644
--- a/src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte
+++ b/src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte
@@ -828,6 +828,7 @@ function handle_marked(text_string: string) {
         svelte_component ae_section ae_view journal_entry_obj view__journal_entry_obj bg-white
         flex flex-col flex-grow items-center justify-start
         w-full h-full p-2 m-2 space-y-2
+
         "
         bind:clientHeight={$ae_loc.iframe_height_modal_body}
         >
@@ -1909,6 +1910,7 @@ tabindex={$ae_loc.edit_mode ? 0 : -1} -->
         flex flex-col flex-wrap items-center justify-center
         h-full min-h-max max-h-full
         w-full max-w-6xl
+        relative
         "
     >
 {#if (!$journals_loc.entry.edit_kv[$lq__journal_entry_obj?.journal_entry_id])}
@@ -2117,6 +2119,29 @@ tabindex={$ae_loc.edit_mode ? 0 : -1} -->
         Updated obj? {updated_obj} -->
 
         <!-- && $lq__journal_entry_obj?.updated_on !== orig_entry_obj?.updated_on -->
+
+        <!-- Using absolute or fixed position -->
+        <button
+            type="button"
+            onclick={() => {
+                update_journal_entry();
+            }}
+            disabled={!tmp_entry_obj_changed}
+            class:hidden={!tmp_entry_obj_changed}
+            class:variant-filled-error={tmp_entry_obj_changed}
+            class="
+                btn btn-sm md:btn-md lg:btn-lg
+                min-w-24 w-full lg:min-w-32
+                max-w-40
+                variant-ghost-surface
+                hover:variant-outline-success
+                hover:variant-filled-success
+                fixed top-96 md:top-72 right-6
+                "
+            >
+            Save Changes?
+        </button>
+
     <!-- </div> -->
 
     {/if}