Files
floci-ui/svgAsset/db-creation.svg
T

35 lines
1.5 KiB
XML

<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
<style>
.led{fill:#35d0b5}
.a{animation:blink 1.4s ease-in-out infinite}
.b{animation:blink 1.4s .22s ease-in-out infinite}
.c{animation:blink 1.4s .44s ease-in-out infinite}
.d{animation:blink 1.4s .66s ease-in-out infinite}
@keyframes blink{0%,25%,100%{opacity:.28}45%,72%{opacity:1}}
</style>
<!-- database body -->
<path d="M7 11C7 15 14.6 17 24 17S41 15 41 11v26c0 4-7.6 6-17 6S7 41 7 37Z" fill="#0D3D8C"/>
<path d="M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z" fill="#1769C2">
<animate attributeName="d" dur="1.3s" repeatCount="indefinite"
values="M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z;
M7 9C7 13 14.6 15 24 15S41 13 41 9v14c0 4-7.6 6-17 6S7 27 7 23Z;
M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z"/>
</path>
<!-- animated top -->
<g>
<path d="M7 11C7 7 14.6 5 24 5S41 7 41 11v7c0 4-7.6 6-17 6S7 22 7 18Z" fill="#1976D2"/>
<ellipse cx="24" cy="11" rx="17" ry="5.5" fill="#2B91E3"/>
<ellipse cx="24" cy="9.7" rx="14.5" ry="3.5" fill="#39A0EA" opacity=".35"/>
<animateTransform attributeName="transform" type="translate" values="0 0;0 -3;0 0" dur="1.3s" repeatCount="indefinite"/>
</g>
<!-- server-style activity indicators -->
<g>
<circle class="led a" cx="16" cy="35.5" r="1.6"/>
<circle class="led b" cx="21.3" cy="36.2" r="1.6"/>
<circle class="led c" cx="26.7" cy="36.2" r="1.6"/>
<circle class="led d" cx="32" cy="35.5" r="1.6"/>
</g>
</svg>