Custom Example.svelte needs an extra line at the top

[shinokada]

I created src/lib/Example.svelte as you suggested in the README.

<script>
    // the source of the example is provided as a prop if you want it
    export let src;
</script>

<div
    class="container flex flex-wrap justify-center rounded-xl py-8 mx-auto bg-gradient-to-r bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 p-2 sm:p-6"
>
    <slot name="example" />
</div>

<div class="code">
    <pre class="language-svelte">
        <slot name="code" />
    </pre>
</div>

However if I don't add an extra empty line, it messes up the code as you see in the following image.

If I add an extra line there is too much space.

[Tropix126]

To fix this, ensure that your Example.svelte has no whitespace between your <pre> tags and slots

<pre><slot name="code" /></pre>

Unsure if this is intentional or not.

[mattjennings]

Yeah my bad, the Example in the README mistakenly had whitespace around the pre tag. I've updated it now. Sorry about that!

[shinokada]

Thanks. It fixed. It might be a good idea to mention about it.