fix: changed formatter
This commit is contained in:
parent
5aea6d3340
commit
0c17a572da
1 changed files with 14 additions and 10 deletions
|
@ -1,15 +1,17 @@
|
|||
<script lang="ts">
|
||||
import { enhance } from '$app/forms';
|
||||
import type { PageData } from './$types';
|
||||
|
||||
import { marked, type MarkedOptions } from 'marked';
|
||||
|
||||
import { enhance } from '$app/forms';
|
||||
import Button from '$lib/components/ui/Button.svelte';
|
||||
import Input from '$lib/components/ui/Input.svelte';
|
||||
import { page } from '$app/stores';
|
||||
|
||||
export let data: PageData;
|
||||
|
||||
$: puzzle = data.puzzle;
|
||||
$: chapterId = $page.params.chapterId;
|
||||
|
||||
const renderer = new marked.Renderer();
|
||||
|
||||
|
@ -21,30 +23,32 @@
|
|||
);
|
||||
};
|
||||
|
||||
renderer.br = () => {
|
||||
return '<br /><br />';
|
||||
};
|
||||
|
||||
renderer.codespan = (code) => {
|
||||
return `<code class="cursor-default select-none text-transparent transition-colors delay-150 hover:text-highlight-secondary">${code}</code>`;
|
||||
};
|
||||
|
||||
const options: MarkedOptions = {
|
||||
breaks: false,
|
||||
breaks: true,
|
||||
renderer,
|
||||
gfm: true
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="flex h-full w-full flex-col justify-between space-y-4">
|
||||
<div class="flex h-full w-full flex-col justify-between gap-4">
|
||||
<h1 class="text-2xl font-bold sm:text-3xl md:text-4xl">
|
||||
{puzzle.name}
|
||||
<span class="text-xl text-highlight-secondary">({puzzle.scoreMax} points)</span>
|
||||
</h1>
|
||||
<!-- <Separator /> -->
|
||||
<div class="h-screen w-full overflow-y-auto font-fira">
|
||||
<div class="h-screen w-full overflow-y-auto break-all font-fira text-xs sm:text-base">
|
||||
{@html marked(puzzle.content, options)}
|
||||
</div>
|
||||
{#if !puzzle.score}
|
||||
<!-- <InputForm {puzzle} /> -->
|
||||
<form
|
||||
class="flex w-full flex-col items-end justify-between gap-4 sm:flex-row"
|
||||
class="flex w-full flex-col items-end justify-between gap-2 sm:flex-row"
|
||||
method="POST"
|
||||
enctype="multipart/form-data"
|
||||
use:enhance
|
||||
|
@ -62,8 +66,8 @@
|
|||
<Button class="w-full sm:w-44" variant="brand">Valider</Button>
|
||||
</form>
|
||||
{:else}
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="items-center gap-2">
|
||||
<div class="flex items-center justify-between flex-col sm:flex-row gap-2">
|
||||
<div class="flex items-center gap-2">
|
||||
<p>
|
||||
Tentative{puzzle.tries && puzzle.tries > 1 ? 's' : ''} :{' '}
|
||||
<span class="text-brand-accent">{puzzle.tries}</span>
|
||||
|
@ -75,7 +79,7 @@
|
|||
<!-- <Button type="button" onClick={() => router.push(getURL(`/dashboard/puzzles`))}>
|
||||
Retour aux puzzles
|
||||
</Button> -->
|
||||
<Button href="/puzzles" class="w-full sm:w-44" variant="brand">Retour aux puzzles</Button>
|
||||
<Button href="/dashboard/chapters/{chapterId}" class="w-full sm:w-44" variant="brand">Retour aux puzzles</Button>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
|
Loading…
Add table
Reference in a new issue