Compare commits

...

2 Commits

Author SHA1 Message Date
a90e8ba9d2 Use SVGs in pantry list
Some checks failed
Build and Deploy / build-and-push (push) Failing after 1m17s
2026-04-17 20:52:49 +02:00
35b8babd0c Replace ingredients images with SVGs 2026-04-17 20:38:57 +02:00
91 changed files with 126 additions and 65 deletions

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M14 20 Q12 26 18 32 Q28 44 42 46 Q50 46 52 42 Q50 40 48 42 Q38 42 28 34 Q20 28 18 22 L16 18 Z" fill="#f4d04a" stroke="#b89020" stroke-width="1.3"/><path d="M16 22 Q18 28 24 34 Q34 42 44 44 Q38 42 30 36 Q22 30 18 24 Z" fill="#f9dc7a" opacity="0.6"/><path d="M14 18 L16 14 Q18 14 18 18 Z" fill="#3d2a18" stroke="#2d1a0f" stroke-width="0.8"/><path d="M50 42 Q52 40 54 42 Q52 44 50 44 Z" fill="#8b6a3f"/><path d="M20 24 Q26 30 32 36" stroke="#fff" stroke-width="1" opacity="0.5" fill="none"/></svg>

After

Width:  |  Height:  |  Size: 564 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M32 54 L32 22" stroke="#3d6825" stroke-width="1.5" stroke-linecap="round"/><g fill="#5fa347" stroke="#3d6825" stroke-width="0.8"><path d="M32 18 Q24 14 20 20 Q22 26 28 28 Q32 26 32 20 Z"/><path d="M32 18 Q40 14 44 20 Q42 26 36 28 Q32 26 32 20 Z"/><path d="M32 30 Q20 28 16 34 Q20 40 28 40 Q32 38 32 32 Z"/><path d="M32 30 Q44 28 48 34 Q44 40 36 40 Q32 38 32 32 Z"/><path d="M32 42 Q24 42 22 48 Q26 52 30 50 Q32 48 32 44 Z"/><path d="M32 42 Q40 42 42 48 Q38 52 34 50 Q32 48 32 44 Z"/></g><g stroke="#3d6825" stroke-width="0.5" fill="none" opacity="0.6"><path d="M32 18 L24 22"/><path d="M32 18 L40 22"/><path d="M32 30 L20 34"/><path d="M32 30 L44 34"/><path d="M32 42 L26 46"/><path d="M32 42 L38 46"/></g><g fill="#7ac253" opacity="0.6"><ellipse cx="24" cy="22" rx="2" ry="1"/><ellipse cx="40" cy="22" rx="2" ry="1"/><ellipse cx="22" cy="34" rx="3" ry="1.5"/><ellipse cx="42" cy="34" rx="3" ry="1.5"/></g></svg>

After

Width:  |  Height:  |  Size: 982 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><circle cx="22" cy="40" r="10" fill="#4a6fa8" stroke="#2d4a7a" stroke-width="1.2"/><circle cx="40" cy="38" r="11" fill="#5a7fb8" stroke="#2d4a7a" stroke-width="1.2"/><circle cx="30" cy="24" r="9" fill="#6a8fc8" stroke="#2d4a7a" stroke-width="1.2"/><circle cx="44" cy="22" r="7" fill="#4a6fa8" stroke="#2d4a7a" stroke-width="1.2"/><g fill="#8aafd8" opacity="0.6"><ellipse cx="20" cy="37" rx="3" ry="2"/><ellipse cx="37" cy="35" rx="3" ry="2"/><ellipse cx="28" cy="21" rx="3" ry="2"/><ellipse cx="42" cy="20" rx="2" ry="1.5"/></g><g fill="#2d4a7a"><path d="M22 34 L20 32 L24 32 Z"/><path d="M40 32 L38 30 L42 30 Z"/><path d="M30 18 L28 16 L32 16 Z"/><path d="M44 17 L43 15 L46 15 Z"/></g></svg>

After

Width:  |  Height:  |  Size: 753 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M12 26 Q10 22 14 22 L50 22 Q54 22 52 26 L48 52 Q48 56 44 56 L20 56 Q16 56 16 52 Z" fill="#a6743a" stroke="#6b4a28" stroke-width="1.3"/><ellipse cx="32" cy="24" rx="20" ry="4" fill="#c99866" stroke="#6b4a28" stroke-width="1.3"/><ellipse cx="32" cy="24" rx="17" ry="2.5" fill="#e3c18a"/><g fill="#5fa347" opacity="0.8"><ellipse cx="24" cy="32" rx="1.5" ry="1"/><ellipse cx="38" cy="34" rx="1.5" ry="1"/><ellipse cx="28" cy="40" rx="1.2" ry="0.8"/><ellipse cx="42" cy="42" rx="1.2" ry="0.8"/></g><g fill="#ef8a3d" opacity="0.8"><ellipse cx="30" cy="30" rx="1.3" ry="1"/><ellipse cx="36" cy="40" rx="1.3" ry="1"/><ellipse cx="22" cy="42" rx="1" ry="0.8"/></g><g fill="#b89020" opacity="0.7"><circle cx="26" cy="36" r="0.8"/><circle cx="34" cy="38" r="0.8"/><circle cx="40" cy="32" rd="0.8"/></g><path d="M14 10 Q16 14 14 18" stroke="#c9c3b3" stroke-width="0.8" fill="none" opacity="0.6"/><path d="M22 8 Q24 14 22 18" stroke="#c9c3b3" stroke-width="0.8" fill="none" opacity="0.6"/><path d="M32 8 Q34 14 32 18" stroke="#c9c3b3" stroke-width="0.8" fill="none" opacity="0.6"/><path d="M42 8 Q44 14 42 18" stroke="#c9c3b3" stroke-width="0.8" fill="none" opacity="0.6"/><path d="M50 10 Q52 14 50 18" stroke="#c9c3b3" stroke-width="0.8" fill="none" opacity="0.6"/></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><ellipse cx="32" cy="36" rx="22" ry="16" fill="#c79968" stroke="#8b6a3f" stroke-width="1.3"/><ellipse cx="32" cy="32" rx="20" ry="12" fill="#d8ad7a"/><path d="M14 36 Q32 32 50 36" stroke="#8b6a3f" stroke-width="1" fill="none" opacity="0.5"/><g fill="#6b4a28"><circle cx="22" cy="30" r="0.8"/><circle cx="28" cy="26" r="0.8"/><circle cx="35" cy="28" r="0.8"/><circle cx="40" cy="24" r="0.8"/><circle cx="43" cy="30" r="0.8"/><circle cx="30" cy="32" r="0.8"/><circle cx="38" cy="34" r="0.8"/><circle cx="24" cy="34" r="0.8"/><circle cx="17" cy="32" r="0.7"/><circle cx="47" cy="32" r="0.7"/></g><ellipse cx="25" cy="26" rx="8" ry="2" fill="#e8c497" opacity="0.5"/></svg>

After

Width:  |  Height:  |  Size: 729 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><ellipse cx="32" cy="54" rx="18" ry="3" fill="#e8e2d2" opacity="0.5"/><circle cx="32" cy="38" r="18" fill="#fefcf4" stroke="#c9c3b3" stroke-width="1.3"/><path d="M26 22 Q32 14 38 22 Q36 18 34 18 Q33 14 32 18 Q31 14 30 18 Q28 18 26 22 Z" fill="#fefcf4" stroke="#c9c3b3" stroke-width="1.2"/><path d="M28 20 Q32 18 36 20" stroke="#c9c3b3" stroke-width="0.8" fill="none"/><ellipse cx="26" cy="32" rx="6" ry="3" fill="#fff" opacity="0.7"/><circle cx="40" cy="42" r="2" fill="#fff" opacity="0.5"/></svg>

After

Width:  |  Height:  |  Size: 558 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M24 14 Q28 12 32 14 Q36 16 38 20 L44 30 L46 50 Q46 54 42 56 L22 56 Q18 54 18 50 L20 32 L24 22 Z" fill="#fefcf4" stroke="#b0a080" stroke-width="1.3"/><rect x="20" y="34" width="24" height="16" rx="1" fill="#f0ebdd" stroke="#c9c3b3" stroke-width="0.8"/><text x="32" y="42" text-anchor="middle" font-family="sans-serif" font-size="5" fill="#6b4a28" font-weight="bold">CHRZAN</text><circle cx="32" cy="46" r="2" fill="none" stroke="#6b4a28" stroke-width="0.6"/><path d="M24 14 L32 6 L40 14" fill="#5fa347" stroke="#3d6825" stroke-width="1"/><path d="M28 10 L32 8 L36 10" fill="#7ac253"/><ellipse cx="24" cy="24" rx="2" ry="4" fill="#fff" opacity="0.4"/></svg>

After

Width:  |  Height:  |  Size: 725 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(-30 32 32)"><rect x="12" y="22" width="38" height="20" rx="10" fill="#5f8c3d" stroke="#3d6825" stroke-width="1.3"/><rect x="14" y="24" width="34" height="10" rx="5" fill="#7aa855" opacity="0.7"/><g stroke="#3d6825" stroke-width="0.6" fill="none" opacity="0.6"><path d="M18 30 Q22 32 26 30"/><path d="M30 32 Q34 34 38 32"/><path d="M42 30 Q46 32 48 30"/><path d="M18 38 Q22 40 26 38"/><path d="M30 36 Q34 38 38 36"/></g><path d="M13 24 Q11 22 13 20 L15 20 Q17 22 15 24" fill="#3d6825"/><path d="M14 20 L14 18" stroke="#3d6825" stroke-width="1" stroke-linecap="round"/><ellipse cx="20" cy="27" rx="6" ry="1.5" fill="#aed37a" opacity="0.7"/></g></svg>

After

Width:  |  Height:  |  Size: 730 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(-20 32 32)"><rect x="16" y="24" width="32" height="16" rx="3" fill="#8b4a20" stroke="#5a2a10" stroke-width="1.3"/><ellipse cx="16" cy="32" rx="3" ry="8" fill="#6b3618"/><ellipse cx="18" cy="32" rx="2.5" ry="7" fill="#a6632a" opacity="0.7"/><ellipse cx="48" cy="32" rx="3" ry="8" fill="#6b3618"/><ellipse cx="46" cy="32" rx="2.5" ry="7" fill="#a6632a" opacity="0.7"/><g stroke="#5a2a10" stroke-width="0.5" fill="none" opacity="0.7"><path d="M22 28 L22 36"/><path d="M28 27 L28 37"/><path d="M34 28 L34 36"/><path d="M40 27 L40 37"/></g><ellipse cx="20" cy="28" rx="10" ry="1.5" fill="#fff" opacity="0.15"/></g><g transform="rotate(40 32 42)"><rect x="22" y="40" width="20" height="10" rx="2" fill="#8b4a20" stroke="#5a2a10" stroke-width="1.2"/><ellipse cx="22" cy="45" rx="2" ry="5" fill="#6b3618"/><ellipse cx="42" cy="45" rx="2" ry="5" fill="#6b3618"/></g></svg>

After

Width:  |  Height:  |  Size: 945 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><rect x="12" y="16" width="40" height="36" rx="2" fill="#8b4a20" stroke="#4a2c10" stroke-width="1.3"/><path d="M12 16 L16 12 L52 12 L52 16" fill="#a6632a" stroke="#4a2c10" stroke-width="1.3"/><g fill="#6b3618" stroke="#4a2c10" stroke-width="0.8"><rect x="14" y="18" width="11" height="10" rx="1"/><rect x="26" y="18" width="11" height="10" rx="1"/><rect x="38" y="18" width="12" height="10" rx="1"/><rect x="14" y="29" width="11" height="10" rx="1"/><rect x="26" y="29" width="11" height="10" rx="1"/><rect x="38" y="29" width="12" height="10" rx="1"/><rect x="14" y="40" width="11" height="10" rx="1"/><rect x="26" y="40" width="11" height="10" rx="1"/><rect x="38" y="40" width="12" height="10" rx="1"/></g><g fill="#a6632a" opacity="0.3"><rect x="15" y="19" width="9" height="3" rx="0.5"/><rect x="27" y="19" width="9" height="3" rx="0.5"/><rect x="39" y="19" width="10" height="3" rx="0.5"/><rect x="15" y="30" width="9" height="3" rx="0.5"/><rect x="27" y="30" width="9" height="3" rx="0.5"/><rect x="39" y="30" width="10" height="3" rx="0.5"/></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M32 12 Q30 18 28 20" stroke="#8a7a5a" stroke-width="2" fill="none" stroke-linecap="round"/><path d="M32 12 Q34 18 36 20" stroke="#8a7a5a" stroke-width="2" fill="none" stroke-linecap="round"/><path d="M14 32 Q14 20 24 18 Q32 16 40 18 Q50 20 50 32 Q50 44 42 52 Q32 56 22 52 Q14 44 14 32 Z" fill="#fefcf4" stroke="#c9c3b3" stroke-width="1.3"/><path d="M24 20 Q24 34 22 50" stroke="#c9c3b3" stroke-width="0.8" fill="none"/><path d="M32 18 Q32 34 32 54" stroke="#c9c3b3" stroke-width="0.8" fill="none"/><path d="M40 20 Q40 34 42 50" stroke="#c9c3b3" stroke-width="0.8" fill="none"/><path d="M18 28 Q24 24 32 24 Q40 24 46 28" stroke="#c9c3b3" stroke-width="0.6" fill="none" opacity="0.6"/><ellipse cx="22" cy="30" rx="2" ry="6" fill="#fff" opacity="0.5"/></svg>

After

Width:  |  Height:  |  Size: 825 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><rect x="28" y="10" width="8" height="4" rx="1" fill="#3d2a18"/><rect x="29" y="14" width="6" height="4" fill="#5a3a20"/><path d="M24 20 Q24 18 26 18 L38 18 Q40 18 40 20 L42 26 L42 52 Q42 56 38 56 L26 56 Q22 56 22 52 L22 26 Z" fill="#4a2c1a" stroke="#2d1a0f" stroke-width="1.3" stroke-linejoin="round"/><rect x="25" y="30" width="14" height="14" rx="1" fill="#f5f1e5" stroke="#c9c3b3" stroke-width="0.6"/><text x="32" y="36" text-anchor="middle" font-family="sans-serif" font-size="3" fill="#3d2a18" font-weight="bold">VANILLA</text><text x="32" y="40" text-anchor="middle" font-family="sans-serif" font-size="2.5" fill="#6b4a28">EXTRACT</text><circle cx="32" cy="42" r="1.5" fill="#b89020" opacity="0.7"/><rect x="24" y="22" width="2" height="28" fill="#fff" opacity="0.2"/></svg>

After

Width:  |  Height:  |  Size: 842 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M16 16 Q16 12 20 12 L44 12 Q48 12 48 16 L50 54 Q50 56 48 56 L16 56 Q14 56 14 54 Z" fill="#fefcf4" stroke="#a89778" stroke-width="1.3"/><path d="M16 16 Q32 18 48 16" stroke="#a89778" stroke-width="1" fill="none"/><rect x="20" y="24" width="24" height="20" rx="1" fill="#fff" stroke="#c9c3b3" stroke-width="0.6"/><text x="32" y="32" text-anchor="middle" font-family="sans-serif" font-size="4.5" fill="#3a7ca5" font-weight="bold">ERYTROL</text><path d="M24 36 L40 36" stroke="#a89778" stroke-width="0.6"/><g fill="#fff" stroke="#c9c3b3" stroke-width="0.3"><rect x="24" y="38" width="2" height="2"/><rect x="27" y="39" width="2" height="2"/><rect x="30" y="38" width="2" height="2"/><rect x="33" y="39" width="2" height="2"/><rect x="36" y="38" width="2" height="2"/><rect x="39" y="39" width="2" height="2"/></g><ellipse cx="22" cy="22" rx="3" ry="1.5" fill="#fff" opacity="0.6"/></svg>

After

Width:  |  Height:  |  Size: 953 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><ellipse cx="32" cy="52" rx="22" ry="4" fill="#c9c3b3" opacity="0.5"/><path d="M10 34 Q10 30 14 30 L50 30 Q54 30 54 34 Q54 48 50 52 Q32 56 14 52 Q10 48 10 34 Z" fill="#e3d098" stroke="#a67830" stroke-width="1.3"/><ellipse cx="32" cy="32" rx="22" ry="4" fill="#f0d8a8" stroke="#a67830" stroke-width="1.3"/><ellipse cx="32" cy="32" rx="18" ry="2.5" fill="#f7e2b8"/><g fill="#a67830" opacity="0.7"><circle cx="24" cy="34" r="1"/><circle cx="32" cy="35" r="1.2"/><circle cx="40" cy="34" r="1"/></g><path d="M26 40 L30 46 L34 40 L38 46 L42 40" stroke="#5fa347" stroke-width="1" fill="none" opacity="0.8"/><ellipse cx="30" cy="44" rx="1" ry="0.8" fill="#5fa347"/><ellipse cx="38" cy="44" rx="1" ry="0.8" fill="#5fa347"/><ellipse cx="20" cy="36" rx="5" ry="1" fill="#fff" opacity="0.5"/></svg>

After

Width:  |  Height:  |  Size: 847 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M12 36 Q10 28 18 24 Q22 20 28 24 Q32 22 38 26 Q42 22 48 26 Q54 30 52 38 Q54 44 48 46 Q44 50 38 46 Q32 50 26 46 Q20 50 14 44 Q10 40 12 36 Z" fill="#e3c18a" stroke="#9e7840" stroke-width="1.3"/><path d="M20 28 Q24 32 28 30 Q32 28 36 32 Q40 28 44 32" stroke="#9e7840" stroke-width="0.8" fill="none" opacity="0.7"/><g fill="#fff" opacity="0.4"><ellipse cx="22" cy="30" rx="3" ry="2"/><ellipse cx="38" cy="30" rx="3" ry="1.5"/></g><g stroke="#9e7840" stroke-width="0.5" fill="none" opacity="0.6"><path d="M16 36 Q20 38 18 42"/><path d="M30 38 Q32 42 34 40"/><path d="M44 38 Q46 42 42 44"/></g><circle cx="24" cy="34" r="0.6" fill="#6b4a28"/><circle cx="40" cy="36" r="0.6" fill="#6b4a28"/></svg>

After

Width:  |  Height:  |  Size: 760 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><circle cx="20" cy="42" r="8" fill="#2d2448" stroke="#1a1428" stroke-width="1.2"/><circle cx="34" cy="40" r="9" fill="#3a2f5a" stroke="#1a1428" stroke-width="1.2"/><circle cx="46" cy="42" r="7" fill="#2d2448" stroke="#1a1428" stroke-width="1.2"/><circle cx="26" cy="26" r="8" fill="#3a2f5a" stroke="#1a1428" stroke-width="1.2"/><circle cx="40" cy="24" r="7" fill="#2d2448" stroke="#1a1428" stroke-width="1.2"/><circle cx="50" cy="28" r="5" fill="#3a2f5a" stroke="#1a1428" stroke-width="1.2"/><g fill="#5a4f7a" opacity="0.6"><ellipse cx="18" cy="40" rx="2" ry="1.5"/><ellipse cx="32" cy="37" rx="2.5" ry="1.5"/><ellipse cx="44" cy="40" rx="2" ry="1.5"/><ellipse cx="24" cy="24" rx="2.5" ry="1.5"/><ellipse cx="38" cy="22" rx="2" ry="1.5"/></g><g fill="#1a1428"><circle cx="20" cy="38" r="1"/><circle cx="34" cy="36" r="1"/><circle cx="46" cy="38" r="0.8"/><circle cx="26" cy="22" r="1"/><circle cx="40" cy="20" r="0.8"/></g></svg>

After

Width:  |  Height:  |  Size: 990 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><ellipse cx="24" cy="40" rx="14" ry="18" fill="#fdf6e3" stroke="#e8dcc0" stroke-width="1.5"/><ellipse cx="40" cy="36" rx="15" ry="19" fill="#fffaf0" stroke="#e8dcc0" stroke-width="1.5"/><circle cx="40" cy="36" r="6" fill="#f4c542"/><circle cx="38" cy="34" r="2" fill="#f9dc7a" opacity="0.7"/></svg>

After

Width:  |  Height:  |  Size: 359 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><circle cx="32" cy="34" r="22" fill="#d4e8b8" stroke="#7a9a5b" stroke-width="1.3"/><path d="M32 12 Q18 18 12 32 Q14 34 18 32 Q24 20 32 16 Q40 20 46 32 Q50 34 52 32 Q46 18 32 12 Z" fill="#aed37a"/><path d="M14 40 Q20 46 32 48 Q44 46 50 40 Q44 48 32 52 Q20 48 14 40 Z" fill="#aed37a" opacity="0.8"/><path d="M20 28 Q26 32 32 32 Q38 32 44 28" stroke="#7a9a5b" stroke-width="0.8" fill="none" opacity="0.7"/><path d="M18 38 Q26 42 32 42 Q38 42 46 38" stroke="#7a9a5b" stroke-width="0.8" fill="none" opacity="0.6"/><path d="M32 16 Q32 48 32 50" stroke="#7a9a5b" stroke-width="0.8" fill="none" opacity="0.5"/><ellipse cx="22" cy="28" rx="4" ry="6" fill="#fff" opacity="0.25"/></svg>

After

Width:  |  Height:  |  Size: 736 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g stroke="#fefcf4" stroke-width="1.5" fill="none" stroke-linecap="round"><path d="M20 54 Q22 44 24 32"/><path d="M28 54 Q30 42 30 28"/><path d="M36 54 Q36 42 38 28"/><path d="M44 54 Q44 44 42 32"/><path d="M24 54 Q24 46 20 36"/><path d="M32 54 Q34 46 36 36"/><path d="M40 54 Q38 46 40 34"/></g><g fill="#8bbf4f"><ellipse cx="24" cy="30" rx="2.5" ry="3"/><ellipse cx="30" cy="26" rx="2.5" ry="3"/><ellipse cx="38" cy="26" rx="2.5" ry="3"/><ellipse cx="42" cy="30" rx="2.5" ry="3"/><ellipse cx="20" cy="34" rx="2" ry="2.5"/><ellipse cx="36" cy="34" rx="2" ry="2.5"/><ellipse cx="40" cy="32" rx="2" ry="2.5"/></g><g fill="#c8253a" opacity="0.7"><circle cx="24" cy="30" r="0.8"/><circle cx="30" cy="26" r="0.8"/><circle cx="38" cy="26" r="0.8"/></g></svg>

After

Width:  |  Height:  |  Size: 813 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M32 54 L32 32" stroke="#3d6825" stroke-width="1.5" stroke-linecap="round"/><path d="M32 44 L22 40" stroke="#3d6825" stroke-width="1" stroke-linecap="round"/><path d="M32 44 L42 40" stroke="#3d6825" stroke-width="1" stroke-linecap="round"/><g fill="#5fa347" stroke="#3d6825" stroke-width="0.6"><path d="M22 40 Q16 34 14 38 Q14 44 20 42 Q16 36 22 40 Z"/><path d="M22 40 Q22 32 18 30 Q14 34 18 38 Q20 34 22 40 Z"/><path d="M42 40 Q48 34 50 38 Q50 44 44 42 Q48 36 42 40 Z"/><path d="M42 40 Q42 32 46 30 Q50 34 46 38 Q44 34 42 40 Z"/><path d="M32 32 Q26 28 24 22 Q30 22 32 28 Q34 22 40 22 Q38 28 32 32 Z"/><path d="M32 32 Q28 26 30 18 Q34 18 34 24 Q34 28 32 32 Z"/></g><g fill="#7ac253" opacity="0.6"><ellipse cx="18" cy="36" rx="2" ry="1.5"/><ellipse cx="46" cy="36" rx="2" ry="1.5"/><ellipse cx="32" cy="26" rx="2" ry="2"/></g></svg>

After

Width:  |  Height:  |  Size: 900 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M32 56 L32 20" stroke="#6b8e3d" stroke-width="1.5" stroke-linecap="round"/><g fill="#8bbf4f"><ellipse cx="32" cy="18" rx="2" ry="3"/><ellipse cx="24" cy="22" rx="2" ry="3" transform="rotate(-30 24 22)"/><ellipse cx="40" cy="22" rx="2" ry="3" transform="rotate(30 40 22)"/><ellipse cx="18" cy="28" rx="2" ry="3" transform="rotate(-45 18 28)"/><ellipse cx="46" cy="28" rx="2" ry="3" transform="rotate(45 46 28)"/><ellipse cx="14" cy="36" rx="2" ry="3" transform="rotate(-55 14 36)"/><ellipse cx="50" cy="36" rx="2" ry="3" transform="rotate(55 50 36)"/><ellipse cx="22" cy="32" rx="1.8" ry="2.5" transform="rotate(-40 22 32)"/><ellipse cx="42" cy="32" rx="1.8" ry="2.5" transform="rotate(40 42 32)"/><ellipse cx="28" cy="26" rx="1.8" ry="2.5" transform="rotate(-20 28 26)"/><ellipse cx="36" cy="26" rx="1.8" ry="2.5" transform="rotate(20 36 26)"/></g><g stroke="#6b8e3d" stroke-width="1" stroke-linecap="round" fill="none"><path d="M32 24 L24 22"/><path d="M32 24 L40 22"/><path d="M32 30 L18 28"/><path d="M32 30 L46 28"/><path d="M32 36 L14 36"/><path d="M32 36 L50 36"/></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><circle cx="32" cy="36" r="22" fill="#a8c85c" stroke="#5f8c3d" stroke-width="1.3"/><circle cx="32" cy="36" r="18" fill="#c2dc7e" opacity="0.6"/><g stroke="#7a9a5b" stroke-width="0.7" fill="none" opacity="0.6"><path d="M32 18 L32 54"/><path d="M14 36 L50 36"/><path d="M19 22 L45 50"/><path d="M45 22 L19 50"/></g><circle cx="32" cy="36" r="2" fill="#d8e8b0"/><path d="M32 14 Q30 12 28 14 Q30 14 32 16 Q34 14 36 14 Q34 12 32 14 Z" fill="#5fa347"/><ellipse cx="22" cy="30" rx="3" ry="6" fill="#fff" opacity="0.3"/></svg>

After

Width:  |  Height:  |  Size: 579 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M10 32 Q16 20 32 18 Q48 20 54 32 Q48 44 32 46 Q16 44 10 32 Z" fill="#e89676" stroke="#b85a3a" stroke-width="1.3"/><path d="M14 32 Q20 24 32 22 Q44 24 50 32 Q44 40 32 42 Q20 40 14 32 Z" fill="#f0a886" opacity="0.7"/><g stroke="#fffaf0" stroke-width="1" fill="none" opacity="0.85"><path d="M14 28 Q24 24 36 26 Q44 28 50 30"/><path d="M12 34 Q22 32 34 34 Q44 36 52 34"/><path d="M16 40 Q26 40 38 40 Q46 40 50 38"/></g><path d="M16 42 Q28 48 40 44 Q36 50 28 50 Q22 50 16 42 Z" fill="#d4715a" opacity="0.7"/></svg>

After

Width:  |  Height:  |  Size: 579 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M20 54 Q24 36 28 20 Q30 12 32 10" stroke="#8a7a4a" stroke-width="1.5" fill="none" stroke-linecap="round"/><path d="M44 54 Q40 36 36 20 Q34 12 32 10" stroke="#8a7a4a" stroke-width="1.5" fill="none" stroke-linecap="round"/><g fill="#a89d5a" stroke="#6b5e30" stroke-width="0.6"><ellipse cx="22" cy="46" rx="2" ry="2.5" transform="rotate(-30 22 46)"/><ellipse cx="24" cy="40" rx="2" ry="2.5" transform="rotate(20 24 40)"/><ellipse cx="26" cy="32" rx="2" ry="2.5" transform="rotate(-20 26 32)"/><ellipse cx="28" cy="24" rx="2" ry="2.5" transform="rotate(15 28 24)"/><ellipse cx="30" cy="16" rx="2" ry="2.5" transform="rotate(-10 30 16)"/><ellipse cx="42" cy="46" rx="2" ry="2.5" transform="rotate(30 42 46)"/><ellipse cx="40" cy="40" rx="2" ry="2.5" transform="rotate(-20 40 40)"/><ellipse cx="38" cy="32" rx="2" ry="2.5" transform="rotate(20 38 32)"/><ellipse cx="36" cy="24" rx="2" ry="2.5" transform="rotate(-15 36 24)"/><ellipse cx="34" cy="16" rx="2" ry="2.5" transform="rotate(10 34 16)"/><ellipse cx="28" cy="44" rx="1.5" ry="2" transform="rotate(20 28 44)"/><ellipse cx="30" cy="36" rx="1.5" ry="2" transform="rotate(-15 30 36)"/><ellipse cx="34" cy="36" rx="1.5" ry="2" transform="rotate(20 34 36)"/><ellipse cx="36" cy="44" rx="1.5" ry="2" transform="rotate(-25 36 44)"/></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M16 20 Q14 16 18 14 Q32 12 46 14 Q50 16 48 20 L50 54 Q50 56 48 56 L16 56 Q14 56 14 54 Z" fill="#f5f1e5" stroke="#a89778" stroke-width="1.3"/><path d="M18 14 Q32 16 46 14" stroke="#a89778" stroke-width="1" fill="none"/><rect x="22" y="28" width="20" height="18" rx="1" fill="#fff" stroke="#c9c3b3" stroke-width="0.6"/><text x="32" y="36" text-anchor="middle" font-family="sans-serif" font-size="4.5" fill="#8b6a3f" font-weight="bold">MĄKA</text><g fill="#b89058" opacity="0.7"><path d="M28 40 Q30 38 32 40 Q30 42 32 44 Q30 46 28 44 Z"/><path d="M34 40 Q36 38 38 40 Q36 42 38 44 Q36 46 34 44 Z"/></g><ellipse cx="20" cy="22" rx="3" ry="1" fill="#fff" opacity="0.6"/></svg>

After

Width:  |  Height:  |  Size: 741 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(-15 32 32)"><rect x="16" y="18" width="10" height="28" rx="3" fill="#f0c878" stroke="#b89040" stroke-width="1.2"/><rect x="16" y="18" width="10" height="28" rx="3" fill="url(#g1)" opacity="0.3"/><line x1="18" y1="20" x2="18" y2="44" stroke="#b89040" stroke-width="0.5"/><line x1="21" y1="20" x2="21" y2="44" stroke="#b89040" stroke-width="0.5"/><line x1="24" y1="20" x2="24" y2="44" stroke="#b89040" stroke-width="0.5"/></g><g transform="rotate(20 32 32)"><rect x="32" y="22" width="10" height="26" rx="3" fill="#f4d898" stroke="#b89040" stroke-width="1.2"/><line x1="34" y1="24" x2="34" y2="46" stroke="#b89040" stroke-width="0.5"/><line x1="37" y1="24" x2="37" y2="46" stroke="#b89040" stroke-width="0.5"/><line x1="40" y1="24" x2="40" y2="46" stroke="#b89040" stroke-width="0.5"/></g><g transform="rotate(50 32 32)"><rect x="28" y="30" width="10" height="24" rx="3" fill="#f0c878" stroke="#b89040" stroke-width="1.2"/><line x1="30" y1="32" x2="30" y2="52" stroke="#b89040" stroke-width="0.5"/><line x1="33" y1="32" x2="33" y2="52" stroke="#b89040" stroke-width="0.5"/><line x1="36" y1="32" x2="36" y2="52" stroke="#b89040" stroke-width="0.5"/></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(-15 32 32)"><path d="M32 18 Q28 18 26 22 L22 52 Q22 56 26 56 Q32 58 38 56 Q42 56 42 52 L38 22 Q36 18 32 18 Z" fill="#ef8a3d" stroke="#b55a1e" stroke-width="1.3"/><path d="M26 22 Q28 22 32 22 Q36 22 38 22 L36 26 L28 26 Z" fill="#f7a866" opacity="0.7"/><g stroke="#b55a1e" stroke-width="0.6" fill="none" opacity="0.7"><path d="M27 30 L37 30"/><path d="M27 38 L37 38"/><path d="M28 46 L36 46"/></g><g fill="#5fa347"><path d="M28 18 L24 8 L30 14 L30 6 L34 14 L38 8 L34 18 Z"/><path d="M32 14 L28 4 L32 10 L34 4 L34 14 Z" opacity="0.8"/></g></g></svg>

After

Width:  |  Height:  |  Size: 628 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><rect x="22" y="8" width="20" height="6" rx="1" fill="#6b4a28"/><path d="M14 16 L50 16 L48 54 Q48 56 46 56 L18 56 Q16 56 16 54 Z" fill="#c79968" stroke="#6b4a28" stroke-width="1.3"/><rect x="14" y="16" width="36" height="4" fill="#8b6a3f" opacity="0.7"/><rect x="20" y="24" width="24" height="22" rx="1" fill="#f5f1e5" stroke="#c9c3b3" stroke-width="0.8"/><path d="M22 28 Q26 26 32 30 Q38 26 42 28 L42 42 Q38 44 32 40 Q26 44 22 42 Z" fill="#a6743a"/><path d="M24 32 Q28 30 32 34 Q36 30 40 32 L40 38 Q36 40 32 36 Q28 40 24 38 Z" fill="#c99866" opacity="0.7"/><text x="32" y="44" text-anchor="middle" font-family="sans-serif" font-size="3" fill="#4a2c10" font-weight="bold">PEANUT</text><ellipse cx="18" cy="22" rx="2" ry="16" fill="#fff" opacity="0.2"/></svg>

After

Width:  |  Height:  |  Size: 819 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(-15 22 32)"><path d="M22 18 Q28 18 28 32 Q28 46 22 46 Q16 46 16 32 Q16 18 22 18 Z" fill="#d8ad7a" stroke="#8b6a3f" stroke-width="1.2"/><path d="M22 20 Q26 24 26 32 Q26 42 22 44" fill="#e8c497" opacity="0.7"/><path d="M22 22 L22 42" stroke="#8b6a3f" stroke-width="0.5" opacity="0.6"/></g><g transform="rotate(20 42 32)"><path d="M42 18 Q48 18 48 32 Q48 46 42 46 Q36 46 36 32 Q36 18 42 18 Z" fill="#c99866" stroke="#8b6a3f" stroke-width="1.2"/><path d="M42 20 Q46 24 46 32 Q46 42 42 44" fill="#d8ad7a" opacity="0.7"/><path d="M42 22 L42 42" stroke="#8b6a3f" stroke-width="0.5" opacity="0.6"/></g><g transform="rotate(60 32 44)"><path d="M32 36 Q38 36 38 44 Q38 52 32 52 Q26 52 26 44 Q26 36 32 36 Z" fill="#d8ad7a" stroke="#8b6a3f" stroke-width="1.2"/><path d="M32 38 L32 50" stroke="#8b6a3f" stroke-width="0.5" opacity="0.6"/></g></svg>

After

Width:  |  Height:  |  Size: 916 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><rect x="22" y="8" width="20" height="6" rx="1" fill="#8b6f47"/><path d="M14 16 L50 16 L48 54 Q48 56 46 56 L18 56 Q16 56 16 54 Z" fill="#f4c542" stroke="#b89020" stroke-width="1.3"/><rect x="14" y="16" width="36" height="4" fill="#d8a828" opacity="0.7"/><rect x="20" y="24" width="24" height="20" rx="1" fill="#f5f1e5" stroke="#c9c3b3" stroke-width="0.8"/><g fill="#b89020"><path d="M26 30 Q28 28 30 30 Q28 32 30 34 Q28 36 26 34 Z"/><path d="M34 30 Q36 28 38 30 Q36 32 38 34 Q36 36 34 34 Z"/><path d="M30 36 Q32 34 34 36 Q32 38 34 40 Q32 42 30 40 Z"/></g><text x="32" y="44" text-anchor="middle" font-family="sans-serif" font-size="3.5" fill="#b89020" font-weight="bold">MIÓD</text><ellipse cx="18" cy="22" rx="2" ry="14" fill="#fff" opacity="0.2"/></svg>

After

Width:  |  Height:  |  Size: 817 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M22 14 L42 14 L42 20 L46 26 L46 56 Q46 58 44 58 L20 58 Q18 58 18 56 L18 26 L22 20 Z" fill="#f0ebdd" stroke="#9e9888" stroke-width="1.3" stroke-linejoin="round"/><path d="M22 14 L22 20 L18 26" fill="none" stroke="#9e9888" stroke-width="1"/><path d="M42 14 L42 20 L46 26" fill="none" stroke="#9e9888" stroke-width="1"/><rect x="24" y="32" width="16" height="18" rx="1" fill="#fff" stroke="#c9c3b3" stroke-width="0.8"/><text x="32" y="42" text-anchor="middle" font-family="sans-serif" font-size="5" fill="#3a7ca5" font-weight="bold">MLEKO</text><circle cx="32" cy="46" r="2.5" fill="#fefcf4" stroke="#3a7ca5" stroke-width="0.6"/><rect x="20" y="18" width="3" height="30" fill="#fff" opacity="0.2"/></svg>

After

Width:  |  Height:  |  Size: 771 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><ellipse cx="32" cy="52" rx="20" ry="4" fill="#e8e2d2" opacity="0.6"/><circle cx="32" cy="34" r="18" fill="#fefcf4" stroke="#d4cfc0" stroke-width="1.3"/><ellipse cx="26" cy="28" rx="7" ry="4" fill="#fff" opacity="0.9"/><ellipse cx="38" cy="38" rx="3" ry="2" fill="#fff" opacity="0.6"/><circle cx="24" cy="40" r="1" fill="#e8e2d2" opacity="0.6"/></svg>

After

Width:  |  Height:  |  Size: 412 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g fill="#3d2a18" stroke="#1a1008" stroke-width="0.8"><ellipse cx="22" cy="24" rx="3" ry="5" transform="rotate(20 22 24)"/><ellipse cx="32" cy="22" rx="3" ry="5" transform="rotate(-10 32 22)"/><ellipse cx="42" cy="26" rx="3" ry="5" transform="rotate(30 42 26)"/><ellipse cx="18" cy="34" rx="3" ry="5" transform="rotate(-20 18 34)"/><ellipse cx="28" cy="34" rx="3" ry="5" transform="rotate(15 28 34)"/><ellipse cx="38" cy="36" rx="3" ry="5" transform="rotate(-30 38 36)"/><ellipse cx="48" cy="34" rx="3" ry="5" transform="rotate(10 48 34)"/><ellipse cx="22" cy="44" rx="3" ry="5" transform="rotate(40 22 44)"/><ellipse cx="32" cy="46" rx="3" ry="5" transform="rotate(-15 32 46)"/><ellipse cx="42" cy="46" rx="3" ry="5" transform="rotate(25 42 46)"/></g><g stroke="#8a7a4a" stroke-width="0.5" fill="none"><path d="M22 22 L22 26"/><path d="M32 20 L32 24"/><path d="M42 24 L42 28"/><path d="M18 32 L18 36"/><path d="M28 32 L28 36"/><path d="M38 34 L38 38"/><path d="M48 32 L48 36"/><path d="M22 42 L22 46"/><path d="M32 44 L32 48"/><path d="M42 44 L42 48"/></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M32 54 L32 30" stroke="#3d6825" stroke-width="1.5" stroke-linecap="round"/><path d="M32 40 L24 36" stroke="#3d6825" stroke-width="1" stroke-linecap="round"/><path d="M32 40 L40 36" stroke="#3d6825" stroke-width="1" stroke-linecap="round"/><g fill="#3d7a2d" stroke="#2d5a20" stroke-width="0.8"><path d="M20 20 Q14 14 12 20 Q12 26 18 26 Q18 20 20 20 Z"/><path d="M20 20 Q18 12 24 10 Q28 14 24 20 Q22 22 20 20 Z"/><path d="M24 26 Q20 32 14 30 Q14 24 20 24 Q22 24 24 26 Z"/><path d="M44 20 Q50 14 52 20 Q52 26 46 26 Q46 20 44 20 Z"/><path d="M44 20 Q46 12 40 10 Q36 14 40 20 Q42 22 44 20 Z"/><path d="M40 26 Q44 32 50 30 Q50 24 44 24 Q42 24 40 26 Z"/><path d="M32 18 Q28 10 32 6 Q36 10 32 18 Z"/><path d="M32 18 Q36 22 40 20 Q38 14 32 18 Z"/><path d="M32 18 Q28 22 24 20 Q26 14 32 18 Z"/></g><g fill="#5fa347" opacity="0.7"><ellipse cx="16" cy="20" rx="2" ry="2"/><ellipse cx="48" cy="20" rx="2" ry="2"/><ellipse cx="32" cy="14" rx="2" ry="2"/></g></svg>

After

Width:  |  Height:  |  Size: 1020 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(-30 32 32)"><rect x="18" y="22" width="28" height="20" rx="10" fill="#8cb85c" stroke="#5f8c3d" stroke-width="1.5"/><circle cx="24" cy="32" r="1.2" fill="#5f8c3d"/><circle cx="30" cy="30" r="1.2" fill="#5f8c3d"/><circle cx="30" cy="34" r="1.2" fill="#5f8c3d"/><circle cx="36" cy="32" r="1.2" fill="#5f8c3d"/><circle cx="40" cy="30" r="1.2" fill="#5f8c3d"/><circle cx="40" cy="34" r="1.2" fill="#5f8c3d"/><path d="M19 26 Q22 28 19 30" stroke="#5f8c3d" stroke-width="1" fill="none" stroke-linecap="round"/><ellipse cx="24" cy="26" rx="6" ry="1" fill="#aed37a" opacity="0.6"/></g></svg>

After

Width:  |  Height:  |  Size: 664 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><rect x="28" y="6" width="8" height="4" rx="1" fill="#8b6f47"/><rect x="29" y="10" width="6" height="6" fill="#d4c4a0" stroke="#b0a080" stroke-width="0.8"/><path d="M22 18 Q22 16 24 16 L40 16 Q42 16 42 18 L42 22 L46 28 L46 54 Q46 56 44 56 L20 56 Q18 56 18 54 L18 28 L22 22 Z" fill="#f4c542" stroke="#b89020" stroke-width="1.3" stroke-linejoin="round"/><path d="M22 18 L22 22 L18 28" fill="none" stroke="#b89020" stroke-width="1"/><path d="M42 18 L42 22 L46 28" fill="none" stroke="#b89020" stroke-width="1"/><rect x="24" y="34" width="16" height="16" rx="1" fill="#fffaf0" stroke="#c9c3b3" stroke-width="0.6"/><text x="32" y="42" text-anchor="middle" font-family="sans-serif" font-size="4" fill="#b55a1e" font-weight="bold">OLEJ</text><path d="M28 46 Q30 44 32 46 Q34 44 36 46" stroke="#b89020" stroke-width="0.8" fill="none"/><rect x="20" y="20" width="3" height="32" fill="#fff" opacity="0.25"/></svg>

After

Width:  |  Height:  |  Size: 964 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><rect x="28" y="6" width="8" height="4" rx="1" fill="#2d4a2a"/><rect x="29" y="10" width="6" height="6" fill="#5a7a45" stroke="#3d6825" stroke-width="0.8"/><path d="M22 18 Q22 16 24 16 L40 16 Q42 16 42 18 L42 22 L46 28 L46 54 Q46 56 44 56 L20 56 Q18 56 18 54 L18 28 L22 22 Z" fill="#5fa347" stroke="#3d6825" stroke-width="1.3" stroke-linejoin="round"/><path d="M22 18 L22 22 L18 28" fill="none" stroke="#3d6825" stroke-width="1"/><path d="M42 18 L42 22 L46 28" fill="none" stroke="#3d6825" stroke-width="1"/><rect x="24" y="34" width="16" height="16" rx="1" fill="#f5f1e5" stroke="#c9c3b3" stroke-width="0.6"/><ellipse cx="28" cy="42" rx="2" ry="3" fill="#5fa347"/><ellipse cx="33" cy="40" rx="1.5" ry="2" fill="#3d6825"/><ellipse cx="36" cy="44" rx="1.8" ry="2.5" fill="#5fa347"/><rect x="20" y="20" width="3" height="32" fill="#fff" opacity="0.2"/></svg>

After

Width:  |  Height:  |  Size: 917 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><circle cx="32" cy="36" r="18" fill="#a6743a" stroke="#6b4a28" stroke-width="1.3"/><circle cx="32" cy="36" r="14" fill="#c7a074" opacity="0.7"/><path d="M32 16 L30 14 L32 12 L34 14 Z" fill="#6b4a28"/><path d="M32 18 Q28 20 32 24 Q36 20 32 18 Z" fill="#8b6a3f"/><g stroke="#6b4a28" stroke-width="0.6" fill="none" opacity="0.6"><path d="M22 32 Q24 36 22 40"/><path d="M42 32 Q40 36 42 40"/><path d="M28 44 Q32 46 36 44"/></g><circle cx="32" cy="42" r="1" fill="#6b4a28"/><ellipse cx="26" cy="32" rx="3" ry="5" fill="#fff" opacity="0.25"/></svg>

After

Width:  |  Height:  |  Size: 603 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M14 28 Q14 18 24 18 Q32 18 36 24 Q40 18 48 20 Q56 24 54 34 Q52 44 44 46 Q34 48 30 42 Q26 48 18 46 Q12 40 14 28 Z" fill="#f0c878" stroke="#a67830" stroke-width="1.3"/><path d="M16 30 Q18 22 24 22 Q30 22 32 26 Q34 24 38 24 Q44 22 48 26 Q52 32 48 38 Q40 42 34 38 Q32 42 28 42 Q18 40 16 30 Z" fill="#f7d898" opacity="0.6"/><g stroke="#a67830" stroke-width="0.5" fill="none" opacity="0.6"><path d="M20 30 Q22 34 20 38"/><path d="M30 32 Q28 34 30 38"/><path d="M40 30 Q42 34 40 38"/></g><ellipse cx="22" cy="26" rx="4" ry="2" fill="#fff" opacity="0.3"/></svg>

After

Width:  |  Height:  |  Size: 623 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(-10 32 32)"><ellipse cx="32" cy="32" rx="16" ry="12" fill="#8b5e28" stroke="#4a2c10" stroke-width="1.3"/><ellipse cx="32" cy="32" rx="13" ry="9" fill="#a67038" opacity="0.7"/><path d="M32 20 L32 44" stroke="#4a2c10" stroke-width="1"/><g stroke="#4a2c10" stroke-width="0.6" fill="none" opacity="0.8"><path d="M20 26 Q22 30 20 34 Q22 38 20 42"/><path d="M44 26 Q42 30 44 34 Q42 38 44 42"/><path d="M28 22 Q26 28 28 32 Q26 38 28 42"/><path d="M36 22 Q38 28 36 32 Q38 38 36 42"/></g><ellipse cx="26" cy="28" rx="3" ry="2" fill="#fff" opacity="0.3"/></g></svg>

After

Width:  |  Height:  |  Size: 637 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M14 32 Q14 18 32 16 Q50 18 50 32 Q50 46 32 48 Q14 46 14 32 Z" fill="#c7a074" stroke="#6b4a28" stroke-width="1.3"/><path d="M32 14 L32 50" stroke="#6b4a28" stroke-width="1"/><g stroke="#6b4a28" stroke-width="0.8" fill="none" opacity="0.7"><path d="M22 22 Q26 24 22 28 Q26 30 22 34 Q26 36 22 40"/><path d="M42 22 Q38 24 42 28 Q38 30 42 34 Q38 36 42 40"/><path d="M18 26 Q22 28 18 32 Q22 34 18 38"/><path d="M46 26 Q42 28 46 32 Q42 34 46 38"/><path d="M28 20 Q26 24 28 28 Q26 32 28 36 Q26 40 28 44"/><path d="M36 20 Q38 24 36 28 Q38 32 36 36 Q38 40 36 44"/></g><path d="M20 28 Q24 30 20 34" stroke="#6b4a28" stroke-width="0.6" fill="none"/><ellipse cx="24" cy="24" rx="4" ry="2" fill="#fff" opacity="0.2"/></svg>

After

Width:  |  Height:  |  Size: 779 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(25 32 32)"><path d="M28 12 L28 16 Q28 18 30 18 L34 18 Q36 18 36 16 L36 12" fill="#5fa347" stroke="#3d7a2d" stroke-width="1.2"/><path d="M30 10 L34 10" stroke="#3d7a2d" stroke-width="1" stroke-linecap="round"/><path d="M24 18 Q26 20 32 22 Q38 26 36 38 Q32 48 30 52 Q28 54 26 52 Q20 42 22 30 Q22 22 24 18 Z" fill="#c8253a" stroke="#8a1a28" stroke-width="1.3"/><path d="M26 22 Q30 24 32 30 Q32 40 30 46" fill="#e63946" opacity="0.6"/><ellipse cx="26" cy="30" rx="2" ry="8" fill="#fff" opacity="0.3"/></g></svg>

After

Width:  |  Height:  |  Size: 589 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M18 26 Q18 20 24 18 Q32 16 40 18 Q46 20 48 26 Q50 38 46 46 Q42 54 32 54 Q20 54 16 44 Q14 34 18 26 Z" fill="#e63946" stroke="#a82838" stroke-width="1.3"/><path d="M24 28 Q32 24 40 28 Q42 36 40 42 Q36 48 32 48 Q26 46 24 40 Q22 32 24 28 Z" fill="#ef5666" opacity="0.6"/><path d="M28 18 L28 14 Q28 12 30 12 L34 12 Q36 12 36 14 L36 18" fill="#5fa347" stroke="#3d7a2d" stroke-width="1.2"/><path d="M30 14 L34 14" stroke="#3d7a2d" stroke-width="0.8"/><ellipse cx="24" cy="32" rx="2" ry="8" fill="#fff" opacity="0.25"/></svg>

After

Width:  |  Height:  |  Size: 587 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M18 24 Q28 14 44 18 Q54 24 52 38 Q48 50 32 52 Q16 48 14 36 Q14 28 18 24 Z" fill="#f8d4bc" stroke="#c58a6a" stroke-width="1.3"/><path d="M22 26 Q30 20 42 24 Q48 30 46 38 Q42 46 32 46 Q22 42 20 34 Q20 28 22 26 Z" fill="#fce2cf" opacity="0.8"/><g stroke="#d19878" stroke-width="0.8" fill="none" opacity="0.6"><path d="M24 30 Q32 28 40 32"/><path d="M22 36 Q30 34 42 36"/><path d="M26 42 Q32 42 38 40"/></g><ellipse cx="26" cy="28" rx="5" ry="2" fill="#fff" opacity="0.4"/></svg>

After

Width:  |  Height:  |  Size: 545 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g transform="rotate(-10 32 32)"><path d="M32 18 Q28 18 26 22 L22 52 Q22 56 26 56 Q32 58 38 56 Q42 56 42 52 L38 22 Q36 18 32 18 Z" fill="#f0ebdd" stroke="#a89778" stroke-width="1.3"/><path d="M26 22 Q28 22 32 22 Q36 22 38 22 L36 26 L28 26 Z" fill="#fff" opacity="0.6"/><g stroke="#a89778" stroke-width="0.6" fill="none" opacity="0.7"><path d="M27 30 L37 30"/><path d="M27 38 L37 38"/><path d="M28 46 L36 46"/></g><g fill="#5fa347"><path d="M28 18 L24 6 L28 12 L28 4 L32 12 L36 6 L34 16 Z"/><path d="M36 18 L34 10 L38 14 L38 6 L40 14 L42 10 L40 18 Z" opacity="0.85"/></g></g></svg>

After

Width:  |  Height:  |  Size: 641 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g fill="#e8c497" stroke="#8b6a3f" stroke-width="0.8"><ellipse cx="20" cy="22" rx="5" ry="2.5" transform="rotate(-20 20 22)"/><ellipse cx="32" cy="20" rx="5" ry="2.5" transform="rotate(15 32 20)"/><ellipse cx="44" cy="22" rx="5" ry="2.5" transform="rotate(-10 44 22)"/><ellipse cx="18" cy="32" rx="5" ry="2.5" transform="rotate(25 18 32)"/><ellipse cx="30" cy="30" rx="5" ry="2.5" transform="rotate(-30 30 30)"/><ellipse cx="42" cy="32" rx="5" ry="2.5" transform="rotate(10 42 32)"/><ellipse cx="22" cy="42" rx="5" ry="2.5" transform="rotate(-15 22 42)"/><ellipse cx="34" cy="40" rx="5" ry="2.5" transform="rotate(20 34 40)"/><ellipse cx="46" cy="42" rx="5" ry="2.5" transform="rotate(-25 46 42)"/><ellipse cx="20" cy="50" rx="5" ry="2.5" transform="rotate(30 20 50)"/><ellipse cx="32" cy="50" rx="5" ry="2.5" transform="rotate(-10 32 50)"/><ellipse cx="44" cy="50" rx="5" ry="2.5" transform="rotate(15 44 50)"/></g><g fill="#c7a074" opacity="0.6"><ellipse cx="20" cy="22" rx="2.5" ry="1" transform="rotate(-20 20 22)"/><ellipse cx="32" cy="30" rx="2.5" ry="1" transform="rotate(-30 32 30)"/><ellipse cx="46" cy="42" rx="2.5" ry="1" transform="rotate(-25 46 42)"/></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><circle cx="32" cy="36" r="22" fill="#e63946" stroke="#a82838" stroke-width="1.3"/><ellipse cx="26" cy="28" rx="7" ry="4" fill="#ef5666" opacity="0.7"/><path d="M32 14 Q30 10 26 12 Q28 14 28 16 Q30 14 32 18 Q34 14 36 16 Q36 14 38 12 Q34 10 32 14 Z" fill="#5fa347" stroke="#3d7a2d" stroke-width="1"/><path d="M32 18 L32 20" stroke="#3d7a2d" stroke-width="1" stroke-linecap="round"/><ellipse cx="22" cy="32" rx="3" ry="6" fill="#fff" opacity="0.2"/></svg>

After

Width:  |  Height:  |  Size: 514 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><circle cx="22" cy="42" r="11" fill="#e63946" stroke="#a82838" stroke-width="1.2"/><circle cx="42" cy="40" r="11" fill="#e63946" stroke="#a82838" stroke-width="1.2"/><circle cx="32" cy="28" r="10" fill="#ef5666" stroke="#a82838" stroke-width="1.2"/><ellipse cx="19" cy="38" rx="3" ry="2" fill="#ef5666" opacity="0.6"/><ellipse cx="39" cy="36" rx="3" ry="2" fill="#fff" opacity="0.3"/><ellipse cx="29" cy="24" rx="3" ry="2" fill="#fff" opacity="0.4"/><path d="M32 18 Q28 14 24 16 Q30 18 32 22 Q34 18 40 16 Q36 14 32 18 Z" fill="#5fa347"/><path d="M22 32 Q18 28 14 30 Q20 32 22 36 Q24 32 30 30 Q26 28 22 32 Z" fill="#5fa347" opacity="0.85"/><path d="M42 30 Q38 26 34 28 Q40 30 42 34 Q44 30 50 28 Q46 26 42 30 Z" fill="#5fa347" opacity="0.85"/></svg>

After

Width:  |  Height:  |  Size: 808 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M14 20 L50 20 L46 54 Q46 56 44 56 L20 56 Q18 56 18 54 Z" fill="#fefcf4" stroke="#c9c3b3" stroke-width="1.3"/><ellipse cx="32" cy="20" rx="18" ry="4" fill="#f5f1e5" stroke="#c9c3b3" stroke-width="1.3"/><ellipse cx="32" cy="20" rx="15" ry="2.5" fill="#fff"/><ellipse cx="24" cy="30" rx="5" ry="2" fill="#fff" opacity="0.7"/><path d="M22 38 Q28 40 32 38" stroke="#c9c3b3" stroke-width="0.8" fill="none" opacity="0.5"/></svg>

After

Width:  |  Height:  |  Size: 491 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M32 54 L32 10" stroke="#8b6a3f" stroke-width="1.5" stroke-linecap="round"/><path d="M32 20 L22 14" stroke="#8b6a3f" stroke-width="1" stroke-linecap="round"/><path d="M32 28 L42 22" stroke="#8b6a3f" stroke-width="1" stroke-linecap="round"/><path d="M32 38 L20 32" stroke="#8b6a3f" stroke-width="1" stroke-linecap="round"/><path d="M32 46 L44 42" stroke="#8b6a3f" stroke-width="1" stroke-linecap="round"/><g fill="#ef8a3d" stroke="#b55a1e" stroke-width="0.6"><circle cx="22" cy="14" r="3"/><circle cx="26" cy="18" r="2.5"/><circle cx="42" cy="22" r="3"/><circle cx="38" cy="26" r="2.5"/><circle cx="20" cy="32" r="3"/><circle cx="24" cy="36" r="2.5"/><circle cx="44" cy="42" r="3"/><circle cx="40" cy="40" r="2.5"/><circle cx="32" cy="20" r="2.5"/><circle cx="32" cy="30" r="2.5"/><circle cx="32" cy="40" r="2.5"/><circle cx="32" cy="48" r="2.5"/></g><g fill="#5fa347" opacity="0.85"><path d="M28 12 L24 8 L30 10 Z"/><path d="M38 20 L42 16 L40 22 Z"/><path d="M26 30 L22 26 L28 28 Z"/></g></svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><circle cx="32" cy="36" r="22" fill="#e8dcc0" stroke="#9e8868" stroke-width="1.3"/><circle cx="32" cy="36" r="18" fill="#f0e4c8" opacity="0.6"/><g stroke="#9e8868" stroke-width="0.7" fill="none" opacity="0.7"><path d="M14 28 Q20 26 24 30"/><path d="M38 26 Q46 28 50 34"/><path d="M14 44 Q22 48 28 44"/><path d="M38 46 Q46 44 50 40"/><path d="M18 36 Q24 38 26 34"/><path d="M42 36 Q46 32 48 36"/></g><path d="M32 14 Q28 10 26 12 Q28 14 28 16 Q30 14 32 18 Q34 14 36 16 Q36 14 38 12 Q34 10 32 14 Z" fill="#5fa347"/><path d="M32 18 L32 20" stroke="#3d7a2d" stroke-width="1" stroke-linecap="round"/><ellipse cx="22" cy="30" rx="3" ry="6" fill="#fff" opacity="0.3"/></svg>

After

Width:  |  Height:  |  Size: 727 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M14 22 L50 22 L47 52 Q47 54 45 54 L19 54 Q17 54 17 52 Z" fill="#fefcf4" stroke="#c9c3b3" stroke-width="1.3"/><ellipse cx="32" cy="22" rx="18" ry="4" fill="#f5f1e5" stroke="#c9c3b3" stroke-width="1.3"/><path d="M18 28 Q32 22 46 28 L46 34 Q32 30 18 34 Z" fill="#8bbf4f" opacity="0.3"/><rect x="24" y="36" width="16" height="10" rx="1" fill="#fff" stroke="#d4cfc0" stroke-width="0.6"/><text x="32" y="43" text-anchor="middle" font-family="sans-serif" font-size="4" fill="#7a9a5b" font-weight="bold">SEREK</text><ellipse cx="22" cy="26" rx="8" ry="1.5" fill="#fff" opacity="0.6"/></svg>

After

Width:  |  Height:  |  Size: 652 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M12 22 L52 22 L48 54 Q48 56 46 56 L18 56 Q16 56 16 54 Z" fill="#fefcf4" stroke="#b8b2a2" stroke-width="1.3"/><ellipse cx="32" cy="22" rx="20" ry="4" fill="#f0ebdd" stroke="#b8b2a2" stroke-width="1.3"/><g fill="#fff"><circle cx="22" cy="30" r="2"/><circle cx="28" cy="28" r="1.5"/><circle cx="34" cy="30" r="2.2"/><circle cx="40" cy="29" r="1.8"/><circle cx="25" cy="35" r="1.8"/><circle cx="32" cy="36" r="2"/><circle cx="38" cy="35" r="1.5"/><circle cx="43" cy="36" r="1.2"/><circle cx="22" cy="42" r="1.5"/><circle cx="28" cy="43" r="2"/><circle cx="35" cy="42" r="1.5"/><circle cx="40" cy="43" r="1.8"/><circle cx="30" cy="48" r="1.3"/><circle cx="36" cy="48" r="1.2"/></g><g fill="#e8e2d2" opacity="0.6"><circle cx="26" cy="33" r="0.6"/><circle cx="36" cy="39" r="0.6"/><circle cx="22" cy="46" r="0.6"/></g></svg>

After

Width:  |  Height:  |  Size: 887 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g fill="#f0e4c8" stroke="#a89778" stroke-width="0.6"><ellipse cx="18" cy="22" rx="2" ry="3.5" transform="rotate(20 18 22)"/><ellipse cx="26" cy="20" rx="2" ry="3.5" transform="rotate(-15 26 20)"/><ellipse cx="34" cy="22" rx="2" ry="3.5" transform="rotate(30 34 22)"/><ellipse cx="42" cy="20" rx="2" ry="3.5" transform="rotate(-25 42 20)"/><ellipse cx="48" cy="24" rx="2" ry="3.5" transform="rotate(15 48 24)"/><ellipse cx="16" cy="30" rx="2" ry="3.5" transform="rotate(-30 16 30)"/><ellipse cx="22" cy="30" rx="2" ry="3.5" transform="rotate(10 22 30)"/><ellipse cx="30" cy="30" rx="2" ry="3.5" transform="rotate(-20 30 30)"/><ellipse cx="38" cy="30" rx="2" ry="3.5" transform="rotate(25 38 30)"/><ellipse cx="46" cy="30" rx="2" ry="3.5" transform="rotate(-10 46 30)"/><ellipse cx="20" cy="38" rx="2" ry="3.5" transform="rotate(35 20 38)"/><ellipse cx="28" cy="40" rx="2" ry="3.5" transform="rotate(-15 28 40)"/><ellipse cx="36" cy="38" rx="2" ry="3.5" transform="rotate(20 36 38)"/><ellipse cx="44" cy="40" rx="2" ry="3.5" transform="rotate(-25 44 40)"/><ellipse cx="18" cy="46" rx="2" ry="3.5" transform="rotate(15 18 46)"/><ellipse cx="26" cy="48" rx="2" ry="3.5" transform="rotate(-20 26 48)"/><ellipse cx="34" cy="46" rx="2" ry="3.5" transform="rotate(30 34 46)"/><ellipse cx="42" cy="48" rx="2" ry="3.5" transform="rotate(-10 42 48)"/><ellipse cx="48" cy="44" rx="2" ry="3.5" transform="rotate(25 48 44)"/></g></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M14 20 L50 20 L47 54 Q47 56 45 56 L19 56 Q17 56 17 54 Z" fill="#fefcf4" stroke="#c9c3b3" stroke-width="1.3"/><ellipse cx="32" cy="20" rx="18" ry="4" fill="#f5f1e5" stroke="#c9c3b3" stroke-width="1.3"/><ellipse cx="32" cy="20" rx="15" ry="2.5" fill="#fff"/><rect x="22" y="28" width="20" height="14" rx="1" fill="#fff" stroke="#c9c3b3" stroke-width="0.8"/><text x="32" y="35" text-anchor="middle" font-family="sans-serif" font-size="4.5" fill="#2d1a0f" font-weight="bold">SKYR</text><rect x="24" y="37" width="16" height="3" fill="#4a2c1a" opacity="0.8"/><ellipse cx="24" cy="46" rx="4" ry="1" fill="#fff" opacity="0.6"/></svg>

After

Width:  |  Height:  |  Size: 696 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><rect x="26" y="8" width="12" height="6" rx="1" fill="#8b6f47"/><rect x="28" y="13" width="8" height="6" fill="#d4c4a0" stroke="#b0a080" stroke-width="1"/><path d="M20 20 Q20 18 22 18 L42 18 Q44 18 44 20 L44 52 Q44 56 40 56 L24 56 Q20 56 20 52 Z" fill="#4a2c1a" stroke="#2d1a0f" stroke-width="1.5"/><rect x="23" y="32" width="18" height="14" rx="1" fill="#f5f1e8"/><line x1="26" y1="36" x2="38" y2="36" stroke="#4a2c1a" stroke-width="1" stroke-linecap="round"/><line x1="26" y1="40" x2="35" y2="40" stroke="#8b6f47" stroke-width="0.8" stroke-linecap="round"/><line x1="26" y1="43" x2="36" y2="43" stroke="#8b6f47" stroke-width="0.8" stroke-linecap="round"/><rect x="22" y="22" width="2" height="26" rx="1" fill="#fff" opacity="0.2"/></svg>

After

Width:  |  Height:  |  Size: 800 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><rect x="28" y="8" width="8" height="4" rx="1" fill="#8b6f47"/><rect x="29" y="12" width="6" height="5" fill="#d4c4a0" stroke="#b0a080" stroke-width="0.8"/><path d="M22 18 Q22 16 24 16 L40 16 Q42 16 42 18 L44 26 L44 54 Q44 56 42 56 L22 56 Q20 56 20 54 L20 26 Z" fill="#c79968" stroke="#8b6a3f" stroke-width="1.3" stroke-linejoin="round"/><rect x="23" y="30" width="18" height="18" rx="1" fill="#f5f1e5" stroke="#c9c3b3" stroke-width="0.6"/><text x="32" y="37" text-anchor="middle" font-family="sans-serif" font-size="3.5" fill="#5fa347" font-weight="bold">AGAVE</text><g fill="#5fa347"><path d="M26 40 L28 38 L28 42 Z"/><path d="M30 40 L32 38 L32 42 Z"/><path d="M34 40 L36 38 L36 42 Z"/><path d="M38 40 L40 38 L40 42 Z"/></g><text x="32" y="46" text-anchor="middle" font-family="sans-serif" font-size="2.5" fill="#8b6a3f">SYRUP</text><rect x="22" y="20" width="2" height="32" fill="#fff" opacity="0.25"/></svg>

After

Width:  |  Height:  |  Size: 972 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><g stroke="#5fa347" stroke-width="2" fill="none" stroke-linecap="round"><path d="M20 54 Q18 40 22 14"/><path d="M26 54 Q24 38 28 12"/><path d="M32 54 Q32 38 34 10"/><path d="M38 54 Q38 38 40 14"/><path d="M44 54 Q44 40 42 16"/></g><g stroke="#3d6825" stroke-width="0.8" fill="none" stroke-linecap="round" opacity="0.7"><path d="M20 54 Q18 40 22 14"/><path d="M32 54 Q32 38 34 10"/><path d="M44 54 Q44 40 42 16"/></g><g fill="#5fa347"><circle cx="22" cy="14" r="1.5"/><circle cx="28" cy="12" r="1.5"/><circle cx="34" cy="10" r="1.5"/><circle cx="40" cy="14" r="1.5"/><circle cx="42" cy="16" r="1.5"/></g></svg>

After

Width:  |  Height:  |  Size: 670 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M12 28 Q16 20 28 18 Q42 18 52 28 Q54 36 48 44 Q40 52 28 52 Q14 48 10 38 Q10 32 12 28 Z" fill="#d46670" stroke="#9e3a47" stroke-width="1.3"/><path d="M16 32 Q24 26 36 28 Q46 30 48 38 Q44 46 32 46 Q20 44 16 36 Z" fill="#e08891" opacity="0.7"/><g fill="#f5f1e5" opacity="0.85"><path d="M18 34 Q26 32 32 36 Q38 38 42 40" stroke="#f5f1e5" stroke-width="1.5" fill="none"/><path d="M16 40 Q24 38 30 42 Q36 44 40 44" stroke="#f5f1e5" stroke-width="1.2" fill="none"/><path d="M22 28 Q30 28 36 32" stroke="#f5f1e5" stroke-width="1" fill="none"/><path d="M26 46 Q32 46 38 44" stroke="#f5f1e5" stroke-width="0.8" fill="none"/></g></svg>

After

Width:  |  Height:  |  Size: 694 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><ellipse cx="34" cy="34" rx="20" ry="15" fill="#f2c4a8" stroke="#d19878" stroke-width="1.2"/><ellipse cx="30" cy="30" rx="20" ry="15" fill="#f8d4bc" stroke="#d19878" stroke-width="1.2"/><g fill="#e3a889" opacity="0.7"><ellipse cx="22" cy="26" rx="3" ry="1.5" transform="rotate(-20 22 26)"/><ellipse cx="36" cy="28" rx="2.5" ry="1.2" transform="rotate(15 36 28)"/><ellipse cx="28" cy="34" rx="4" ry="1.3" transform="rotate(-10 28 34)"/><ellipse cx="38" cy="34" rx="2" ry="1" transform="rotate(20 38 34)"/><ellipse cx="24" cy="38" rx="3" ry="1.2" transform="rotate(5 24 38)"/></g><ellipse cx="24" cy="24" rx="5" ry="2" fill="#fff" opacity="0.3"/></svg>

After

Width:  |  Height:  |  Size: 711 B

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M38 22 Q48 22 48 34 Q48 48 38 52 Q32 50 32 42 Q32 30 38 22 Z" fill="#c8253a"/><path d="M22 24 Q14 24 14 36 Q14 50 24 54 Q34 50 34 38 Q34 28 22 24 Z" fill="#e63946"/><g fill="#fff3b0"><ellipse cx="20" cy="32" rx="0.8" ry="1.3" transform="rotate(20 20 32)"/><ellipse cx="26" cy="34" rx="0.8" ry="1.3" transform="rotate(-10 26 34)"/><ellipse cx="18" cy="38" rx="0.8" ry="1.3" transform="rotate(25 18 38)"/><ellipse cx="24" cy="42" rx="0.8" ry="1.3" transform="rotate(-15 24 42)"/><ellipse cx="29" cy="40" rx="0.8" ry="1.3" transform="rotate(5 29 40)"/><ellipse cx="20" cy="46" rx="0.8" ry="1.3" transform="rotate(30 20 46)"/><ellipse cx="26" cy="48" rx="0.8" ry="1.3" transform="rotate(-5 26 48)"/></g><g fill="#fff3b0" opacity="0.9"><ellipse cx="40" cy="32" rx="0.7" ry="1.1"/><ellipse cx="44" cy="38" rx="0.7" ry="1.1"/><ellipse cx="41" cy="44" rx="0.7" ry="1.1"/></g><g fill="#5fa347"><path d="M22 24 L18 16 L22 20 L22 14 L26 20 L30 16 L26 24 Z"/><path d="M38 22 L34 15 L38 19 L38 13 L42 18 L46 14 L42 22 Z" opacity="0.85"/></g></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M32 56 Q30 42 28 30 Q26 18 24 10" stroke="#6b4a28" stroke-width="1.5" fill="none" stroke-linecap="round"/><path d="M32 56 Q34 42 36 30 Q38 18 40 10" stroke="#6b4a28" stroke-width="1.5" fill="none" stroke-linecap="round"/><g fill="#5fa347" stroke="#3d6825" stroke-width="0.6"><ellipse cx="22" cy="14" rx="1.5" ry="2.5" transform="rotate(-20 22 14)"/><ellipse cx="26" cy="18" rx="1.5" ry="2.5" transform="rotate(20 26 18)"/><ellipse cx="22" cy="22" rx="1.5" ry="2.5" transform="rotate(-30 22 22)"/><ellipse cx="26" cy="26" rx="1.5" ry="2.5" transform="rotate(15 26 26)"/><ellipse cx="24" cy="32" rx="1.5" ry="2.5" transform="rotate(-25 24 32)"/><ellipse cx="28" cy="36" rx="1.5" ry="2.5" transform="rotate(20 28 36)"/><ellipse cx="26" cy="42" rx="1.5" ry="2.5" transform="rotate(-15 26 42)"/><ellipse cx="30" cy="48" rx="1.5" ry="2.5" transform="rotate(25 30 48)"/><ellipse cx="42" cy="14" rx="1.5" ry="2.5" transform="rotate(20 42 14)"/><ellipse cx="38" cy="18" rx="1.5" ry="2.5" transform="rotate(-20 38 18)"/><ellipse cx="42" cy="22" rx="1.5" ry="2.5" transform="rotate(30 42 22)"/><ellipse cx="38" cy="26" rx="1.5" ry="2.5" transform="rotate(-15 38 26)"/><ellipse cx="40" cy="32" rx="1.5" ry="2.5" transform="rotate(25 40 32)"/><ellipse cx="36" cy="36" rx="1.5" ry="2.5" transform="rotate(-20 36 36)"/><ellipse cx="38" cy="42" rx="1.5" ry="2.5" transform="rotate(15 38 42)"/><ellipse cx="34" cy="48" rx="1.5" ry="2.5" transform="rotate(-25 34 48)"/></g></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M14 34 Q12 24 22 18 Q32 14 44 18 Q54 22 54 32 Q56 44 46 50 Q34 54 22 50 Q12 44 14 34 Z" fill="#c7a074" stroke="#8b6a3f" stroke-width="1.3"/><path d="M20 30 Q28 24 36 26 Q46 28 48 36 Q44 42 34 42 Q22 40 20 34 Z" fill="#d8b890" opacity="0.6"/><g fill="#8b6a3f" opacity="0.7"><ellipse cx="22" cy="28" rx="1.5" ry="1"/><ellipse cx="30" cy="38" rx="1.2" ry="0.8"/><ellipse cx="42" cy="32" rx="1.3" ry="0.8"/><ellipse cx="36" cy="44" rx="1" ry="0.8"/><ellipse cx="48" cy="40" rx="1.2" ry="0.8"/></g><g fill="#6b4a28" opacity="0.5"><circle cx="24" cy="34" r="0.6"/><circle cx="38" cy="30" r="0.6"/><circle cx="30" cy="44" r="0.6"/><circle cx="44" cy="46" r="0.6"/></g><ellipse cx="24" cy="26" rx="5" ry="2" fill="#fff" opacity="0.25"/></svg>

After

Width:  |  Height:  |  Size: 804 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 51 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 45 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 48 KiB

View File

@@ -624,7 +624,7 @@
</div> </div>
<script> <script>
const APP_ASSET_VERSION = '20260416-164'; const APP_ASSET_VERSION = '20260417-svg6';
const APP_VERSION_STORAGE_KEY = 'recipe-app-asset-version'; const APP_VERSION_STORAGE_KEY = 'recipe-app-asset-version';
const APP_VERSION_QUERY_KEY = 'appv'; const APP_VERSION_QUERY_KEY = 'appv';

View File

@@ -38,7 +38,6 @@ export const INGREDIENTS = {
/* ── Nabiał ───────────────────────────────────────── */ /* ── Nabiał ───────────────────────────────────────── */
jajko: { jajko: {
id: 'jajko', id: 'jajko',
image: 'images/ingredients/jajko.jpg',
name: 'Jajka', name: 'Jajka',
category: 'nabial', category: 'nabial',
pantryUnit: 'szt', pantryUnit: 'szt',
@@ -120,7 +119,6 @@ export const INGREDIENTS = {
}, },
losos_wedzony: { losos_wedzony: {
id: 'losos_wedzony', id: 'losos_wedzony',
image: 'images/ingredients/losos_wedzony.jpg',
name: 'Łosoś wędzony', name: 'Łosoś wędzony',
category: 'mieso_ryby', category: 'mieso_ryby',
pantryUnit: 'g', pantryUnit: 'g',
@@ -138,7 +136,6 @@ export const INGREDIENTS = {
/* ── Warzywa ──────────────────────────────────────── */ /* ── Warzywa ──────────────────────────────────────── */
pomidor: { pomidor: {
id: 'pomidor', id: 'pomidor',
image: 'images/ingredients/pomidor.jpg',
name: 'Pomidor', name: 'Pomidor',
category: 'warzywa', category: 'warzywa',
pantryUnit: 'szt', pantryUnit: 'szt',
@@ -147,7 +144,6 @@ export const INGREDIENTS = {
}, },
pomidorki_koktajlowe: { pomidorki_koktajlowe: {
id: 'pomidorki_koktajlowe', id: 'pomidorki_koktajlowe',
image: 'images/ingredients/pomidorki_koktajlowe.jpg',
name: 'Pomidorki koktajlowe', name: 'Pomidorki koktajlowe',
category: 'warzywa', category: 'warzywa',
pantryUnit: 'g', pantryUnit: 'g',
@@ -156,7 +152,6 @@ export const INGREDIENTS = {
}, },
papryka_czerwona: { papryka_czerwona: {
id: 'papryka_czerwona', id: 'papryka_czerwona',
image: 'images/ingredients/papryka_czerwona.jpg',
name: 'Papryka czerwona', name: 'Papryka czerwona',
category: 'warzywa', category: 'warzywa',
pantryUnit: 'szt', pantryUnit: 'szt',
@@ -165,7 +160,6 @@ export const INGREDIENTS = {
}, },
ogorek: { ogorek: {
id: 'ogorek', id: 'ogorek',
image: 'images/ingredients/ogorek.jpg',
name: 'Ogórek', name: 'Ogórek',
category: 'warzywa', category: 'warzywa',
pantryUnit: 'szt', pantryUnit: 'szt',
@@ -174,7 +168,6 @@ export const INGREDIENTS = {
}, },
czosnek: { czosnek: {
id: 'czosnek', id: 'czosnek',
image: 'images/ingredients/czosnek.jpg',
name: 'Czosnek', name: 'Czosnek',
category: 'warzywa', category: 'warzywa',
pantryUnit: 'szt', pantryUnit: 'szt',
@@ -253,7 +246,6 @@ export const INGREDIENTS = {
/* ── Owoce ────────────────────────────────────────── */ /* ── Owoce ────────────────────────────────────────── */
truskawki: { truskawki: {
id: 'truskawki', id: 'truskawki',
image: 'images/ingredients/truskawki.jpg',
name: 'Truskawki', name: 'Truskawki',
category: 'owoce', category: 'owoce',
pantryUnit: 'g', pantryUnit: 'g',
@@ -261,7 +253,6 @@ export const INGREDIENTS = {
}, },
borowki_amerykanskie: { borowki_amerykanskie: {
id: 'borowki_amerykanskie', id: 'borowki_amerykanskie',
image: 'images/ingredients/borowki_amerykanskie.jpg',
name: 'Borówki amerykańskie', name: 'Borówki amerykańskie',
category: 'owoce', category: 'owoce',
pantryUnit: 'g', pantryUnit: 'g',
@@ -269,7 +260,6 @@ export const INGREDIENTS = {
}, },
banany: { banany: {
id: 'banany', id: 'banany',
image: 'images/ingredients/banany.jpg',
name: 'Banany', name: 'Banany',
category: 'owoce', category: 'owoce',
pantryUnit: 'g', pantryUnit: 'g',
@@ -277,7 +267,6 @@ export const INGREDIENTS = {
}, },
jagody: { jagody: {
id: 'jagody', id: 'jagody',
image: 'images/ingredients/jagody.jpg',
name: 'Jagody', name: 'Jagody',
category: 'owoce', category: 'owoce',
pantryUnit: 'g', pantryUnit: 'g',
@@ -301,7 +290,6 @@ export const INGREDIENTS = {
/* ── Suche i kasze ────────────────────────────────── */ /* ── Suche i kasze ────────────────────────────────── */
makaron_suchy: { makaron_suchy: {
id: 'makaron_suchy', id: 'makaron_suchy',
image: 'images/ingredients/makaron_suchy.jpg',
name: 'Makaron', name: 'Makaron',
category: 'suche', category: 'suche',
pantryUnit: 'g', pantryUnit: 'g',
@@ -337,7 +325,6 @@ export const INGREDIENTS = {
}, },
migdaly: { migdaly: {
id: 'migdaly', id: 'migdaly',
image: 'images/ingredients/migdaly.jpg',
name: 'Migdały', name: 'Migdały',
category: 'suche', category: 'suche',
pantryUnit: 'g', pantryUnit: 'g',
@@ -448,7 +435,6 @@ export const INGREDIENTS = {
}, },
oliwa: { oliwa: {
id: 'oliwa', id: 'oliwa',
image: 'images/ingredients/oliwa.jpg',
name: 'Oliwa z oliwek', name: 'Oliwa z oliwek',
category: 'inne', category: 'inne',
pantryUnit: 'ml', pantryUnit: 'ml',
@@ -456,7 +442,6 @@ export const INGREDIENTS = {
}, },
hummus: { hummus: {
id: 'hummus', id: 'hummus',
image: 'images/ingredients/hummus.jpg',
name: 'Hummus', name: 'Hummus',
category: 'inne', category: 'inne',
pantryUnit: 'g', pantryUnit: 'g',
@@ -528,6 +513,10 @@ export const INGREDIENTS = {
}, },
}; };
for (const [id, def] of Object.entries(INGREDIENTS)) {
def.image = `icons/ingredients/${id}.svg`;
}
/** /**
* @typedef {{ ingredientId: string, amount: number, unit: string, alternatives?: string[] }} RecipeIngredientDef * @typedef {{ ingredientId: string, amount: number, unit: string, alternatives?: string[] }} RecipeIngredientDef
* @typedef {{ id: string, title: string, minutes: number, thumbLabel: string, image?: string, allowedSlots: string[], tags?: string[], nutritionPerServing: NutritionPer100, ingredients: RecipeIngredientDef[], steps: string[] }} RecipeDef * @typedef {{ id: string, title: string, minutes: number, thumbLabel: string, image?: string, allowedSlots: string[], tags?: string[], nutritionPerServing: NutritionPer100, ingredients: RecipeIngredientDef[], steps: string[] }} RecipeDef

View File

@@ -1,4 +1,4 @@
import { INGREDIENTS, CATEGORY_LABELS, PRODUCTS, ingredientHasProducts } from '../data/catalog.js?v=8'; import { INGREDIENTS, CATEGORY_LABELS, PRODUCTS, ingredientHasProducts } from '../data/catalog.js?v=9';
import { PANTRY_STORAGE_KEY, PANTRY_STORAGE_KEY_V2, SHOPPING_STORAGE_KEY } from '../storageKeys.js'; import { PANTRY_STORAGE_KEY, PANTRY_STORAGE_KEY_V2, SHOPPING_STORAGE_KEY } from '../storageKeys.js';
export const KITCHEN_LIST_ID = 'kitchen'; export const KITCHEN_LIST_ID = 'kitchen';

View File

@@ -1,4 +1,4 @@
import { INGREDIENTS, RECIPES, PRODUCTS, getProductsForIngredient } from '../data/catalog.js?v=8'; import { INGREDIENTS, RECIPES, PRODUCTS, getProductsForIngredient } from '../data/catalog.js?v=9';
import { MEAL_SLOTS } from '../planner/mealSlots.js'; import { MEAL_SLOTS } from '../planner/mealSlots.js';
import { addDays } from './dateUtils.js'; import { addDays } from './dateUtils.js';
import { dateKey, getDayPlan } from './planStore.js?v=2'; import { dateKey, getDayPlan } from './planStore.js?v=2';

View File

@@ -1,4 +1,4 @@
import { INGREDIENTS, RECIPES, PRODUCTS } from '../data/catalog.js?v=8'; import { INGREDIENTS, RECIPES, PRODUCTS } from '../data/catalog.js?v=9';
import { MEAL_SLOTS } from '../planner/mealSlots.js'; import { MEAL_SLOTS } from '../planner/mealSlots.js';
import { PLANS_STORAGE_KEY } from '../storageKeys.js'; import { PLANS_STORAGE_KEY } from '../storageKeys.js';
import { startOfDay } from './dateUtils.js'; import { startOfDay } from './dateUtils.js';

View File

@@ -5,7 +5,7 @@ import {
getProductsForIngredient, getProductsForIngredient,
ingredientHasProducts, ingredientHasProducts,
pantryQtyStep, pantryQtyStep,
} from '../data/catalog.js?v=8'; } from '../data/catalog.js?v=9';
import { import {
addOrMergeShoppingLines, addOrMergeShoppingLines,
KITCHEN_LIST_ID, KITCHEN_LIST_ID,
@@ -76,7 +76,8 @@ function macroLine(n) {
function mediaHtml(image, icon, sizeClass = 'w-9 h-9', radiusClass = 'rounded-lg') { function mediaHtml(image, icon, sizeClass = 'w-9 h-9', radiusClass = 'rounded-lg') {
if (image) { if (image) {
return `<img src="${esc(image)}" alt="" class="${sizeClass} ${radiusClass} object-cover shrink-0">`; const fit = image.endsWith('.svg') ? 'object-contain' : 'object-cover';
return `<img src="${esc(image)}" alt="" class="${sizeClass} ${radiusClass} ${fit} shrink-0">`;
} }
return `<div class="${sizeClass} ${radiusClass} flex items-center justify-center shrink-0" style="background:#2f2f2d;"><i class="fas ${icon} text-sm" style="color:#8f8b84;"></i></div>`; return `<div class="${sizeClass} ${radiusClass} flex items-center justify-center shrink-0" style="background:#2f2f2d;"><i class="fas ${icon} text-sm" style="color:#8f8b84;"></i></div>`;
} }
@@ -154,30 +155,35 @@ export function getIngredientCardHTML({
overlayStyle = 'pointer-events:none; background:rgba(0,0,0,0.5);', overlayStyle = 'pointer-events:none; background:rgba(0,0,0,0.5);',
cardClass = 'relative w-full max-w-xs rounded-2xl shadow-2xl overflow-hidden', cardClass = 'relative w-full max-w-xs rounded-2xl shadow-2xl overflow-hidden',
cardStyle = 'background:#2d2e2b; pointer-events:auto; max-height:85vh; overflow-y:auto; transform:translateY(0.75rem); opacity:0; transition:transform 220ms ease, opacity 220ms ease;', cardStyle = 'background:#2d2e2b; pointer-events:auto; max-height:85vh; overflow-y:auto; transform:translateY(0.75rem); opacity:0; transition:transform 220ms ease, opacity 220ms ease;',
heroHeightClass = 'h-[180px]',
} = {}) { } = {}) {
if (!idBase) throw new Error('getIngredientCardHTML requires idBase'); if (!idBase) throw new Error('getIngredientCardHTML requires idBase');
return ` return `
<div id="${idBase}-overlay" class="${overlayClass}" style="${overlayStyle}"> <div id="${idBase}-overlay" class="${overlayClass}" style="${overlayStyle}">
<div id="${idBase}" class="${cardClass}" style="${cardStyle}"> <div id="${idBase}" class="${cardClass}" style="${cardStyle}">
<div id="${idBase}-hero" class="relative w-full ${heroHeightClass} overflow-hidden" style="background:#393937;"> <div class="relative px-4 pt-4 pb-2">
<img id="${idBase}-img" class="w-full h-full object-cover hidden" alt="" /> <div class="flex items-start gap-3 pr-10">
<div id="${idBase}-fallback" class="w-full h-full flex items-center justify-center"> <div id="${idBase}-hero" class="relative w-20 h-20 rounded-2xl flex items-center justify-center shrink-0 overflow-hidden" style="background:#393937;">
<i id="${idBase}-fallback-icon" class="fas fa-box-open text-3xl" style="color:#6d6c67;"></i> <img id="${idBase}-img" class="w-full h-full hidden" alt="" />
<div id="${idBase}-fallback" class="absolute inset-0 flex items-center justify-center">
<i id="${idBase}-fallback-icon" class="fas fa-box-open text-2xl" style="color:#6d6c67;"></i>
</div> </div>
<button type="button" id="${idBase}-back" class="absolute top-3 left-3 w-8 h-8 rounded-full hidden flex items-center justify-center" style="background:rgba(0,0,0,0.5); color:#fff;" aria-label="Wróć do składnika">
<i class="fas fa-chevron-left text-sm"></i>
</button>
<button type="button" id="${idBase}-close" class="absolute top-3 right-3 w-8 h-8 rounded-full flex items-center justify-center" style="background:rgba(0,0,0,0.5); color:#fff;" aria-label="Zamknij">
<i class="fas fa-times text-sm"></i>
</button>
</div> </div>
<div class="px-4 pt-3 pb-4 space-y-3"> <div class="flex-1 min-w-0 pt-0.5">
<div> <div class="flex items-center gap-1.5">
<p id="${idBase}-category" class="text-[10px] font-semibold uppercase tracking-wider" style="color:#6ee7b7;"></p> <button type="button" id="${idBase}-back" class="hidden w-5 h-5 rounded-full items-center justify-center shrink-0" style="background:#393937; color:#ddd6ca;" aria-label="Wróć do składnika">
<i class="fas fa-chevron-left text-[9px]"></i>
</button>
<p id="${idBase}-category" class="text-[10px] font-semibold uppercase tracking-wider truncate" style="color:#6ee7b7;"></p>
</div>
<h3 id="${idBase}-name" class="text-[15px] font-bold leading-snug mt-0.5" style="color:#ddd6ca;"></h3> <h3 id="${idBase}-name" class="text-[15px] font-bold leading-snug mt-0.5" style="color:#ddd6ca;"></h3>
<p id="${idBase}-subtitle" class="text-[11px] mt-0.5 hidden" style="color:#9b978f;"></p> <p id="${idBase}-subtitle" class="text-[11px] mt-0.5 hidden" style="color:#9b978f;"></p>
</div> </div>
</div>
<button type="button" id="${idBase}-close" class="absolute top-3 right-3 w-8 h-8 rounded-full flex items-center justify-center" style="background:#393937; color:#ddd6ca;" aria-label="Zamknij">
<i class="fas fa-times text-sm"></i>
</button>
</div>
<div class="px-4 pt-2 pb-4 space-y-3">
<div id="${idBase}-nutrition"></div> <div id="${idBase}-nutrition"></div>
<div id="${idBase}-stock"></div> <div id="${idBase}-stock"></div>
<div id="${idBase}-products"></div> <div id="${idBase}-products"></div>
@@ -239,23 +245,22 @@ export function createIngredientCardController({ idBase, defaultSourceNote = 'Ze
const fallback = el('fallback'); const fallback = el('fallback');
const fallbackIcon = el('fallback-icon'); const fallbackIcon = el('fallback-icon');
if (heroEl) {
heroEl.style.height = '';
heroEl.style.background = '#393937';
}
if (img && fallback) { if (img && fallback) {
const image = isListMode ? def.image : (product?.image || def.image); const image = isListMode ? def.image : (product?.image || def.image);
const altName = isListMode ? def.name : (product?.name || def.name); const altName = isListMode ? def.name : (product?.name || def.name);
if (image) { if (image) {
img.src = image; img.src = image;
img.alt = altName; img.alt = altName;
const isSvg = image.endsWith('.svg');
img.classList.toggle('object-contain', isSvg);
img.classList.toggle('object-cover', !isSvg);
img.style.padding = isSvg ? '4px' : '';
img.classList.remove('hidden'); img.classList.remove('hidden');
fallback.classList.add('hidden'); fallback.classList.add('hidden');
} else { } else {
img.classList.add('hidden'); img.classList.add('hidden');
fallback.classList.remove('hidden'); fallback.classList.remove('hidden');
if (fallbackIcon) fallbackIcon.className = `fas ${icon} text-3xl`; if (fallbackIcon) fallbackIcon.className = `fas ${icon} text-2xl`;
} }
} }
@@ -286,6 +291,7 @@ export function createIngredientCardController({ idBase, defaultSourceNote = 'Ze
if (backBtn) { if (backBtn) {
backBtn.classList.toggle('hidden', !isBackAvailable); backBtn.classList.toggle('hidden', !isBackAvailable);
backBtn.classList.toggle('flex', Boolean(isBackAvailable));
} }
} }

View File

@@ -1,4 +1,4 @@
import { INGREDIENTS, RECIPES, PRODUCTS, getProductsForIngredient } from '../data/catalog.js?v=8'; import { INGREDIENTS, RECIPES, PRODUCTS, getProductsForIngredient } from '../data/catalog.js?v=9';
import { MEAL_SLOTS } from '../planner/mealSlots.js'; import { MEAL_SLOTS } from '../planner/mealSlots.js';
import { import {
addDays, addDays,
@@ -24,7 +24,7 @@ import {
renderCalendarGrid, renderCalendarGrid,
syncCalendarTodayButton, syncCalendarTodayButton,
} from './mealCalendar.js?v=11'; } from './mealCalendar.js?v=11';
import { createIngredientCardController, getIngredientCardHTML } from './ingredientCard.js?v=20260417-113'; import { createIngredientCardController, getIngredientCardHTML } from './ingredientCard.js?v=20260417-116';
function esc(s) { function esc(s) {
return String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;'); return String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');

View File

@@ -1,4 +1,4 @@
import { RECIPES } from '../data/catalog.js?v=8'; import { RECIPES } from '../data/catalog.js?v=9';
import { MEAL_SLOTS } from '../planner/mealSlots.js'; import { MEAL_SLOTS } from '../planner/mealSlots.js';
import { applyFilters, getFilterState } from './RecipeList.js'; import { applyFilters, getFilterState } from './RecipeList.js';

View File

@@ -1,4 +1,4 @@
import { INGREDIENTS, RECIPES } from '../data/catalog.js?v=8'; import { INGREDIENTS, RECIPES } from '../data/catalog.js?v=9';
import { MEAL_SLOTS } from '../planner/mealSlots.js'; import { MEAL_SLOTS } from '../planner/mealSlots.js';
import { import {
addMonths, addMonths,

View File

@@ -1,7 +1,7 @@
import { import {
INGREDIENTS, INGREDIENTS,
CATEGORY_LABELS, CATEGORY_LABELS,
} from '../data/catalog.js?v=8'; } from '../data/catalog.js?v=9';
import { loadPantry, getPantryTotal } from '../services/pantryShopping.js?v=2'; import { loadPantry, getPantryTotal } from '../services/pantryShopping.js?v=2';
import { loadPlans } from '../services/planStore.js?v=2'; import { loadPlans } from '../services/planStore.js?v=2';
import { addDays, addMonths, sameDay, sameMonth, startOfDay, startOfMonth } from '../services/dateUtils.js'; import { addDays, addMonths, sameDay, sameMonth, startOfDay, startOfMonth } from '../services/dateUtils.js';
@@ -13,7 +13,7 @@ import {
renderCalendarGrid, renderCalendarGrid,
syncCalendarTodayButton, syncCalendarTodayButton,
} from '../ui/mealCalendar.js?v=11'; } from '../ui/mealCalendar.js?v=11';
import { createIngredientCardController, getIngredientCardHTML } from '../ui/ingredientCard.js?v=20260417-113'; import { createIngredientCardController, getIngredientCardHTML } from '../ui/ingredientCard.js?v=20260417-116';
/* ── helpers ── */ /* ── helpers ── */
@@ -550,6 +550,7 @@ function classifyIngredients(searchQuery) {
name: def.name, name: def.name,
qty: getPantryTotal(id, pantry), qty: getPantryTotal(id, pantry),
unit: def.pantryUnit, unit: def.pantryUnit,
image: def.image || null,
icon: CATEGORY_ICONS[def.category] || 'fa-jar', icon: CATEGORY_ICONS[def.category] || 'fa-jar',
}; };
}) })
@@ -560,14 +561,19 @@ function classifyIngredients(searchQuery) {
/* ══════════════════════ TILE RENDERING ══════════════════════ */ /* ══════════════════════ TILE RENDERING ══════════════════════ */
function tileIconHtml(item) {
if (item.image) {
return `<div class="w-6 h-6 rounded-md shrink-0 overflow-hidden" style="background:#2f2f2d;"><img src="${esc(item.image)}" alt="" class="w-full h-full object-contain" style="padding:1px;"></div>`;
}
return `<div class="w-6 h-6 rounded-md flex items-center justify-center shrink-0" style="background:#2f2f2d;"><i class="fas ${item.icon} text-[11px]" style="color:#7d7a74;"></i></div>`;
}
function shortfallTileHtml(item) { function shortfallTileHtml(item) {
const clamp = item.name.length > 25 ? ' min-w-0' : ''; const clamp = item.name.length > 25 ? ' min-w-0' : '';
return ` return `
<button type="button" class="pv2-tile text-left rounded-2xl flex flex-col gap-2 px-2.5 py-2${clamp} transition-all active:scale-[0.98]" style="flex:1 0 6rem; background:#393937; border:none; box-shadow:0 2px 8px rgba(0,0,0,0.28);" data-id="${esc(item.ingredientId)}"> <button type="button" class="pv2-tile text-left rounded-2xl flex flex-col gap-2 px-2.5 py-2${clamp} transition-all active:scale-[0.98]" style="flex:1 0 auto; min-width:6rem; max-width:100%; background:#393937; border:none; box-shadow:0 2px 8px rgba(0,0,0,0.28);" data-id="${esc(item.ingredientId)}">
<div class="flex items-center gap-1.5 min-w-0"> <div class="flex items-center gap-1.5 min-w-0">
<div class="w-6 h-6 rounded-md flex items-center justify-center shrink-0" style="background:#2f2f2d;"> ${tileIconHtml(item)}
<i class="fas ${item.icon} text-[11px]" style="color:${SHORTFALL_ACCENT};"></i>
</div>
<p class="text-[11px] font-normal leading-tight truncate min-w-0" style="color:#ddd6ca;">${esc(item.name)}</p> <p class="text-[11px] font-normal leading-tight truncate min-w-0" style="color:#ddd6ca;">${esc(item.name)}</p>
</div> </div>
<div class="w-full flex items-center gap-2"> <div class="w-full flex items-center gap-2">
@@ -582,11 +588,9 @@ function shortfallTileHtml(item) {
function sufficientTileHtml(item) { function sufficientTileHtml(item) {
const clamp = item.name.length > 25 ? ' min-w-0' : ''; const clamp = item.name.length > 25 ? ' min-w-0' : '';
return ` return `
<button type="button" class="pv2-tile text-left rounded-2xl flex flex-col gap-2 px-2.5 py-2${clamp} transition-all active:scale-[0.98]" style="flex:1 0 6rem; background:#393937; border:none; box-shadow:0 2px 8px rgba(0,0,0,0.28);" data-id="${esc(item.ingredientId)}"> <button type="button" class="pv2-tile text-left rounded-2xl flex flex-col gap-2 px-2.5 py-2${clamp} transition-all active:scale-[0.98]" style="flex:1 0 auto; min-width:6rem; max-width:100%; background:#393937; border:none; box-shadow:0 2px 8px rgba(0,0,0,0.28);" data-id="${esc(item.ingredientId)}">
<div class="flex items-center gap-1.5 min-w-0"> <div class="flex items-center gap-1.5 min-w-0">
<div class="w-6 h-6 rounded-md flex items-center justify-center shrink-0" style="background:#2f2f2d;"> ${tileIconHtml(item)}
<i class="fas ${item.icon} text-[11px]" style="color:#6ee7b7;"></i>
</div>
<p class="text-[11px] font-normal leading-tight truncate min-w-0" style="color:#ddd6ca;">${esc(item.name)}</p> <p class="text-[11px] font-normal leading-tight truncate min-w-0" style="color:#ddd6ca;">${esc(item.name)}</p>
</div> </div>
<div class="w-full flex items-center gap-2"> <div class="w-full flex items-center gap-2">
@@ -602,10 +606,8 @@ function notPlannedChipHtml(item) {
const hasStock = item.qty > 0; const hasStock = item.qty > 0;
const clamp = item.name.length > 25 ? ' min-w-0' : ''; const clamp = item.name.length > 25 ? ' min-w-0' : '';
return ` return `
<button type="button" class="pv2-tile text-left rounded-2xl flex items-center gap-1.5 px-2.5 py-2${clamp} transition-all active:scale-[0.98]" style="flex:1 0 6rem; background:#393937; border:none; box-shadow:0 2px 8px rgba(0,0,0,0.28);" data-id="${esc(item.ingredientId)}"> <button type="button" class="pv2-tile text-left rounded-2xl flex items-center gap-1.5 px-2.5 py-2${clamp} transition-all active:scale-[0.98]" style="flex:1 0 auto; min-width:6rem; max-width:100%; background:#393937; border:none; box-shadow:0 2px 8px rgba(0,0,0,0.28);" data-id="${esc(item.ingredientId)}">
<div class="w-6 h-6 rounded-md flex items-center justify-center shrink-0" style="background:#2f2f2d;"> ${tileIconHtml(item)}
<i class="fas ${item.icon} text-[11px]" style="color:#7d7a74;"></i>
</div>
<p class="text-[11px] font-normal leading-tight truncate min-w-0" style="color:${hasStock ? '#b7ada1' : '#9b978f'};">${esc(item.name)}</p> <p class="text-[11px] font-normal leading-tight truncate min-w-0" style="color:${hasStock ? '#b7ada1' : '#9b978f'};">${esc(item.name)}</p>
<span class="text-[10px] font-semibold tabular-nums shrink-0 ml-auto" style="color:${hasStock ? '#9b978f' : '#6d6c67'};">${esc(formatQty(item.qty))} ${esc(unitLabel(item.unit))}</span> <span class="text-[10px] font-semibold tabular-nums shrink-0 ml-auto" style="color:${hasStock ? '#9b978f' : '#6d6c67'};">${esc(formatQty(item.qty))} ${esc(unitLabel(item.unit))}</span>
</button>`; </button>`;

View File

@@ -1,5 +1,5 @@
import { RECIPES, INGREDIENTS, PRODUCTS } from '../data/catalog.js?v=8'; import { RECIPES, INGREDIENTS, PRODUCTS } from '../data/catalog.js?v=9';
import { createIngredientCardController, getIngredientCardHTML } from '../ui/ingredientCard.js?v=20260417-113'; import { createIngredientCardController, getIngredientCardHTML } from '../ui/ingredientCard.js?v=20260417-116';
function escapeHtml(s) { function escapeHtml(s) {
return String(s) return String(s)

View File

@@ -1,4 +1,4 @@
import { RECIPES } from '../data/catalog.js?v=8'; import { RECIPES } from '../data/catalog.js?v=9';
import { getRecipeGridSectionHTML, renderRecipeGrid } from '../ui/recipeGrid.js'; import { getRecipeGridSectionHTML, renderRecipeGrid } from '../ui/recipeGrid.js';
const DEFAULT_MIN_MINUTES = 5; const DEFAULT_MIN_MINUTES = 5;

View File

@@ -1,4 +1,4 @@
import { INGREDIENTS, CATEGORY_LABELS } from '../data/catalog.js?v=8'; import { INGREDIENTS, CATEGORY_LABELS } from '../data/catalog.js?v=9';
import { import {
KITCHEN_LIST_ID, KITCHEN_LIST_ID,
loadShoppingState, loadShoppingState,
@@ -98,8 +98,9 @@ function itemRowHtml(item) {
const image = def?.image; const image = def?.image;
const checked = item.checked; const checked = item.checked;
const mediaFit = image && image.endsWith('.svg') ? 'object-contain' : 'object-cover';
const mediaHtml = image const mediaHtml = image
? `<img src="${esc(image)}" alt="" class="w-8 h-8 rounded-lg object-cover shrink-0">` ? `<img src="${esc(image)}" alt="" class="w-8 h-8 rounded-lg ${mediaFit} shrink-0">`
: `<div class="w-8 h-8 rounded-lg flex items-center justify-center shrink-0" style="background:#2f2f2d;"><i class="fas ${icon} text-xs" style="color:#8f8b84;"></i></div>`; : `<div class="w-8 h-8 rounded-lg flex items-center justify-center shrink-0" style="background:#2f2f2d;"><i class="fas ${icon} text-xs" style="color:#8f8b84;"></i></div>`;
return ` return `