refac: changelog styling

This commit is contained in:
Timothy Jaeryang Baek 2025-09-10 14:50:10 +04:00
parent 6ddbb41aac
commit d3d7b209b2
1 changed files with 9 additions and 10 deletions

View File

@ -1,4 +1,6 @@
<script lang="ts">
import DOMPurify from 'dompurify';
import { onMount, getContext } from 'svelte';
import { Confetti } from 'svelte-confetti';
@ -23,7 +25,7 @@
});
</script>
<Modal bind:show size="lg">
<Modal bind:show size="xl">
<div class="px-5 pt-4 dark:text-gray-300 text-gray-700">
<div class="flex justify-between items-start">
<div class="text-xl font-semibold">
@ -54,7 +56,7 @@
</div>
<div class=" w-full p-4 px-5 text-gray-700 dark:text-gray-100">
<div class=" overflow-y-scroll max-h-96 scrollbar-hidden">
<div class=" overflow-y-scroll max-h-[32rem] scrollbar-hidden">
<div class="mb-3">
{#if changelog}
{#each Object.keys(changelog) as version}
@ -66,7 +68,7 @@
<hr class="border-gray-100 dark:border-gray-850 my-2" />
{#each Object.keys(changelog[version]).filter((section) => section !== 'date') as section}
<div class="">
<div class="w-full">
<div
class="font-semibold uppercase text-xs {section === 'added'
? 'text-white bg-blue-600'
@ -81,13 +83,10 @@
{section}
</div>
<div class="my-2.5 px-1.5">
{#each Object.keys(changelog[version][section]) as item}
<div class="text-sm mb-2">
<div class="font-semibold uppercase">
{changelog[version][section][item].title}
</div>
<div class="mb-2 mt-1">{changelog[version][section][item].content}</div>
<div class="my-2.5 px-1.5 markdown-prose-sm !list-none !w-full !max-w-none">
{#each changelog[version][section] as entry}
<div class="my-2">
{@html DOMPurify.sanitize(entry?.raw)}
</div>
{/each}
</div>