cfp/nextup
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: use SVG for arrow

Browse Source
This commit is contained in:
Jannik
2025-12-01 21:01:11 +01:00
parent 7d00d1b314
commit 00dae2ba6b
1 changed files with 79 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
web/src/routes/display/+page.svelte
View File

@ -56,7 +56,23 @@
class="fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 text-9xl font-bold bg-background text-foreground p-4 rounded-md flex flex-col gap-10"
>
{#each newCalls as call (call.num)}
<span class="mx-4">{call.num} &rarr; {call.ticket.room}</span>
<span class="mx-4">
{call.num}
<svg
xmlns="http://www.w3.org/2000/svg"
width="48"
height="48"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="lucide lucide-arrow-right-icon lucide-arrow-right"
><path d="M5 12h14" /><path d="m12 5 7 7-7 7" /></svg
>
{call.ticket.room}
</span>
{/each}
</div>
</div>
@ -67,14 +83,42 @@
<table class="self-start">
<tbody>
<tr>
<th class="pr-4 font-bold">Wartenr.</th>
<th class="pr-4 font-bold">&rarr;</th>
<th class="pr-4 font-bold">Warte Nr.</th>
<th class="pr-4 font-bold">
<svg
xmlns="http://www.w3.org/2000/svg"
width="48"
height="48"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="lucide lucide-arrow-right-icon lucide-arrow-right"
><path d="M5 12h14" /><path d="m12 5 7 7-7 7" /></svg
>
</th>
<th class="pr-4 font-bold">Raum</th>
</tr>
{#each calls.slice(0, ENTRIES_PER_TABLE) as call (call.num)}
<tr>
<td class="call">{call.num}</td>
<td class="call">&rarr;</td>
<td class="call">
<svg
xmlns="http://www.w3.org/2000/svg"
width="48"
height="48"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="lucide lucide-arrow-right-icon lucide-arrow-right"
><path d="M5 12h14" /><path d="m12 5 7 7-7 7" /></svg
>
</td>
<td class="call"
>{call.ticket.status === "no-show"
? "Empfang " + ENTRIES[call.num[0]]
@ -96,14 +140,42 @@
<table class="self-start">
<tbody>
<tr>
<th class="pr-4 font-bold">Wartenr.</th>
<th class="pr-4 font-bold">&rarr;</th>
<th class="pr-4 font-bold">Warte Nr.</th>
<th class="pr-4 font-bold">
<svg
xmlns="http://www.w3.org/2000/svg"
width="48"
height="48"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="lucide lucide-arrow-right-icon lucide-arrow-right"
><path d="M5 12h14" /><path d="m12 5 7 7-7 7" /></svg
>
</th>
<th class="pr-4 font-bold">Raum</th>
</tr>
{#each calls.slice(ENTRIES_PER_TABLE) as call (call.num)}
<tr>
<td class="call">{call.num}</td>
<td class="call">&rarr;</td>
<td class="call">
<svg
xmlns="http://www.w3.org/2000/svg"
width="48"
height="48"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="lucide lucide-arrow-right-icon lucide-arrow-right"
><path d="M5 12h14" /><path d="m12 5 7 7-7 7" /></svg
>
</td>
<td class="call"
>{call.ticket.status === "no-show"
? "Empfang " + ENTRIES[call.num[0]]