mirror of
https://github.com/prdlk/prdlk.git
synced 2026-11-02 21:22:50 +00:00
124 lines
11 KiB
XML
124 lines
11 KiB
XML
|
<svg xmlns="http://www.w3.org/2000/svg" width="850" height="220" viewBox="0 0 850 220">
|
||
|
|
<defs>
|
||
|
|
<filter id="proj-glow-0" x="-80%" y="-80%" width="260%" height="260%">
|
||
|
|
<feGaussianBlur stdDeviation="4" in="SourceGraphic" result="blur"/>
|
||
|
|
<feFlood flood-color="#ffb020" flood-opacity="0.6" result="color"/>
|
||
|
|
<feComposite in="color" in2="blur" operator="in" result="glow"/>
|
||
|
|
<feMerge>
|
||
|
|
<feMergeNode in="glow"/>
|
||
|
|
<feMergeNode in="SourceGraphic"/>
|
||
|
|
</feMerge>
|
||
|
|
</filter>
|
||
|
|
<filter id="card-nebula" x="-50%" y="-50%" width="200%" height="200%">
|
||
|
|
<feGaussianBlur stdDeviation="15"/>
|
||
|
|
</filter>
|
||
|
|
<linearGradient id="card-bg-0" x1="0" y1="0" x2="0" y2="1">
|
||
|
|
<stop offset="0%" stop-color="#1a2332" stop-opacity="0.6"/>
|
||
|
|
<stop offset="100%" stop-color="#0f1623" stop-opacity="0.9"/>
|
||
|
|
</linearGradient>
|
||
|
|
<clipPath id="card-clip-0">
|
||
|
|
<rect x="305.0" y="55" width="240" height="140" rx="8" ry="8"/>
|
||
|
|
</clipPath>
|
||
|
|
<style>
|
||
|
|
@keyframes twinkle {
|
||
|
|
0%, 100% { opacity: 0.1; }
|
||
|
|
50% { opacity: 0.6; }
|
||
|
|
}
|
||
|
|
@keyframes orbit {
|
||
|
|
from { transform: rotate(0deg); }
|
||
|
|
to { transform: rotate(360deg); }
|
||
|
|
}
|
||
|
|
@keyframes card-appear {
|
||
|
|
from { opacity: 0; transform: translateY(8px); }
|
||
|
|
to { opacity: 1; transform: translateY(0); }
|
||
|
|
}
|
||
|
|
@keyframes scan-sweep {
|
||
|
|
0% { transform: translateY(0); }
|
||
|
|
100% { transform: translateY(160px); }
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</defs>
|
||
|
|
|
||
|
|
<!-- Background -->
|
||
|
|
<rect x="0.5" y="0.5" width="849" height="219" rx="12" ry="12" fill="#0f1623" stroke="#1a2332" stroke-width="1"/>
|
||
|
|
|
||
|
|
<!-- Star field -->
|
||
|
|
<circle cx="416.1" cy="72.5" r="0.9" fill="#ffb020" opacity="0.09"><animate attributeName="opacity" values="0.09;0.26;0.09" dur="5.3s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="692.3" cy="171.6" r="0.4" fill="#94a3b8" opacity="0.12"><animate attributeName="opacity" values="0.12;0.36;0.12" dur="7.4s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="63.4" cy="16.1" r="0.7" fill="#94a3b8" opacity="0.25"><animate attributeName="opacity" values="0.25;0.60;0.25" dur="7.0s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="548.4" cy="129.6" r="0.5" fill="#94a3b8" opacity="0.22"><animate attributeName="opacity" values="0.22;0.60;0.22" dur="7.5s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="180.0" cy="103.4" r="0.6" fill="#ffb020" opacity="0.07"><animate attributeName="opacity" values="0.07;0.22;0.07" dur="7.5s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="438.0" cy="16.3" r="0.5" fill="#94a3b8" opacity="0.20"><animate attributeName="opacity" values="0.20;0.59;0.20" dur="6.4s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="450.1" cy="60.9" r="0.9" fill="#94a3b8" opacity="0.22"><animate attributeName="opacity" values="0.22;0.60;0.22" dur="6.8s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="170.7" cy="110.1" r="0.4" fill="#94a3b8" opacity="0.06"><animate attributeName="opacity" values="0.06;0.19;0.06" dur="7.9s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="613.4" cy="38.1" r="0.7" fill="#ffb020" opacity="0.13"><animate attributeName="opacity" values="0.13;0.39;0.13" dur="6.8s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="480.8" cy="157.8" r="0.5" fill="#94a3b8" opacity="0.18"><animate attributeName="opacity" values="0.18;0.55;0.18" dur="7.8s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="726.5" cy="194.1" r="0.7" fill="#94a3b8" opacity="0.22"><animate attributeName="opacity" values="0.22;0.60;0.22" dur="6.2s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="658.8" cy="95.2" r="0.7" fill="#94a3b8" opacity="0.20"><animate attributeName="opacity" values="0.20;0.60;0.20" dur="7.6s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="167.0" cy="54.0" r="0.9" fill="#ffb020" opacity="0.24"><animate attributeName="opacity" values="0.24;0.60;0.24" dur="7.0s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="691.5" cy="70.4" r="0.8" fill="#94a3b8" opacity="0.07"><animate attributeName="opacity" values="0.07;0.22;0.07" dur="5.4s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="222.0" cy="150.3" r="0.6" fill="#94a3b8" opacity="0.15"><animate attributeName="opacity" values="0.15;0.45;0.15" dur="7.0s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="199.6" cy="139.8" r="0.8" fill="#ffb020" opacity="0.20"><animate attributeName="opacity" values="0.20;0.50;0.20" dur="4.4s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="732.7" cy="192.0" r="1.2" fill="#94a3b8" opacity="0.21"><animate attributeName="opacity" values="0.21;0.52;0.21" dur="3.8s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="433.7" cy="146.1" r="1.2" fill="#94a3b8" opacity="0.18"><animate attributeName="opacity" values="0.18;0.45;0.18" dur="4.7s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="137.5" cy="81.6" r="1.0" fill="#94a3b8" opacity="0.34"><animate attributeName="opacity" values="0.34;0.80;0.34" dur="5.7s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="573.7" cy="178.0" r="1.1" fill="#ffb020" opacity="0.14"><animate attributeName="opacity" values="0.14;0.36;0.14" dur="3.5s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="411.1" cy="172.0" r="1.1" fill="#94a3b8" opacity="0.13"><animate attributeName="opacity" values="0.13;0.32;0.13" dur="4.5s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="462.3" cy="81.1" r="1.1" fill="#94a3b8" opacity="0.19"><animate attributeName="opacity" values="0.19;0.48;0.19" dur="4.9s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="141.0" cy="77.7" r="1.1" fill="#94a3b8" opacity="0.19"><animate attributeName="opacity" values="0.19;0.48;0.19" dur="5.9s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="410.0" cy="92.0" r="0.9" fill="#ffb020" opacity="0.22"><animate attributeName="opacity" values="0.22;0.56;0.22" dur="5.8s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="141.4" cy="87.2" r="0.7" fill="#94a3b8" opacity="0.20"><animate attributeName="opacity" values="0.20;0.49;0.20" dur="3.7s" repeatCount="indefinite"/></circle>
|
||
|
|
|
||
|
|
<!-- Grid overlay -->
|
||
|
|
<line x1="12" y1="40" x2="838" y2="40" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.12"/>
|
||
|
|
<line x1="12" y1="80" x2="838" y2="80" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.12"/>
|
||
|
|
<line x1="12" y1="120" x2="838" y2="120" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.12"/>
|
||
|
|
<line x1="12" y1="160" x2="838" y2="160" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.12"/>
|
||
|
|
<line x1="12" y1="200" x2="838" y2="200" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.12"/>
|
||
|
|
<line x1="80" y1="12" x2="80" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="160" y1="12" x2="160" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="240" y1="12" x2="240" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="320" y1="12" x2="320" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="400" y1="12" x2="400" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="480" y1="12" x2="480" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="560" y1="12" x2="560" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="640" y1="12" x2="640" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="720" y1="12" x2="720" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
<line x1="800" y1="12" x2="800" y2="208" stroke="#64748b" stroke-width="0.5" stroke-dasharray="4,8" opacity="0.08"/>
|
||
|
|
|
||
|
|
<!-- Connection lines -->
|
||
|
|
|
||
|
|
|
||
|
|
<!-- Title area -->
|
||
|
|
<g opacity="0.4">
|
||
|
|
<polyline points="5,21 5,5 21,5" fill="none" stroke="#64748b" stroke-width="1.5"/>
|
||
|
|
<polyline points="829,5 845,5 845,21" fill="none" stroke="#64748b" stroke-width="1.5"/>
|
||
|
|
<polyline points="5,199 5,215 21,215" fill="none" stroke="#64748b" stroke-width="1.5"/>
|
||
|
|
<polyline points="829,215 845,215 845,199" fill="none" stroke="#64748b" stroke-width="1.5"/>
|
||
|
|
</g>
|
||
|
|
<text x="30" y="38" fill="#64748b" font-size="11" font-family="monospace" letter-spacing="3">FEATURED SYSTEMS</text>
|
||
|
|
<circle cx="218" cy="34" r="3" fill="#00d4ff" opacity="0.8"><animate attributeName="opacity" values="0.4;1;0.4" dur="2s" repeatCount="indefinite"/></circle>
|
||
|
|
<text x="820" y="38" fill="#64748b" font-size="10" font-family="monospace" text-anchor="end" opacity="0.5">SYS 1/1 ONLINE</text>
|
||
|
|
|
||
|
|
<!-- Project cards -->
|
||
|
|
<g opacity="0" style="animation: card-appear 0.6s ease 0.0s forwards">
|
||
|
|
<rect x="305.0" y="55" width="240" height="140" rx="8" ry="8" fill="url(#card-bg-0)" stroke="#1a2332" stroke-width="1"/>
|
||
|
|
<g clip-path="url(#card-clip-0)">
|
||
|
|
<circle cx="377.0" cy="90" r="50" fill="#ffb020" opacity="0.025" filter="url(#card-nebula)"/>
|
||
|
|
<circle cx="473.0" cy="150" r="40" fill="#ffb020" opacity="0.03" filter="url(#card-nebula)"/>
|
||
|
|
<rect x="305.0" y="55" width="240" height="2" fill="#ffb020" opacity="0.1"><animateTransform attributeName="transform" type="translate" from="0 0" to="0 140" dur="6s" repeatCount="indefinite"/></rect>
|
||
|
|
</g>
|
||
|
|
<circle cx="425.0" cy="85" r="14" fill="none" stroke="#ffb020" stroke-width="0.8" stroke-dasharray="4,3" opacity="0.5"><animateTransform attributeName="transform" type="rotate" from="0 425.0 85" to="360 425.0 85" dur="12s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="425.0" cy="85" r="8" fill="#ffb020" opacity="0.15" filter="url(#proj-glow-0)"/>
|
||
|
|
<circle cx="425.0" cy="85" r="5" fill="#ffb020" opacity="0.7"><animate attributeName="opacity" values="0.5;0.9;0.5" dur="3s" begin="0.0s" repeatCount="indefinite"/><animate attributeName="r" values="4.5;5.5;4.5" dur="3s" begin="0.0s" repeatCount="indefinite"/></circle>
|
||
|
|
<circle cx="425.0" cy="85" r="2" fill="#ffffff" opacity="0.9"/>
|
||
|
|
<text x="425.0" y="111" fill="#f1f5f9" font-size="14" font-weight="bold" font-family="sans-serif" text-anchor="middle">sonr</text>
|
||
|
|
<text x="425.0" y="129" fill="#94a3b8" font-size="11" font-family="sans-serif" text-anchor="middle">Decentralized identity protocol</text>
|
||
|
|
<text x="425.0" y="144" fill="#94a3b8" font-size="11" font-family="sans-serif" text-anchor="middle">on Base — passkeys, DIDs, and</text>
|
||
|
|
<rect x="396.0" y="163" width="58" height="18" rx="9" ry="9" fill="#ffb020" opacity="0.12"/>
|
||
|
|
<text x="425.0" y="175" fill="#ffb020" font-size="9" font-family="monospace" text-anchor="middle" opacity="0.85">DevOps</text>
|
||
|
|
</g>
|
||
|
|
|
||
|
|
<!-- Global scan line -->
|
||
|
|
<rect x="12" y="50" width="826" height="1.5" fill="#00d4ff" opacity="0.08"><animateTransform attributeName="transform" type="translate" from="0 0" to="0 160" dur="6s" repeatCount="indefinite"/></rect>
|
||
|
|
</svg>
|