Changeset 0.9.2 (#52)

This commit is contained in:
2026-02-23 19:31:33 +00:00
parent febcbde3d7
commit ac7c7c7d59
25 changed files with 534 additions and 54 deletions

View File

@@ -1,10 +1,53 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<rect width="64" height="64" rx="12" fill="#1a1a2e"/>
<!-- Arrow 1: bottom-left → top-right -->
<path d="M12 48 L36 16" stroke="#6c9fff" stroke-width="5.5" stroke-linecap="round" fill="none"/>
<polygon points="42,12 34,14 38,22" fill="#6c9fff"/>
<!-- Arrow 2: top-left → bottom-right (gap at crossover) -->
<path d="M12 16 L24 30" stroke="#a78bfa" stroke-width="5.5" stroke-linecap="round" fill="none"/>
<path d="M30 38 L36 48" stroke="#a78bfa" stroke-width="5.5" stroke-linecap="round" fill="none"/>
<polygon points="42,52 34,50 38,42" fill="#a78bfa"/>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64" height="64">
<defs>
<linearGradient id="panel" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#3d3935"/>
<stop offset="100%" stop-color="#252220"/>
</linearGradient>
</defs>
<!-- Panel background -->
<rect x="4" y="4" width="56" height="56" rx="10" fill="url(#panel)" stroke="#4a4540" stroke-width="1.5"/>
<!-- Static jack holes (dark rings) -->
<circle cx="22" cy="23" r="8" fill="#111"/>
<circle cx="42" cy="23" r="8" fill="#111"/>
<circle cx="42" cy="43" r="8" fill="#111"/>
<circle cx="22" cy="43" r="8" fill="#111"/>
<!--
Cascading color rotation (clockwise: TL → TR → BR → BL)
dur=12s, each cascade round=3s, fade=0.4s out + 0.4s in
As dot N fades in, dot N+1 begins fading out (overlap)
Blue=#2D7DD2 Orange=#E8852E Green=#2EAA4E Purple=#9B59B6
-->
<!-- TL: Blue → Purple → Green → Orange (offset 0s) -->
<circle cx="22" cy="23" r="5.5" fill="#2D7DD2">
<animate attributeName="fill" dur="12s" repeatCount="indefinite"
keyTimes="0;0.0333;0.0667;0.25;0.2833;0.3167;0.5;0.5333;0.5667;0.75;0.7833;0.8167;1"
values="#2D7DD2;#111;#9B59B6;#9B59B6;#111;#2EAA4E;#2EAA4E;#111;#E8852E;#E8852E;#111;#2D7DD2;#2D7DD2"/>
</circle>
<!-- TR: Orange → Blue → Purple → Green (offset 0.4s) -->
<circle cx="42" cy="23" r="5.5" fill="#E8852E">
<animate attributeName="fill" dur="12s" repeatCount="indefinite"
keyTimes="0;0.0333;0.0667;0.1;0.2833;0.3167;0.35;0.5333;0.5667;0.6;0.7833;0.8167;0.85;1"
values="#E8852E;#E8852E;#111;#2D7DD2;#2D7DD2;#111;#9B59B6;#9B59B6;#111;#2EAA4E;#2EAA4E;#111;#E8852E;#E8852E"/>
</circle>
<!-- BR: Purple → Green → Orange → Blue (offset 0.8s) -->
<circle cx="42" cy="43" r="5.5" fill="#9B59B6">
<animate attributeName="fill" dur="12s" repeatCount="indefinite"
keyTimes="0;0.0667;0.1;0.1333;0.3167;0.35;0.3833;0.5667;0.6;0.6333;0.8167;0.85;0.8833;1"
values="#9B59B6;#9B59B6;#111;#2EAA4E;#2EAA4E;#111;#E8852E;#E8852E;#111;#2D7DD2;#2D7DD2;#111;#9B59B6;#9B59B6"/>
</circle>
<!-- BL: Green → Orange → Blue → Purple (offset 1.2s) -->
<circle cx="22" cy="43" r="5.5" fill="#2EAA4E">
<animate attributeName="fill" dur="12s" repeatCount="indefinite"
keyTimes="0;0.1;0.1333;0.1667;0.35;0.3833;0.4167;0.6;0.6333;0.6667;0.85;0.8833;0.9167;1"
values="#2EAA4E;#2EAA4E;#111;#E8852E;#E8852E;#111;#2D7DD2;#2D7DD2;#111;#9B59B6;#9B59B6;#111;#2EAA4E;#2EAA4E"/>
</circle>
</svg>

Before

Width:  |  Height:  |  Size: 642 B

After

Width:  |  Height:  |  Size: 2.5 KiB