9cef9b8d57
Merge _configs/ into config/ for single configuration directory. Update all path references. Changes: - Move _configs/* to config/ - Update .gitignore for new patterns - No code references to _configs/ found Impact: -1 root directory (layout_conventions.md compliance)
138 lines
3.4 KiB
XML
138 lines
3.4 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" width="200" height="200">
|
|
<!-- SYNTAXIS Icon - Systematic Construction -->
|
|
<style>
|
|
.construct {
|
|
animation: construct 1s cubic-bezier(0.68, -0.55, 0.265, 1.55) backwards;
|
|
}
|
|
|
|
@keyframes construct {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes slideFromTop {
|
|
from {
|
|
transform: translateY(-100px);
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
transform: translateY(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes slideFromLeft {
|
|
from {
|
|
transform: translateX(-100px);
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
transform: translateX(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes slideFromRight {
|
|
from {
|
|
transform: translateX(100px);
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
transform: translateX(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes slideFromBottom {
|
|
from {
|
|
transform: translateY(100px);
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
transform: translateY(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes zoomIn {
|
|
from {
|
|
transform: scale(0);
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
transform: scale(1);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.from-top { animation: slideFromTop 0.6s ease-out backwards; }
|
|
.from-left { animation: slideFromLeft 0.6s ease-out backwards; }
|
|
.from-right { animation: slideFromRight 0.6s ease-out backwards; }
|
|
.from-bottom { animation: slideFromBottom 0.6s ease-out backwards; }
|
|
.zoom { animation: zoomIn 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) backwards; }
|
|
|
|
.d1 { animation-delay: 0s; }
|
|
.d2 { animation-delay: 0.1s; }
|
|
.d3 { animation-delay: 0.2s; }
|
|
.d4 { animation-delay: 0.3s; }
|
|
.d5 { animation-delay: 0.4s; }
|
|
.d6 { animation-delay: 0.5s; }
|
|
</style>
|
|
|
|
<!-- Top diamond - from top -->
|
|
<g class="from-top d1">
|
|
<path d="M 100 20 L 110 30 L 100 40 L 90 30 Z" fill="#2C5F8E"/>
|
|
</g>
|
|
|
|
<!-- Second row - from sides and top -->
|
|
<g class="from-left d2">
|
|
<path d="M 70 50 L 80 60 L 70 70 L 60 60 Z" fill="#2C5F8E"/>
|
|
</g>
|
|
<g class="from-top d2">
|
|
<rect x="90" y="50" width="20" height="20" fill="#6B7280"/>
|
|
</g>
|
|
<g class="from-right d2">
|
|
<path d="M 130 50 L 140 60 L 130 70 L 120 60 Z" fill="#2C5F8E"/>
|
|
</g>
|
|
|
|
<!-- Third row (center) - from all directions -->
|
|
<g class="from-left d3">
|
|
<path d="M 40 80 L 50 90 L 40 100 L 30 90 Z" fill="#2C5F8E"/>
|
|
</g>
|
|
<g class="from-left d4">
|
|
<rect x="60" y="80" width="20" height="20" fill="#6B7280"/>
|
|
</g>
|
|
|
|
<!-- Center triangle - zoom in last -->
|
|
<g class="zoom d6">
|
|
<path d="M 100 80 L 115 105 L 85 105 Z" fill="#D97706"/>
|
|
</g>
|
|
|
|
<g class="from-right d4">
|
|
<rect x="120" y="80" width="20" height="20" fill="#6B7280"/>
|
|
</g>
|
|
<g class="from-right d3">
|
|
<path d="M 160 80 L 170 90 L 160 100 L 150 90 Z" fill="#2C5F8E"/>
|
|
</g>
|
|
|
|
<!-- Fourth row - from sides and bottom -->
|
|
<g class="from-left d5">
|
|
<path d="M 70 110 L 80 120 L 70 130 L 60 120 Z" fill="#2C5F8E"/>
|
|
</g>
|
|
<g class="from-bottom d5">
|
|
<rect x="90" y="110" width="20" height="20" fill="#6B7280"/>
|
|
</g>
|
|
<g class="from-right d5">
|
|
<path d="M 130 110 L 140 120 L 130 130 L 120 120 Z" fill="#2C5F8E"/>
|
|
</g>
|
|
|
|
<!-- Bottom diamond - from bottom -->
|
|
<g class="from-bottom d6">
|
|
<path d="M 100 140 L 110 150 L 100 160 L 90 150 Z" fill="#2C5F8E"/>
|
|
</g>
|
|
</svg>
|
