Docker/AdventureLog
Docker/AdventureLog
1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-07-24 07:19:36 +02:00
Code Issues Releases Activity

feat(calendar): add markdown rendering for event descriptions in modal

Browse source
This commit is contained in:
Sean Morley 2025-06-19 11:53:24 -04:00
parent 6516bc56ef
commit 7a17e0e1d8
1 changed files with 10 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

13
frontend/src/routes/calendar/+page.svelte
View file

@ -18,9 +18,14 @@
import ClockIcon from '~icons/mdi/clock'; import ClockIcon from '~icons/mdi/clock';
import SearchIcon from '~icons/mdi/magnify'; import SearchIcon from '~icons/mdi/magnify';
import ClearIcon from '~icons/mdi/close'; import ClearIcon from '~icons/mdi/close';
import { marked } from 'marked'; // Import the markdown parser
export let data: PageData; export let data: PageData;
const renderMarkdown = (markdown: string) => {
return marked(markdown);
};
let adventures = data.props.adventures; let adventures = data.props.adventures;
let allDates = data.props.dates; let allDates = data.props.dates;
let filteredDates = [...allDates]; let filteredDates = [...allDates];
@ -402,9 +407,11 @@
<div class="card bg-base-200/50 border border-base-300/30"> <div class="card bg-base-200/50 border border-base-300/30">
<div class="card-body p-4"> <div class="card-body p-4">
<div class="font-semibold text-lg mb-3">{$t('adventures.description')}</div> <div class="font-semibold text-lg mb-3">{$t('adventures.description')}</div>
<p class="text-base-content/80 leading-relaxed"> <article
{selectedEvent.extendedProps.description} class="prose overflow-auto h-full max-w-full p-4 border border-base-300 rounded-lg mb-4 mt-4"
</p> >
{@html renderMarkdown(selectedEvent.extendedProps.description || '')}
</article>
</div> </div>
</div> </div>
{/if} {/if}