feat: chytání motýlků síťkou s počítadlem

Přidána síťka, kterou lze uchopit myší a lovit poletující motýly. Po chycení přiletí nový (počet létajících se nemění), počet ulovených se zobrazuje jako odznak a ukládá do local storage. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-21 10:08:47 +02:00
parent 146c31b775
commit c8c5ecc60c
4 changed files with 440 additions and 5 deletions
@@ -0,0 +1,106 @@
+<svg xmlns="http://www.w3.org/2000/svg"
+     viewBox="0 0 100 100"
+     width="100"
+     height="100">
+
+    <defs>
+        <linearGradient id="netFill" x1="0" y1="0" x2="0.4" y2="1">
+            <stop offset="0%" stop-color="#E4EDF5" stop-opacity="0.18"/>
+            <stop offset="100%" stop-color="#B9C4CF" stop-opacity="0.08"/>
+        </linearGradient>
+
+        <!-- Celý tvar síťového vaku -->
+        <clipPath id="netBagClip">
+            <path d="
+        M 36 8
+        C 21 8, 9 20, 9 35
+        C 9 51, 13 70, 19 84
+        C 22 92, 27 94, 31 87
+        C 40 72, 54 51, 63 35
+        C 63 20, 51 8, 36 8
+        Z"/>
+        </clipPath>
+    </defs>
+
+    <!-- Síťový vak za obručí -->
+    <path d="
+    M 36 8
+    C 21 8, 9 20, 9 35
+    C 9 51, 13 70, 19 84
+    C 22 92, 27 94, 31 87
+    C 40 72, 54 51, 63 35
+    C 63 20, 51 8, 36 8
+    Z"
+          fill="url(#netFill)"
+          stroke="#AEBBC8"
+          stroke-width="1"
+          opacity="0.7"/>
+
+    <!-- Výplet síťky -->
+    <g clip-path="url(#netBagClip)"
+       fill="none"
+       stroke="#AEBBC8"
+       stroke-width="0.8"
+       opacity="0.6"
+       stroke-linecap="round">
+
+        <!-- Vlákna začínající na horní a boční obruči -->
+        <path d="M 16 17 C 15 42, 19 69, 25 90"/>
+        <path d="M 25 10 C 23 39, 24 69, 25 90"/>
+        <path d="M 36 8 C 34 39, 30 69, 25 90"/>
+        <path d="M 47 10 C 44 40, 36 70, 25 90"/>
+        <path d="M 56 18 C 51 44, 41 72, 25 90"/>
+        <path d="M 62 30 C 55 51, 43 75, 25 90"/>
+
+        <!-- Vlákna od levého okraje obruče -->
+        <path d="M 9 29 C 13 49, 18 72, 25 90"/>
+        <path d="M 10 42 C 14 60, 19 78, 25 90"/>
+
+        <!-- Příčná oka -->
+        <path d="M 16 17 C 28 22, 45 22, 56 18"/>
+        <path d="M 10 28 C 25 34, 47 34, 62 29"/>
+        <path d="M 9 40 C 25 46, 45 47, 59 42"/>
+        <path d="M 11 52 C 24 58, 41 59, 53 54"/>
+        <path d="M 13 64 C 24 69, 36 70, 45 66"/>
+        <path d="M 16 75 C 24 79, 31 80, 38 77"/>
+        <path d="M 20 84 C 24 87, 28 87, 32 84"/>
+    </g>
+
+    <!-- Rukojeť -->
+    <line x1="57" y1="57"
+          x2="93" y2="93"
+          stroke="#8B5A2B"
+          stroke-width="6"
+          stroke-linecap="round"/>
+
+    <line x1="57" y1="57"
+          x2="93" y2="93"
+          stroke="#A9713A"
+          stroke-width="3"
+          stroke-linecap="round"/>
+
+    <!-- Kovové napojení rukojeti -->
+    <line x1="56" y1="55"
+          x2="61" y2="61"
+          stroke="#71808E"
+          stroke-width="6"
+          stroke-linecap="round"/>
+
+    <line x1="56" y1="55"
+          x2="61" y2="61"
+          stroke="#B8C4CF"
+          stroke-width="2.5"
+          stroke-linecap="round"/>
+
+    <!-- Hlavní obruč – nezměněná -->
+    <circle cx="36" cy="35" r="27"
+            fill="none"
+            stroke="#7A8896"
+            stroke-width="4.5"/>
+
+    <circle cx="36" cy="35" r="27"
+            fill="none"
+            stroke="#AEBBC8"
+            stroke-width="2"/>
+
+</svg>