Files
OSIT-AE-App-Svelte/src/routes/journals/ae_comp__journal_obj_id_view.svelte
2025-04-30 17:30:06 -04:00

93 lines
2.7 KiB
Svelte

<script lang="ts">
// *** Import Svelte specific
// *** Import other supporting libraries
import {
BookPlus, BookOpenText
} from '@lucide/svelte';
// *** Import Aether specific variables and functions
import { ae_util } from '$lib/ae_utils/ae_utils';
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { journals_loc, journals_sess, journals_slct, journals_trig, journals_prom } from '$lib/ae_journals/ae_journals_stores';
// import { journals_func } from '$lib/ae_journals/ae_journals_functions';
interface Props {
log_lvl?: number;
lq__journal_obj: any;
lq__journal_entry_obj_li: any;
}
let { log_lvl = 0,
lq__journal_obj,
lq__journal_entry_obj_li
}: Props = $props();
// let ae_promises: key_val = {};
// let ae_tmp: key_val = {};
// let ae_trigger: any = null;
// let ae_triggers: key_val = {};
// Reminder: Styling is being done with Tailwind CSS, not Bootstrap.
</script>
<section class="
rounded-lg p-2 m-2 w-full
flex flex-col flex-wrap items-center justify-center
bg-{$lq__journal_obj?.cfg_json.color_scheme}-100
text-gray-900 dark:text-gray-900
"
bind:clientHeight={$ae_loc.iframe_height_modal_body}>
<header class="ae_header journal__header">
<h2 class="journal__name h3 text-center ">
<BookOpenText class="inline-block" />
{@html $lq__journal_obj?.name ?? 'Loading...'}
{#if $ae_loc.trusted_access && $ae_loc.edit_mode}
({$lq__journal_entry_obj_li?.length ?? '0'}&times;)
{/if}
{#await $journals_prom.load__journal_entry_obj_li}
<span class="fas fa-spinner fa-spin"></span>
{:then}
<!-- done -->
{/await}
</h2>
</header>
<!-- Show Journal description -->
<!-- class:bg-green-100={$lq__journal_obj?.cfg_json.color_scheme ?? 'green'} -->
<!-- prose-h1:text-gray-100 dark:prose-h1:text-gray-900 -->
<!-- <div> -->
{#if $lq__journal_obj?.description}
<div
class="
prose
space-y-1
m-4
p-2
w-full max-w-screen-md
font-mono
text-gray-900
dark:bg-blue-900/40 dark:text-gray-100
shadow-md rounded-lg
text-sm font-normal text-wrap word-break
prose-p:m-0 prose-p:p-0
prose-h1:underline prose-h1:decoration-double
prose-h2:underline
prose-h1:text-2xl prose-h2:text-xl prose-h3:text-lg
prose-h1:m-0 prose-h2:m-0 prose-h3:m-0 prose-h4:m-0 prose-h5:m-0 prose-h6:m-0
prose-li:m-0 prose-li:p-0 prose-li:line-height-none
"
>
{@html $lq__journal_obj.description_md_html}
</div>
{/if}
<!-- </div> -->
</section>