first commit

This commit is contained in:
qwer-xyz
2026-06-20 14:22:31 +08:00
commit c2498911ab
793 changed files with 291660 additions and 0 deletions
+115
View File
@@ -0,0 +1,115 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="70 80 260 260" width="200" height="200">
<defs>
<filter id="glow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur stdDeviation="2.5" result="blur" />
<feComposite in="SourceGraphic" in2="blur" operator="over" />
</filter>
<filter id="glow-strong" x="-30%" y="-30%" width="160%" height="160%">
<feGaussianBlur stdDeviation="4" result="blur" />
<feComposite in="SourceGraphic" in2="blur" operator="over" />
</filter>
<linearGradient id="data-stream" x1="0%" y1="100%" x2="0%" y2="0%">
<stop offset="0%" stop-color="#00E5FF" stop-opacity="0" />
<stop offset="50%" stop-color="#00E5FF" stop-opacity="0.9" />
<stop offset="100%" stop-color="#00E5FF" stop-opacity="0" />
</linearGradient>
</defs>
<g transform="translate(0, 10)">
<g id="base-platform">
<polygon points="200,275 90,220 90,245 200,300" fill="#282B30" />
<polygon points="200,275 310,220 310,245 200,300" fill="#1C1E22" />
<polygon points="200,275 90,220 200,165 310,220" fill="#3E434A" />
<polygon points="200,274 91,220 200,166 309,220" fill="none" stroke="#00E5FF" stroke-width="2" filter="url(#glow)">
<animate attributeName="opacity" values="0.2; 0.8; 0.2" dur="3s" repeatCount="indefinite" />
</polygon>
</g>
<g transform="translate(200, 210)">
<polygon points="0,0 -40,-20 0,-40 40,-20" fill="rgba(0,0,0,0.5)">
<animate attributeName="opacity" values="0.6; 0.2; 0.6" dur="4s" repeatCount="indefinite" />
</polygon>
</g>
<g id="node-back">
<animateTransform attributeName="transform" type="translate" values="200,210; 200,198; 200,210" dur="4s" repeatCount="indefinite" />
<line x1="0" y1="0" x2="0" y2="40" stroke="url(#data-stream)" stroke-width="4" stroke-dasharray="8,4">
<animate attributeName="stroke-dashoffset" from="24" to="0" dur="1s" repeatCount="indefinite" />
<animate attributeName="opacity" values="0.3; 1; 0.3" dur="2s" repeatCount="indefinite" />
</line>
<polygon points="0,0 -40,-20 -40,-65 0,-45" fill="#E2E5E9" stroke="#111214" stroke-width="2" stroke-linejoin="round" />
<polygon points="0,0 40,-20 40,-65 0,-45" fill="#C9CDD3" stroke="#111214" stroke-width="2" stroke-linejoin="round" />
<polygon points="0,-45 -40,-65 0,-85 40,-65" fill="#FFFFFF" stroke="#111214" stroke-width="2" stroke-linejoin="round" />
</g>
<g transform="translate(154, 233)">
<polygon points="0,0 -40,-20 0,-40 40,-20" fill="rgba(0,0,0,0.4)">
<animate attributeName="opacity" values="0.5; 0.2; 0.5" dur="3.5s" repeatCount="indefinite" />
</polygon>
</g>
<g id="node-left">
<animateTransform attributeName="transform" type="translate" values="154,233; 154,225; 154,233" dur="3.5s" repeatCount="indefinite" />
<polygon points="0,0 -40,-20 -40,-65 0,-45" fill="#18191C" />
<polygon points="0,0 40,-20 40,-65 0,-45" fill="#0D0D10" />
<polygon points="0,-45 -40,-65 0,-85 40,-65" fill="#2A2B2F" />
<polyline points="-40,-20 -40,-65 0,-85" fill="none" stroke="#00E5FF" stroke-width="2.5" stroke-dasharray="15 80" filter="url(#glow)">
<animate attributeName="stroke-dashoffset" from="95" to="-95" dur="2.5s" repeatCount="indefinite" />
</polyline>
</g>
<g transform="translate(246, 233)">
<polygon points="0,0 -40,-20 0,-40 40,-20" fill="rgba(0,0,0,0.4)">
<animate attributeName="opacity" values="0.5; 0.2; 0.5" dur="4.2s" repeatCount="indefinite" />
</polygon>
</g>
<g id="node-right">
<animateTransform attributeName="transform" type="translate" values="246,233; 246,223; 246,233" dur="4.2s" repeatCount="indefinite" />
<polygon points="0,0 -40,-20 -40,-65 0,-45" fill="#18191C" />
<polygon points="0,0 40,-20 40,-65 0,-45" fill="#0D0D10" />
<polygon points="0,-45 -40,-65 0,-85 40,-65" fill="#2A2B2F" />
<polyline points="40,-20 40,-65 0,-85" fill="none" stroke="#00E5FF" stroke-width="2.5" stroke-dasharray="15 80" filter="url(#glow)">
<animate attributeName="stroke-dashoffset" from="-95" to="95" dur="3s" repeatCount="indefinite" />
</polyline>
</g>
<g transform="translate(200, 256)">
<polygon points="0,0 -40,-20 0,-40 40,-20" fill="rgba(0,0,0,0.3)">
<animate attributeName="opacity" values="0.4; 0.1; 0.4" dur="3.8s" repeatCount="indefinite" />
</polygon>
</g>
<g id="node-front">
<animateTransform attributeName="transform" type="translate" values="200,256; 200,246; 200,256" dur="3.8s" repeatCount="indefinite" />
<line x1="-40" y1="-20" x2="0" y2="-40" stroke="#111214" stroke-width="2" opacity="0.4" stroke-dasharray="3,3" />
<line x1="40" y1="-20" x2="0" y2="-40" stroke="#111214" stroke-width="2" opacity="0.4" stroke-dasharray="3,3" />
<line x1="0" y1="-40" x2="0" y2="-85" stroke="#111214" stroke-width="2" opacity="0.4" stroke-dasharray="3,3" />
<polygon points="0,0 -40,-20 -40,-65 0,-45" fill="rgba(200,200,200,0.1)" />
<polygon points="0,0 40,-20 40,-65 0,-45" fill="rgba(200,200,200,0.05)" />
<polygon points="0,-45 -40,-65 0,-85 40,-65" fill="rgba(200,200,200,0.15)" />
<g stroke="#3E434A" stroke-width="2" stroke-linejoin="round" fill="none" stroke-dasharray="6,4">
<animate attributeName="stroke-dashoffset" from="20" to="0" dur="1s" repeatCount="indefinite" />
<polygon points="0,0 -40,-20 -40,-65 0,-45" />
<polygon points="0,0 40,-20 40,-65 0,-45" />
<polygon points="0,-45 -40,-65 0,-85 40,-65" />
</g>
<polygon points="0,0 -40,-20 0,-40 40,-20" fill="#00E5FF" opacity="0.5" filter="url(#glow-strong)">
<animateTransform attributeName="transform" type="translate" values="0,-5; 0,-45; 0,-5" dur="2.5s" repeatCount="indefinite" />
<animate attributeName="opacity" values="0; 0.6; 0.6; 0" keyTimes="0; 0.2; 0.8; 1" dur="2.5s" repeatCount="indefinite" />
</polygon>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 5.9 KiB

+144
View File
@@ -0,0 +1,144 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" width="200" height="200">
<defs>
<style>
@keyframes orbitRotate {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
@keyframes nebulaPulse {
0%, 100% {
transform: scale(1);
filter: drop-shadow(0 0 4px rgba(168, 85, 247, 0.6));
}
50% {
transform: scale(1.02);
filter: drop-shadow(0 0 12px rgba(236, 72, 153, 0.8));
}
}
@keyframes dataStream {
to { stroke-dashoffset: -40; }
}
@keyframes float {
0%, 100% { transform: translateY(0); opacity: 0.8; }
50% { transform: translateY(-4px); opacity: 1; }
}
.orbit-ring {
transform-origin: 100px 100px;
animation: orbitRotate 12s linear infinite;
}
.orbit-ring-reverse {
transform-origin: 100px 100px;
animation: orbitRotate 8s linear infinite reverse;
}
.prime-core {
transform-origin: 100px 100px;
animation: nebulaPulse 4s ease-in-out infinite;
}
.stream-line {
stroke-dasharray: 6 6;
animation: dataStream 1.5s linear infinite;
}
.crown-dot {
animation: float 2s ease-in-out infinite;
}
.crown-dot:nth-child(2) { animation-delay: 0.5s; }
.crown-dot:nth-child(3) { animation-delay: 1s; }
.prime-text {
font-family: 'Courier New', monospace;
letter-spacing: 3px;
}
</style>
<linearGradient id="platinumGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#f8fafc" />
<stop offset="40%" stop-color="#e2e8f0" />
<stop offset="100%" stop-color="#94a3b8" />
</linearGradient>
<linearGradient id="royalGradient" x1="0%" y1="100%" x2="100%" y2="0%">
<stop offset="0%" stop-color="#7c3aed" />
<stop offset="100%" stop-color="#d946ef" />
</linearGradient>
<linearGradient id="voidGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#2e1065" />
<stop offset="100%" stop-color="#0f172a" />
</linearGradient>
</defs>
<path d="M20 50 V20 H50 M150 20 H180 V50 M180 150 V180 H150 M50 180 H20 V150"
stroke="#475569" stroke-width="1" fill="none" opacity="0.5"/>
<circle cx="100" cy="100" r="85" stroke="#334155" stroke-width="0.5" fill="none" opacity="0.3"/>
<g class="orbit-ring">
<circle cx="100" cy="100" r="78" fill="none" stroke="url(#royalGradient)" stroke-width="1.5"
stroke-dasharray="20 120" stroke-linecap="round" />
<circle cx="100" cy="100" r="78" fill="none" stroke="url(#royalGradient)" stroke-width="0.5"
stroke-dasharray="2 10" opacity="0.5"/>
</g>
<g class="orbit-ring-reverse">
<circle cx="100" cy="100" r="62" fill="none" stroke="#e2e8f0" stroke-width="1"
stroke-dasharray="40 80" opacity="0.4" />
<circle cx="100" cy="38" r="2" fill="#d946ef" />
<circle cx="100" cy="162" r="2" fill="#d946ef" />
</g>
<g class="prime-core">
<path d="M100 50 L145 75 V125 L100 150 L55 125 V75 Z"
fill="url(#voidGradient)" stroke="url(#platinumGradient)" stroke-width="2" />
<path d="M55 75 L100 85 M145 75 L100 85 M100 150 V120"
stroke="#a855f7" stroke-width="1" opacity="0.6"/>
<g transform="translate(0, -5)">
<circle cx="100" cy="40" r="3" fill="#f8fafc" class="crown-dot" />
<circle cx="85" cy="46" r="2" fill="#d946ef" class="crown-dot" />
<circle cx="115" cy="46" r="2" fill="#d946ef" class="crown-dot" />
</g>
<path d="M80 135 H120" stroke="#d946ef" stroke-width="3" stroke-linecap="round"
class="stream-line" />
</g>
<text x="100" y="108" text-anchor="middle" font-size="36" font-weight="900"
fill="url(#platinumGradient)" class="prime-text">KVM</text>
<rect x="90" y="122" width="20" height="2" rx="1" fill="#a855f7" opacity="0.8" />
</svg>

After

Width:  |  Height:  |  Size: 4.0 KiB

+114
View File
@@ -0,0 +1,114 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" width="200" height="200">
<defs>
<style>
@keyframes spinSlow {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
@keyframes spinReverse {
from { transform: rotate(360deg); }
to { transform: rotate(0deg); }
}
@keyframes corePulse {
0%, 100% {
transform: scale(1);
filter: drop-shadow(0 0 2px rgba(234, 179, 8, 0.5));
}
50% {
transform: scale(1.05);
filter: drop-shadow(0 0 8px rgba(234, 179, 8, 0.9));
}
}
@keyframes circuitFlow {
to { stroke-dashoffset: -20; }
}
@keyframes glitchText {
0%, 90%, 100% { opacity: 1; transform: translate(0); }
92% { opacity: 0.8; transform: translate(-2px, 1px); }
94% { opacity: 1; transform: translate(2px, -1px); }
96% { opacity: 0.5; transform: translate(0); }
}
.ring-outer {
transform-origin: 100px 100px;
animation: spinSlow 10s linear infinite;
}
.ring-inner {
transform-origin: 100px 100px;
animation: spinReverse 6s linear infinite;
}
.core-hex {
transform-origin: 100px 100px;
animation: corePulse 3s ease-in-out infinite;
}
.circuit-line {
stroke-dasharray: 4 4;
animation: circuitFlow 1s linear infinite;
}
.pro-text {
font-family: 'Courier New', monospace;
animation: glitchText 4s infinite;
}
</style>
<linearGradient id="goldGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#fde047" />
<stop offset="100%" stop-color="#eab308" />
</linearGradient>
</defs>
<path d="M20 100 H180 M100 20 V180" stroke="#334155" stroke-width="1" />
<circle cx="100" cy="100" r="80" stroke="#334155" stroke-width="1" fill="none"/>
<circle cx="100" cy="100" r="75" fill="none" stroke="#0e7490" stroke-width="2"
stroke-dasharray="20 40" stroke-opacity="0.5" class="ring-outer" />
<circle cx="100" cy="100" r="65" fill="none" stroke="#0ea5e9" stroke-width="1.5"
stroke-dasharray="60 100" class="ring-outer" style="animation-duration: 15s; opacity: 0.3;" />
<g class="ring-inner">
<circle cx="100" cy="100" r="55" fill="none" stroke="#64748b" stroke-width="1" stroke-dasharray="2 8" />
<rect x="98" y="42" width="4" height="4" fill="#22d3ee" />
<rect x="98" y="154" width="4" height="4" fill="#22d3ee" />
</g>
<g class="core-hex">
<path d="M100 55 L138.9 77.5 L138.9 122.5 L100 145 L61.1 122.5 L61.1 77.5 Z"
fill="#0f172a" stroke="url(#goldGradient)" stroke-width="3" />
<path d="M100 60 L134 80 L134 120 L100 140 L66 120 L66 80 Z"
fill="url(#goldGradient)" opacity="0.1" />
<path d="M61.1 77.5 L40 65 M138.9 77.5 L160 65 M100 145 L100 165"
stroke="#eab308" stroke-width="2" class="circuit-line" />
</g>
<text x="100" y="108" text-anchor="middle" font-size="32" font-weight="900"
fill="url(#goldGradient)" class="pro-text" letter-spacing="2">LXC</text>
<rect x="80" y="125" width="40" height="4" rx="2" fill="#22d3ee" opacity="0.8" />
</svg>

After

Width:  |  Height:  |  Size: 3.2 KiB