115 lines
3.7 KiB
XML
115 lines
3.7 KiB
XML
|
<?xml version="1.0" encoding="UTF-8"?>
|
||
|
<svg viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
|
<style>/* Eyes */
|
||
|
@keyframes firefish-logo-blink {
|
||
|
95% {
|
||
|
transform: scaleY(1);
|
||
|
}
|
||
|
|
||
|
97.5% {
|
||
|
transform: scaleY(0);
|
||
|
}
|
||
|
|
||
|
100% {
|
||
|
transform: scaleY(1);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
#firefish-logo-eye-l,
|
||
|
#firefish-logo-eye-r {
|
||
|
transform-origin: center;
|
||
|
transform-box: fill-box;
|
||
|
animation-name: firefish-logo-blink;
|
||
|
animation-duration: 3s;
|
||
|
animation-iteration-count: infinite;
|
||
|
animation-timing-function: ease-in-out;
|
||
|
}
|
||
|
|
||
|
/* Bubbles */
|
||
|
@keyframes firefish-logo-bloop {
|
||
|
0% {
|
||
|
transform: translateY(400px);
|
||
|
opacity: 0;
|
||
|
}
|
||
|
|
||
|
20% {
|
||
|
opacity: 0;
|
||
|
}
|
||
|
|
||
|
30% {
|
||
|
opacity: 1;
|
||
|
}
|
||
|
|
||
|
80% {
|
||
|
opacity: 1;
|
||
|
}
|
||
|
|
||
|
90% {
|
||
|
opacity: 0;
|
||
|
}
|
||
|
|
||
|
100% {
|
||
|
transform: translateY(-400px);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.firefish-logo-bubble {
|
||
|
animation-name: firefish-logo-bloop;
|
||
|
animation-fill-mode: forwards;
|
||
|
animation-iteration-count: infinite;
|
||
|
animation-duration: 2s;
|
||
|
animation-timing-function: ease-out;
|
||
|
fill: #31748f;
|
||
|
opacity: 0;
|
||
|
}
|
||
|
|
||
|
#firefish-logo-bubble-1 {
|
||
|
animation-delay: 0s;
|
||
|
}
|
||
|
|
||
|
#firefish-logo-bubble-2 {
|
||
|
animation-delay: .2s;
|
||
|
}
|
||
|
|
||
|
#firefish-logo-bubble-3 {
|
||
|
animation-delay: .6s;
|
||
|
}
|
||
|
|
||
|
#firefish-logo-bubble-4 {
|
||
|
animation-delay: .8s;
|
||
|
}
|
||
|
|
||
|
#firefish-logo-bubble-5 {
|
||
|
animation-delay: 1s;
|
||
|
}</style>
|
||
|
<defs>
|
||
|
<linearGradient id="a" x1="26.41" x2="1492.5" y1="1765.7" y2="299.62" gradientUnits="userSpaceOnUse">
|
||
|
<stop stop-color="#ec476d" offset="0"/>
|
||
|
<stop stop-color="#f6ae4a" offset="1"/>
|
||
|
</linearGradient>
|
||
|
<linearGradient id="b" x1="512" x2="512" y1="1788" y2="1398.7" gradientUnits="userSpaceOnUse">
|
||
|
<stop stop-color="#db44db" stop-opacity=".3" offset="0"/>
|
||
|
<stop stop-color="#db44db" stop-opacity=".21" offset=".11"/>
|
||
|
<stop stop-color="#db44db" stop-opacity=".12" offset=".27"/>
|
||
|
<stop stop-color="#db44db" stop-opacity=".05" offset=".44"/>
|
||
|
<stop stop-color="#db44db" stop-opacity=".01" offset=".65"/>
|
||
|
<stop stop-color="#db44db" stop-opacity="0" offset="1"/>
|
||
|
</linearGradient>
|
||
|
<linearGradient id="e" x1="-351.25" x2="1150.7" y1="1382.8" y2="-119.17" xlink:href="#a"/>
|
||
|
<linearGradient id="d" x1="412.3" x2="1915.3" y1="2147.8" y2="644.8" xlink:href="#a"/>
|
||
|
<linearGradient id="c" x1="28.25" x2="1531.2" y1="1763.8" y2="260.75" xlink:href="#a"/>
|
||
|
</defs>
|
||
|
<circle class="firefish-logo-bubble" cx="205" cy="500" r="40"/>
|
||
|
<circle class="firefish-logo-bubble" cx="140" cy="500" r="80"/>
|
||
|
<circle class="firefish-logo-bubble" cx="95" cy="500" r="70"/>
|
||
|
<circle class="firefish-logo-bubble" cx="200" cy="500" r="40"/>
|
||
|
<circle class="firefish-logo-bubble" cx="95" cy="500" r="20"/>
|
||
|
<path d="m928,768.11H96c-53.02,0-96,42.98-96,96v832c0,53.02,42.98,96,96,96h832c53.02,0,96-42.98,96-96v-832c0-53.02-42.98-96-96-96Z" fill="url(#a)"/>
|
||
|
<path d="m928 768.11h-832c-53.02 0-96 42.98-96 96v832c0 53.02 42.98 96 96 96h832c53.02 0 96-42.98 96-96v-832c0-53.02-42.98-96-96-96z" fill="url(#b)"/>
|
||
|
<path d="m927.66,639.79h-439.94c-52.98,0-95.94-42.95-95.94-95.94V103.91c0-85.47,103.34-128.27,163.77-67.84l439.94,439.94c60.44,60.44,17.63,163.77-67.84,163.77Z" fill="url(#e)"/>
|
||
|
<path d="m1694.7 1408.1h-445.51c-53.65 0-97.15-43.5-97.15-97.15v-445.51c0-86.55 104.64-129.9 165.84-68.7l445.51 445.51c61.2 61.2 17.86 165.84-68.7 165.84z" fill="url(#d)"/>
|
||
|
<path d="m1694.66,640h-445.51c-53.65,0-97.15-43.5-97.15-97.15V97.34c0-86.55,104.64-129.9,165.84-68.7l445.51,445.51c61.2,61.2,17.86,165.84-68.7,165.84Z" fill="url(#c)"/>
|
||
|
<circle cx="256" cy="1408.1" r="128" fill="#1e1e1e"/>
|
||
|
<circle cx="576" cy="1408.1" r="128" fill="#1e1e1e"/>
|
||
|
</svg>
|