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

Add responsive journal sidebar

Browse Source
This commit is contained in:
Scott Idem
2026-05-04 17:42:13 -04:00
parent 7fd8c976bf
commit c3a346cc9a
3 changed files with 66 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/routes/journals/ae_comp__journal_entry_editor.svelte
View File

@@ -65,6 +65,7 @@ const preferred_viewer = $derived((journal?.cfg_json?.pref_viewer ?? 'rendered')
{:else}
<div
class="prose dark:prose-invert w-full max-w-none overflow-x-auto rounded-lg border border-gray-200 bg-white p-4 shadow-lg dark:border-gray-700 dark:bg-gray-900">
<!-- The rendered HTML branch is intentionally trusted input from the journal editor pipeline. -->
{@html tmp_entry_obj?.content_md_html || ''}
</div>
{/if}
@@ -123,7 +124,7 @@ const preferred_viewer = $derived((journal?.cfg_json?.pref_viewer ?? 'rendered')
type="button"
onclick={on_save}
disabled={!has_changed}
class="btn btn-sm md:btn-md lg:btn-lg preset-filled-success fixed top-72 right-6 z-20 min-w-32 shadow-xl transition-all"
class="btn btn-sm md:btn-md lg:btn-lg preset-filled-success fixed top-72 right-6 z-20 hidden min-w-32 shadow-xl transition-all md:inline-flex"
class:hidden={!has_changed}>
<Save size="1.2em" class="mr-2" /> Save
</button>

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

@@ -18,8 +18,8 @@ let { entry }: Props = $props();
<section class="journal-metadata w-full space-y-4">
<!-- System Timestamps -->
<div
class="text-surface-500 flex flex-col items-center justify-between gap-2 px-1 text-xs sm:flex-row">
<div class="flex gap-4">
class="text-surface-500 flex flex-col gap-2 text-xs sm:flex-row sm:items-center sm:justify-between">
<div class="flex flex-col gap-1 sm:flex-row sm:flex-wrap sm:gap-4">
<span title="Creation date">
<span class="font-semibold">Created:</span>
{ae_util.iso_datetime_formatter(

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

@@ -19,8 +19,7 @@ import { ae_util } from '$lib/ae_utils/ae_utils';
import { ae_loc, ae_api } from '$lib/stores/ae_stores';
import {
journals_loc,
journals_sess,
journals_slct
journals_sess
} from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import { decrypt_journal_entry } from '$lib/ae_journals/ae_journals_decryption';
@@ -154,10 +153,6 @@ $effect(() => {
// 2. Auto-Save Debounce
$effect(() => {
// Track core properties
const _content = tmp_entry_obj.content;
const _private = tmp_entry_obj.private;
// Isolate logic from secondary dependencies
const should_save = untrack(
() => has_unsaved_changes && !is_processing && save_status !== 'saving'
@@ -429,10 +424,9 @@ let modal_mode: 'append' | 'prepend' | 'auto' = $state('auto');
group-hover/entry-view:opacity-15 dark:opacity-10 dark:group-hover/entry-view:opacity-20">
</div>
<section
class="ae_view relative flex h-full w-full min-w-0 flex-col gap-2 rounded-xl
border border-gray-200
bg-white p-2 shadow-xl
dark:border-gray-700 dark:bg-gray-900"
class="ae_view relative flex h-full w-full min-w-0 flex-col gap-4 rounded-xl
border border-surface-200-800
bg-surface-50-900 p-2 shadow-xl"
bind:clientHeight={$ae_loc.iframe_height_modal_body}>
{#if $lq__journal_entry_obj && $lq__journal_obj}
<AE_Comp_Journal_Entry_Header
@@ -447,11 +441,12 @@ let modal_mode: 'append' | 'prepend' | 'auto' = $state('auto');
{save_status}
{log_lvl} />
<div class="grid w-full min-w-0 gap-4 lg:grid-cols-[minmax(0,1fr)_20rem]">
<div class="min-w-0 space-y-4">
{#if decryption_error}
<div
class="bg-error-500/20 border-error-500 z-50 flex w-full animate-bounce items-center justify-between rounded-lg border-2 p-4 shadow-2xl">
<div
class="text-error-700 dark:text-error-300 flex items-center gap-4 font-bold">
class="bg-error-100 border-error-300 flex w-full animate-bounce items-center justify-between rounded-lg border p-4 shadow-xl">
<div class="text-error-700 flex items-center gap-4 font-bold">
<CircleAlert size="2.5em" />
<span class="text-xl">{decryption_error}</span>
</div>
@@ -466,10 +461,8 @@ let modal_mode: 'append' | 'prepend' | 'auto' = $state('auto');
<!-- ring-2 inset indicates "edit mode" in both light and dark without a background swap -->
<section
class="relative grow overflow-hidden rounded-lg border border-gray-200
bg-gray-50 p-1
shadow-md dark:border-gray-700 dark:bg-gray-800
w-full min-w-0 items-stretch
class="relative grow overflow-hidden rounded-xl border border-surface-200-800
bg-surface-100-900 p-2 shadow-md min-w-0
{$journals_loc.entry.edit_kv[
$lq__journal_entry_obj?.journal_entry_id
] == 'current'
@@ -499,8 +492,15 @@ let modal_mode: 'append' | 'prepend' | 'auto' = $state('auto');
link_to_type="journal_entry"
link_to_id={$lq__journal_entry_obj.journal_entry_id}
{lq__journal_entry_obj} />
</div>
<AE_Comp_Journal_Entry_Metadata entry={tmp_entry_obj as any} />
<aside class="min-w-0 space-y-4 lg:sticky lg:top-4 self-start">
<div
class="rounded-xl border border-surface-200-800 bg-surface-100-900 p-3 shadow-sm">
<AE_Comp_Journal_Entry_Metadata entry={$lq__journal_entry_obj} />
</div>
</aside>
</div>
<AE_Comp_Modal_Journal_Entry_Append
bind:open={show_append_modal}