Working on update a lot of pages using the ae_loc hub section.

src/routes/journals/+layout.svelte

@@ -1,11 +1,15 @@
 <script lang="ts">
 /** @type {import('./$types').LayoutProps} */
-let { data, children } = $props();
 
-// Imports
+// *** Import Svelte specific
 import { browser } from '$app/environment';
 import { goto } from '$app/navigation';
 
+// *** Import other supporting libraries
+// import * as icons from '@lucide/svelte';
+import { House } from '@lucide/svelte';
+
+// *** Import Aether specific variables and functions
 import type { key_val } from '$lib/ae_stores';
 // import { ae_util } from '$lib/ae_utils/ae_utils';
 // import { api } from '$lib/api';
@@ -15,6 +19,13 @@ import { journals_loc, journals_slct, journals_trig } from '$lib/ae_journals/ae_
 
 // import Element_data_store from '$lib/element_data_store_v2.svelte';
 
+// *** Setup Svelte properties
+interface Props {
+    data: any;
+    children: any;
+}
+let { data, children }: Props = $props();
+
 $journals_loc.qry__enabled = 'enabled';
 $journals_loc.qry__hidden = 'not_hidden';
 $journals_loc.qry__limit = 15;
@@ -57,8 +68,14 @@ if (browser) {
 <!-- These are needed: h-full overflow-auto -->
 <div class="ae_journals">
 
-<nav class="submenu flex flex-row items-centr justify-center gap-1">
-    <a href="/" class="btn btn-sm variant-ghost-success hover:variant-filled-success">Home</a>
+<nav class="submenu flex flex-row items-center justify-center gap-1">
+    <a
+        href="/"
+        class="btn btn-sm variant-ghost-success hover:variant-filled-success"
+        >
+        <House />
+        Home
+    </a>
     <!-- <a href="/about" class="btn btn-sm">About</a> -->
     <!-- <a href="/settings" class="btn btn-sm">Settings</a> -->
     <button

src/routes/journals/[journal_id]/+layout.svelte

@@ -92,7 +92,8 @@ async function handle_update_journal() {
     class="
         ae_journals__journal
         container h-full mx-auto
-        flex flex-col gap-1
+        flex flex-col
+        gap-1
         py-1 px-2 pb-16
         items-center
         min-w-full
@@ -101,7 +102,16 @@ async function handle_update_journal() {
     >
 
 
-<div class="flex flex-row items-center justify-between w-full border-gray-200 border-y-2 py-2">
+<div
+    class="
+        flex flex-row flex-wrap
+        gap-1
+        items-center justify-between
+        border-gray-200 border-y-
+        w-full
+        py-2
+        "
+    >
     <a href="/journals"
         class="
             btn btn-sm

src/routes/journals/[journal_id]/+page.svelte

@@ -6,10 +6,9 @@ let log_lvl: number = 0;
 import { browser } from '$app/environment';
 import { goto } from '$app/navigation';
 
+// *** Import other supporting libraries
 // import * as icons from '@lucide/svelte';
 import { BookHeart, FilePlus } from '@lucide/svelte';
-
-// *** Import other supporting libraries
 import { Modal } from 'flowbite-svelte';
 import { liveQuery } from "dexie";
 

src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte

@@ -281,7 +281,7 @@ $effect(() => {
 </header>
 
     <div
-        class="flex flex-row gap-2 items-center justify-evenly w-full max-w-sm"
+        class="flex flex-row flex-wrap gap-1 items-center justify-evenly w-full max-w-sm"
         >
         <!-- Entry alert status -->
         <button
@@ -591,7 +591,7 @@ $effect(() => {
     {@html test_html}
 </div> -->
 
-<div class="ae_meta flex flex-row flex-wrap gap-2 items-center justify-between w-full">
+<div class="ae_meta flex flex-row flex-wrap gap-1 items-center justify-between w-full">
 <!-- {$lq__journal_entry_obj?.priority}
 {$lq__journal_entry_obj?.sort}
 {$lq__journal_entry_obj?.group}