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

Refine journal description editor layout

Browse Source
This commit is contained in:
Scott Idem
2026-05-05 14:36:01 -04:00
parent 1c20038a55
commit 07dd213cfd
2 changed files with 31 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/routes/journals/ae_comp__journal_obj_id_edit.svelte
View File

@@ -270,7 +270,7 @@ async function delete_journal() {
<div class="animate-in fade-in space-y-6 duration-300"> <div class="animate-in fade-in space-y-6 duration-300">
<!-- Core Meta --> <!-- Core Meta -->
<section class="grid grid-cols-1 gap-4 p-2"> <section class="grid grid-cols-1 gap-4 p-2">
<label class="label"> <label class="label flex flex-col items-start gap-1">
<span class="text-sm font-bold opacity-70" <span class="text-sm font-bold opacity-70"
>Journal Name</span> >Journal Name</span>
<input <input
@@ -279,17 +279,28 @@ async function delete_journal() {
class="input" class="input"
placeholder="e.g. Personal Log" /> placeholder="e.g. Personal Log" />
</label> </label>
<label class="label"> <label class="label flex flex-col items-start gap-1">
<span class="text-sm font-bold opacity-70" <span class="text-sm font-bold opacity-70"
>Description (Markdown)</span> >Description (Markdown)</span>
<textarea <div class="w-full">
bind:value={tmp__journal_obj.description} {#if tmp__journal_obj?.cfg_json?.pref_editor === 'codemirror'}
class="textarea h-32" <AE_Comp_Editor_CodeMirror
placeholder="Describe the purpose of this journal..." bind:content={tmp__journal_obj.description}
></textarea> language="markdown"
theme_mode={$ae_loc.theme_mode}
placeholder="Describe the purpose of this journal..."
class_li="rounded-lg border border-surface-500/20" />
{:else}
<textarea
bind:value={tmp__journal_obj.description}
class="textarea h-32"
placeholder="Describe the purpose of this journal..."
></textarea>
{/if}
</div>
</label> </label>
<div class="grid grid-cols-2 gap-4"> <div class="grid grid-cols-2 gap-4">
<label class="label"> <label class="label flex flex-col items-start gap-1">
<span class="text-sm font-bold opacity-70" <span class="text-sm font-bold opacity-70"
>Type</span> >Type</span>
<select <select
@@ -301,7 +312,7 @@ async function delete_journal() {
{/each} {/each}
</select> </select>
</label> </label>
<label class="label"> <label class="label flex flex-col items-start gap-1">
<span class="text-sm font-bold opacity-70" <span class="text-sm font-bold opacity-70"
>Journal Group (text)</span> >Journal Group (text)</span>
<input <input

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

@@ -211,15 +211,17 @@ async function handle_new_entry() {
<div <div
class="flex grow flex-row flex-wrap items-center justify-end gap-2"> class="flex grow flex-row flex-wrap items-center justify-end gap-2">
<!-- Simplified Config Trigger --> <!-- Simplified Config Trigger -->
<button {#if $ae_loc.edit_mode}
type="button" <button
onclick={() => type="button"
($journals_sess.show__modal_edit__journal_obj = true)} onclick={() =>
class="btn preset-tonal-secondary px-3 py-1 shadow-md" ($journals_sess.show__modal_edit__journal_obj = true)}
title="Journal Config & Actions"> class="btn preset-tonal-secondary px-3 py-1 shadow-md"
<Settings size="1.2em" class="mr-2" /> title="Journal Config & Actions">
<span class="hidden md:inline">Config</span> <Settings size="1.2em" class="mr-2" />
</button> <span class="hidden md:inline">Config</span>
</button>
{/if}
<!-- Passcode Verification (Condensed) --> <!-- Passcode Verification (Condensed) -->
{#if !$journals_sess?.journal_kv[$lq__journal_obj?.id]?.journal_passcode_verified} {#if !$journals_sess?.journal_kv[$lq__journal_obj?.id]?.journal_passcode_verified}
@@ -235,31 +237,6 @@ async function handle_new_entry() {
</div> </div>
</header> </header>
<!-- Show Journal description -->
{#if $lq__journal_obj?.description && $ae_loc.edit_mode}
<div
class="
prose
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
w-full max-w-(--breakpoint-sm)
space-y-1
rounded-lg bg-gray-50 p-2
font-mono text-sm font-normal text-wrap text-gray-900 shadow-md
md:max-w-(--breakpoint-md) dark:bg-gray-800 dark:text-gray-100
">
{@html $lq__journal_obj.description_md_html}
</div>
{/if}
</section> </section>
</div> </div>