schmop/zahlzerlegung
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Levelauswahl: Wolken-Symbol auf heller Karte sichtbar (Tönung + Kontur)

Browse Source
This commit is contained in:
schmop 2026-05-31 18:17:13 +02:00
parent c8a53e6c43
commit 3b3111b5de
2 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/lib/components/home/NumberCard.svelte
View File

@ -27,8 +27,13 @@
<span class="number">{target}</span> <span class="number">{target}</span>
<span class="best" aria-hidden="true"> <span class="best" aria-hidden="true">
{#if runs > 0} {#if runs > 0}
{@const Best = SYMBOL[bestStage].c} {#if bestStage === 2}
<Best size={SYMBOL[bestStage].size} /> <!-- Auf der hellen Karte braucht die Wolke Farbe/Kontur, sonst weiß auf weiß. -->
<Cloud size={50} fill="#cfe2ff" stroke="#7e97c4" />
{:else}
{@const Best = SYMBOL[bestStage].c}
<Best size={SYMBOL[bestStage].size} />
{/if}
{/if} {/if}
</span> </span>
</button> </button>

6
src/lib/components/svg/Cloud.svelte
View File

@ -4,11 +4,13 @@
size = 100, size = 100,
opacity = 1, opacity = 1,
variant = 0, variant = 0,
}: { size?: number; opacity?: number; variant?: number } = $props(); fill = 'var(--c-cloud)',
stroke = '#cad6e8',
}: { size?: number; opacity?: number; variant?: number; fill?: string; stroke?: string } = $props();
</script> </script>
<svg width={size} height={size * 0.6} viewBox="0 0 120 70" xmlns="http://www.w3.org/2000/svg" {opacity} aria-hidden="true"> <svg width={size} height={size * 0.6} viewBox="0 0 120 70" xmlns="http://www.w3.org/2000/svg" {opacity} aria-hidden="true">
<g fill="var(--c-cloud)" stroke="#cad6e8" stroke-width="2"> <g {fill} {stroke} stroke-width="2">
{#if variant === 1} {#if variant === 1}
<ellipse cx="26" cy="44" rx="20" ry="16" /> <ellipse cx="26" cy="44" rx="20" ry="16" />
<ellipse cx="52" cy="30" rx="24" ry="20" /> <ellipse cx="52" cy="30" rx="24" ry="20" />