Animate stirrer blades proportional to speed
CSS rotation animation on #stirrer-blades group, speed mapped via --stir-duration custom property (speed=100 → 0.5s, speed=50 → 1s). Driven by stirrerSpeedIst on each Speed message. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01DGKe8JzTM2Gr1fdx9wYXTi
This commit is contained in:
+4
-2
@@ -100,8 +100,10 @@
|
||||
<line x1="60" y1="28" x2="180" y2="28" stroke="#bbb" stroke-width="4" stroke-linecap="round"/>
|
||||
|
||||
<!-- Stirrer blades (inside pot) -->
|
||||
<rect x="87" y="157" width="31" height="5" fill="#666" rx="1"/>
|
||||
<rect x="122" y="157" width="31" height="5" fill="#666" rx="1"/>
|
||||
<g id="stirrer-blades">
|
||||
<rect x="87" y="157" width="31" height="5" fill="#666" rx="1"/>
|
||||
<rect x="122" y="157" width="31" height="5" fill="#666" rx="1"/>
|
||||
</g>
|
||||
|
||||
<!-- Lid -->
|
||||
<rect x="56" y="20" width="128" height="10" fill="#444" rx="2"/>
|
||||
|
||||
Reference in New Issue
Block a user