mirror of
https://github.com/jzillmann/pdf-to-markdown.git
synced 2025-06-25 12:01:45 +02:00
Smoother messages display
This commit is contained in:
parent
1a02c41059
commit
dc11204bb1
@ -1,5 +1,6 @@
|
|||||||
<script>
|
<script>
|
||||||
import { slide } from 'svelte/transition';
|
import { slide, blur } from 'svelte/transition';
|
||||||
|
import { flip } from 'svelte/animate';
|
||||||
|
|
||||||
import type Debugger from '@core/Debugger';
|
import type Debugger from '@core/Debugger';
|
||||||
|
|
||||||
@ -39,11 +40,9 @@
|
|||||||
bind:pinnedPage />
|
bind:pinnedPage />
|
||||||
|
|
||||||
<!-- Stage Messages -->
|
<!-- Stage Messages -->
|
||||||
<ul
|
<ul class="messages list-disc list-inside mb-2 p-2 bg-blue-50 rounded shadow text-sm">
|
||||||
class="messages list-disc list-inside mb-2 p-2 bg-blue-50 rounded shadow text-sm"
|
{#each stageResult.messages as message (message)}
|
||||||
style="max-height:{stageResult.messages.length * 40}px">
|
<li animate:flip in:slide>{message}</li>
|
||||||
{#each stageResult.messages as message}
|
|
||||||
<li in:slide={{ delay: 200 }} out:slide>{message}</li>
|
|
||||||
{/each}
|
{/each}
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
@ -53,27 +52,27 @@
|
|||||||
{:else}
|
{:else}
|
||||||
<!-- No items visible -->
|
<!-- No items visible -->
|
||||||
<div class="flex space-x-1 items-center justify-center text-xl">
|
<div class="flex space-x-1 items-center justify-center text-xl">
|
||||||
<div>No visible changes from the transformation.</div>
|
<div in:blur={{ delay: 500 }}>No visible changes from the transformation.</div>
|
||||||
{#if supportsRelevanceFiltering && onlyRelevantItems}
|
{#if supportsRelevanceFiltering && onlyRelevantItems}
|
||||||
<div>Disabled the</div>
|
<div in:blur={{ delay: 900 }}>Disable the</div>
|
||||||
<div class="font-bold cursor-pointer hover:underline" on:click={() => (onlyRelevantItems = false)}>
|
<div
|
||||||
|
in:blur={{ delay: 950 }}
|
||||||
|
class="font-bold cursor-pointer hover:underline"
|
||||||
|
on:click={() => (onlyRelevantItems = false)}>
|
||||||
relevance filter
|
relevance filter
|
||||||
</div>
|
</div>
|
||||||
<div>?</div>
|
<div in:blur={{ delay: 990 }}>?</div>
|
||||||
{/if}
|
{/if}
|
||||||
{#if supportsGrouping && !groupingEnabled}
|
{#if supportsGrouping && !groupingEnabled}
|
||||||
<div>Enable</div>
|
<div in:blur={{ delay: 1000 }}>Enable</div>
|
||||||
<div class="font-bold cursor-pointer hover:underline" on:click={() => (groupingEnabled = true)}>
|
<div
|
||||||
|
in:blur={{ delay: 1050 }}
|
||||||
|
class="font-bold cursor-pointer hover:underline"
|
||||||
|
on:click={() => (groupingEnabled = true)}>
|
||||||
grouping
|
grouping
|
||||||
</div>
|
</div>
|
||||||
<div>?</div>
|
<div in:blur={{ delay: 1090 }}>?</div>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>
|
|
||||||
.messages {
|
|
||||||
transition: max-height 0.15s ease-in-out;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user