Fix: Phosphor Printer-Icon in Druck-Buttons
This commit is contained in:
parent
683c645f85
commit
90973ca5af
2 changed files with 16 additions and 2 deletions
|
|
@ -1,6 +1,7 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { pb } from '$lib/pb';
|
import { pb } from '$lib/pb';
|
||||||
import { onMount } from 'svelte';
|
import { onMount } from 'svelte';
|
||||||
|
import iconPrinter from '$lib/assets/icons/printer.svg';
|
||||||
|
|
||||||
const STATUS_LABEL: Record<string, string> = { ok: 'OK', abweichung: 'Abweichung', kritisch: 'Kritisch' };
|
const STATUS_LABEL: Record<string, string> = { ok: 'OK', abweichung: 'Abweichung', kritisch: 'Kritisch' };
|
||||||
const STATUS_COLOR: Record<string, string> = { ok: '#16a34a', abweichung: '#ea580c', kritisch: '#dc2626' };
|
const STATUS_COLOR: Record<string, string> = { ok: '#16a34a', abweichung: '#ea580c', kritisch: '#dc2626' };
|
||||||
|
|
@ -77,7 +78,9 @@
|
||||||
<option value={y}>{y}</option>
|
<option value={y}>{y}</option>
|
||||||
{/each}
|
{/each}
|
||||||
</select>
|
</select>
|
||||||
<button class="btn-print" onclick={() => window.print()}>🖨 Drucken / PDF</button>
|
<button class="btn-print" onclick={() => window.print()}>
|
||||||
|
<img src={iconPrinter} alt="" class="btn-icon" /> Drucken / PDF
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -177,6 +180,7 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
.btn-print:hover { background: #1a2640; }
|
.btn-print:hover { background: #1a2640; }
|
||||||
|
.btn-icon { width: 16px; height: 16px; vertical-align: middle; margin-right: 0.25rem; filter: brightness(0) invert(1); }
|
||||||
.hint { color: #aaa; }
|
.hint { color: #aaa; }
|
||||||
.empty-print { display: none; }
|
.empty-print { display: none; }
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,6 +2,7 @@
|
||||||
import { pb } from '$lib/pb';
|
import { pb } from '$lib/pb';
|
||||||
import { onMount } from 'svelte';
|
import { onMount } from 'svelte';
|
||||||
import QRCode from 'qrcode';
|
import QRCode from 'qrcode';
|
||||||
|
import iconPrinter from '$lib/assets/icons/printer.svg';
|
||||||
|
|
||||||
const TYPE_LABEL: Record<string, string> = {
|
const TYPE_LABEL: Record<string, string> = {
|
||||||
kuehlschrank: 'Kühlschrank',
|
kuehlschrank: 'Kühlschrank',
|
||||||
|
|
@ -94,7 +95,9 @@
|
||||||
<p class="hint-text">QR-Codes ausdrucken und an den Stationen befestigen.</p>
|
<p class="hint-text">QR-Codes ausdrucken und an den Stationen befestigen.</p>
|
||||||
</div>
|
</div>
|
||||||
{#if stations.length > 0}
|
{#if stations.length > 0}
|
||||||
<button class="btn-print" onclick={printAll}>🖨 Alle drucken</button>
|
<button class="btn-print" onclick={printAll}>
|
||||||
|
<img src={iconPrinter} alt="" class="btn-icon" /> Alle drucken
|
||||||
|
</button>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -165,6 +168,13 @@
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
.btn-print:hover { background: #1a2640; }
|
.btn-print:hover { background: #1a2640; }
|
||||||
|
.btn-icon {
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin-right: 0.25rem;
|
||||||
|
filter: brightness(0) invert(1);
|
||||||
|
}
|
||||||
|
|
||||||
.list { display: flex; flex-direction: column; gap: 1rem; }
|
.list { display: flex; flex-direction: column; gap: 1rem; }
|
||||||
.card {
|
.card {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue