31 lines
702 B
Svelte
31 lines
702 B
Svelte
|
<script lang="ts">
|
||
|
|
type Props = {
|
||
|
|
prepTimeMin: number | null;
|
||
|
|
cookTimeMin: number | null;
|
||
|
|
totalTimeMin: number | null;
|
||
|
|
};
|
||
|
|
|
||
|
|
let { prepTimeMin, cookTimeMin, totalTimeMin }: Props = $props();
|
||
|
|
|
||
|
|
const summary = $derived.by(() => {
|
||
|
|
const parts: string[] = [];
|
||
|
|
if (prepTimeMin) parts.push(`Vorb. ${prepTimeMin} min`);
|
||
|
|
if (cookTimeMin) parts.push(`Kochen ${cookTimeMin} min`);
|
||
|
|
if (!prepTimeMin && !cookTimeMin && totalTimeMin)
|
||
|
|
parts.push(`Gesamt ${totalTimeMin} min`);
|
||
|
|
return parts.join(' · ');
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
{#if summary}
|
||
|
|
<p class="times">{summary}</p>
|
||
|
|
{/if}
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.times {
|
||
|
|
margin: 0 0 0.25rem;
|
||
|
|
color: #666;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
}
|
||
|
|
</style>
|