Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Got themes working again.

Browse Source
This commit is contained in:
Scott Idem
2025-04-30 17:30:06 -04:00
parent d7a1c03beb
commit 15cb0aa0c5
9 changed files with 238 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
src/routes/journals/[journal_id]/+layout.svelte
View File

@@ -84,6 +84,7 @@ async function handle_update_journal() {
type_code: $journals_slct.tmp_journal_obj.type_code,
passcode: $journals_slct.tmp_journal_obj.passcode,
passcode_timeout: $journals_slct.tmp_journal_obj.passcode_timeout,
auth_key: $journals_slct.tmp_journal_obj.auth_key, // The Journal Entry encryption password
cfg_json: $journals_slct.tmp_journal_obj.cfg_json
@@ -198,6 +199,7 @@ async function handle_update_journal() {
type_code: $lq__journal_obj?.type_code,
passcode: $lq__journal_obj?.passcode,
passcode_timeout: $lq__journal_obj?.passcode_timeout,
auth_key: $lq__journal_obj?.auth_key,
cfg_json: $lq__journal_obj?.cfg_json
};
$journals_sess.show__modal_edit__journal_obj = true;
@@ -329,62 +331,93 @@ 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">
<div class="modal-box mx-2 mb-10">
<!-- <h3 class="font-bold text-lg">Edit Journal</h3> -->
<div class="py-4">
<div class="py-4 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" />
</label>
<!-- Journal Description (Markdown) -->
<label class="text-sm text-gray-500 hidden sm:inline">
Journal Description:
<textarea
placeholder="Journal Description (Markdown format)"
bind:value={$journals_slct.tmp_journal_obj.description}
class="input input-bordered w-full mb-2 h-32 resize-none"
title="Description of the journal (supports Markdown)"
></textarea>
</label>
<input type="text" placeholder="Journal Type" bind:value={$journals_slct.tmp_journal_obj.type_code} class="input input-bordered w-full mb-2" />
<!-- input for passcode -->
<input type="text" placeholder="Passcode" bind:value={$journals_slct.tmp_journal_obj.passcode} class="input input-bordered w-full mb-2" />
<!-- input for passcode timeout -->
<input type="number" placeholder="Passcode Timeout" bind:value={$journals_slct.tmp_journal_obj.passcode_timeout} class="input input-bordered w-full mb-2" />
<div class="*:hover:inline">
<!-- input for passcode -->
<label
class="text-sm text-gray-500">
Passcode:
<input type="text" placeholder="Passcode" bind:value={$journals_slct.tmp_journal_obj.passcode} class="input input-bordered w-64 mb-2" />
</label>
<div class="text-xs text-gray-500 hidden md:inline">
<span class="text-red-500">*</span> This passcode is used to encrypt the Journal Entries.
</div>
<!-- input for passcode timeout -->
<label class="text-sm text-gray-500">
Passcode Timeout:
<input type="number" placeholder="Passcode Timeout" bind:value={$journals_slct.tmp_journal_obj.passcode_timeout} class="input input-bordered w-32 mb-2" />
</label>
</div>
<!-- input for auth_key -->
<label class="text-sm text-gray-500 sm:inline">
Auth Key:
<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 -->
<span class="text-sm text-gray-500 hidden sm:inline">
<div>
<span class="text-sm text-gray-500 sm:inline">
Journal Type:
</span>
<select
class="btn btn-sm
variant-ghost-surface
hover:variant-filled-surface
transition
text-xs
"
bind:value={$journals_slct.tmp_journal_obj.type_code}
onchange={(event) => {
// Update the cfg_json with the selected journal type. Example cate
$journals_slct.tmp_journal_obj.type_code = event.target.value;
console.log('Selected journal type:', $journals_slct.tmp_journal_obj.type_code);
}}
title="Select a journal type"
>
<option value="">Select Journal Type</option>
{#each $journals_loc.journal.type_code_li as journal_type}
<option value={journal_type.code}>{journal_type.name}</option>
{/each}
</select>
<select
class="btn btn-sm
variant-ghost-surface
hover:variant-filled-surface
transition
text-xs
"
bind:value={$journals_slct.tmp_journal_obj.type_code}
onchange={(event) => {
// Update the cfg_json with the selected journal type. Example cate
$journals_slct.tmp_journal_obj.type_code = event.target.value;
console.log('Selected journal type:', $journals_slct.tmp_journal_obj.type_code);
}}
title="Select a journal type"
>
<option value="">Select Journal Type</option>
{#each $journals_loc.journal.type_code_li as journal_type}
<option value={journal_type.code}>{journal_type.name}</option>
{/each}
</select>
</div>
<div>
<!-- inputs for customizable journal category list -->
<!-- each category has a code and name; need to be able to add and remove categories -->
<span class="text-sm text-gray-500 hidden sm:inline">
<div class="text-sm text-gray-500 hidden sm:inline">
Journal Categories:
</span>
<div class="flex flex-col gap-1">
</div>
<div class="flex flex-col gap-1 p-4">
{#each $journals_slct.tmp_journal_obj.cfg_json.category_li as category, index}
<div class="flex flex-row items-center gap-1">
<input type="text" placeholder="Category Code" bind:value={$journals_slct.tmp_journal_obj.cfg_json.category_li[index].code} class="input input-bordered w-full" />
<input type="text" placeholder="Category Code" bind:value={$journals_slct.tmp_journal_obj.cfg_json.category_li[index].code} class="input input-bordered w-48" />
<input type="text" placeholder="Category Name" bind:value={$journals_slct.tmp_journal_obj.cfg_json.category_li[index].name} class="input input-bordered w-full" />
<button
type="button"
@@ -405,7 +438,7 @@ async function handle_update_journal() {
$journals_slct.tmp_journal_obj.cfg_json.category_li.push({ code: '', name: '' });
$journals_slct.tmp_journal_obj.cfg_json.category_li = $journals_slct.tmp_journal_obj.cfg_json.category_li;
}}
class="btn btn-sm variant-ghost-success hover:variant-filled-success transition max-w-96"
class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary transition max-w-48 p-1"
>
<Plus />
Add Category
@@ -424,7 +457,7 @@ async function handle_update_journal() {
$journals_slct.tmp_journal_obj.cfg_json.entry_li_max_height = event.target.value;
console.log('Selected max height:', $journals_slct.tmp_journal_obj.cfg_json.entry_li_max_height);
}}
class="btn btn-sm variant-ghost-surface hover:variant-filled-surface transition text-xs w-full mb-2 max-w-96"
class="btn btn-sm variant-ghost-surface hover:variant-filled-surface transition text-xs w-full mb-2 max-w-48"
title="Select maximum height for journal entries in the list"
>
<option value="">Default (auto)</option>
@@ -451,7 +484,7 @@ async function handle_update_journal() {
$journals_slct.tmp_journal_obj.cfg_json.color_scheme = event.target.value;
console.log('Selected color scheme:', $journals_slct.tmp_journal_obj.cfg_json.color_scheme);
}}
class="btn btn-sm variant-ghost-surface hover:variant-filled-surface transition text-xs w-full mb-2 max-w-96"
class="btn btn-sm variant-ghost-surface hover:variant-filled-surface transition text-xs w-full mb-2 max-w-48"
title="Select color scheme for journal entries"
>
<option value="">Default (auto)</option>

4
src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte
View File

@@ -10,6 +10,7 @@ import {
Eye, EyeOff,
Flag, FlagOff, FileX, Fingerprint,
Globe, Group,
LockKeyholeOpen,
MessageSquareWarning, Minus,
NotebookPen, NotebookText, NotepadTextDashed,
Pencil, PenLine, Plus,
@@ -742,12 +743,15 @@ $effect(async () => {
title="Toggle private visibility of this journal entry"
>
{#if $lq__journal_entry_obj?.private && decrypted_content}
<LockKeyholeOpen strokeWidth="2.5" color="red" />
{:else if $lq__journal_entry_obj?.private && $ae_loc.edit_mode}
<Fingerprint strokeWidth="2.5" color="red" />
{:else if $lq__journal_entry_obj?.private}
<Fingerprint strokeWidth="2.5" color="green" />
{:else}
<Fingerprint strokeWidth="1" color="gray" />
{/if}
</button>
<button

23
src/routes/journals/ae_comp__journal_entry_obj_li.svelte
View File

@@ -100,7 +100,7 @@ $effect(() => {
</script>
<section class="journal_list flex flex-col gap-2 items-center justify-center w-full">
<section class="journal_list flex flex-col gap-1 md:gap-2 items-center justify-center w-full">
{#if $lq__journal_entry_obj_li && $lq__journal_entry_obj_li.length}
<!-- <div class="ae_group">
@@ -113,7 +113,19 @@ $effect(() => {
<div
class="container journal journal_entry_obj border border-1 p-2 mb-2 space-y-2 w-full max-w-screen-lg flex flex-col items-center justify-center bg-white rounded-lg"
class="
container journal journal_entry_obj
border border-1
px-2 py-1 space-y-1
w-full max-w-screen-lg
flex flex-col items-center justify-center
bg-white text-gray-900
dark:bg-gray-800 dark:text-gray-200
rounded-lg
hover:bg-gray-100
hover:border-gray-300
transition-all duration-500 ease-out
"
class:dim={!journals_journal_entry_obj.enable}
class:bg-warning-100={!journals_journal_entry_obj?.enable}
>
@@ -419,7 +431,7 @@ $effect(() => {
shadow-lg rounded-lg
border border-gray-200 dark:border-gray-700
text-wrap text-sm font-mono whitespace-pre-wrap
delay-1000 duration-300 hover:delay-500 hover:duration-300 transition-all hover:transition-all ease-in-out
delay-1000 duration-300 hover:delay-1000 hover:duration-300 transition-all hover:transition-all ease-out
hover:z-10 hover:h-auto hover:max-h-full
hover:bg-blue-100 hover:border-blue-500 dark:hover:border-blue-500
{$journals_slct.journal_obj.cfg_json.entry_li_max_height ? `${$journals_slct.journal_obj.cfg_json.entry_li_max_height} overflow-scroll` : ''}
@@ -465,7 +477,10 @@ $effect(() => {
{/if} -->
<!-- </div> -->
<section class="ae_section journal_entry__entry">
<section
class:hidden={!journals_journal_entry_obj?.original_datetime && !journals_journal_entry_obj?.original_timezone}
class="ae_section journal_entry__entry"
>
<!-- {#if journals_journal_entry_obj?.description}
<div
class="journal_entry__description ae_description"

7
src/routes/journals/ae_comp__journal_obj_id_view.svelte
View File

@@ -36,11 +36,12 @@ let { log_lvl = 0,
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">
<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}
@@ -56,6 +57,7 @@ let { log_lvl = 0,
<!-- 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
@@ -67,7 +69,7 @@ let { log_lvl = 0,
w-full max-w-screen-md
font-mono
text-gray-900
dark:bg-blue-900 dark:text-gray-100
dark:bg-blue-900/40 dark:text-gray-100
shadow-md rounded-lg
text-sm font-normal text-wrap word-break
@@ -76,6 +78,7 @@ let { log_lvl = 0,
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
"
>