Added Loader to Console (#1686)

Signed-off-by: Benjamin Perez <benjamin@bexsoft.net>
This commit is contained in:
Alex
2022-03-09 10:28:37 -07:00
committed by GitHub
parent 17c70d6c07
commit 3186c1a0d0
3 changed files with 425 additions and 1 deletions

View File

@@ -19,6 +19,7 @@ import { containerForHeader } from "../Common/FormComponents/common/styleLibrary
import { Theme } from "@mui/material/styles";
import createStyles from "@mui/styles/createStyles";
import withStyles from "@mui/styles/withStyles";
import clsx from "clsx";
import {
FormControl,
FormControlLabel,
@@ -30,7 +31,8 @@ import {
import * as cicons from "../../../icons";
import * as micons from "../../../icons/SidebarMenus";
import clsx from "clsx";
import Loader from "./Loader/Loader";
interface IIconsScreenSimple {
classes: any;
@@ -42,6 +44,10 @@ const styles = (theme: Theme) =>
root: {
fontSize: 12,
wordWrap: "break-word",
"& .min-loader": {
width: 45,
height: 45,
}
},
def: {},
red: {
@@ -98,6 +104,21 @@ const IconsScreen = ({ classes }: IIconsScreenSimple) => {
OperatorLogo
</Grid>
</Grid>
<h1>Loaders</h1>
<Grid
container
spacing={4}
textAlign={"center"}
className={clsx(classes.root, {
[classes.red]: color === "red",
})}
>
<Grid item xs={3}>
<Loader />
<br />
Loader
</Grid>
</Grid>
<h1>Icons</h1>
<Grid
container

View File

@@ -0,0 +1,103 @@
// This file is part of MinIO Console Server
// Copyright (c) 2022 MinIO, Inc.
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU Affero General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU Affero General Public License for more details.
//
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { SVGProps } from "react";
import "./loader.styles.css";
const Loader = (props: SVGProps<SVGSVGElement>) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 280 280"
shapeRendering="geometricPrecision"
textRendering="geometricPrecision"
className={"min-loader"}
{...props}
>
<g
id="eB8dk2fHKWC2_tr"
transform="translate(139.785027,140.086989) rotate(45.236493)"
>
<g id="eB8dk2fHKWC2_ts" transform="scale(1,0.995019)">
<g id="eB8dk2fHKWC2" transform="translate(-127.784998,-128.086989)">
<g>
<path
id="eB8dk2fHKWC4"
d="M85.4,249.8c23.68,5.5,48.32,7.57,72.25,2.34c24-5.25,45.3-18.59,61.62-36.79c8.57-9.56-5.53-23.75-14.14-14.14-14.23,15.89-31.86,27.05-52.79,31.65-20.31,4.46-41.55,2.33-61.61-2.34-12.54-2.91-17.88,16.36-5.33,19.28c0,0,0,0,0,0Z"
fill="#113053"
/>
</g>
<g>
<path
id="eB8dk2fHKWC6"
d="M249.74,169.63c5.5-23.68,7.57-48.32,2.34-72.25-5.25-24-18.59-45.3-36.79-61.62-9.56-8.57-23.75,5.53-14.14,14.14c15.89,14.23,27.05,31.86,31.65,52.79c4.46,20.31,2.33,41.55-2.34,61.61-2.92,12.54,16.36,17.88,19.28,5.33c0,0,0,0,0,0Z"
fill="#113053"
/>
</g>
<g>
<path
id="eB8dk2fHKWC8"
d="M171.68,7.71c-23.51-6.2-48.07-8.99-72.15-4.46C75.39,7.79,53.7,20.49,36.85,38.21c-8.84,9.31,4.83,23.9,13.72,14.55c14.7-15.46,32.65-26.1,53.7-30.08c20.43-3.86,41.6-1.1,61.52,4.15c12.43,3.28,18.35-15.83,5.89-19.12c0,0,0,0,0,0Z"
fill="#113053"
/>
</g>
<g>
<path
id="eB8dk2fHKWC10"
d="M5.83,85.46c-5.5,23.68-7.57,48.32-2.34,72.25c5.25,24,18.59,45.3,36.79,61.62c9.56,8.57,23.75-5.53,14.14-14.14-15.89-14.23-27.05-31.86-31.65-52.79-4.46-20.31-2.33-41.55,2.34-61.61C28.03,78.25,8.75,72.91,5.83,85.46v0Z"
transform="translate(.194904 0.217549)"
fill="#113053"
/>
</g>
</g>
</g>
</g>
<g
id="eB8dk2fHKWC11_ts"
transform="translate(139.784999,140.086986) scale(1,1)"
>
<g
id="eB8dk2fHKWC11"
transform="translate(-127.999996,-128.000003)"
opacity="0"
>
<path
d="M234.23,128c0-58.67-47.56-106.23-106.23-106.23s-106.23,47.56-106.23,106.23s47.56,106.23,106.23,106.23c58.64-.06,106.17-47.59,106.23-106.23m21.25,0c0,70.4-57.07,127.48-127.48,127.48s-127.48-57.08-127.48-127.48s57.08-127.48,127.48-127.48s127.48,57.08,127.48,127.48Z"
fill="#113053"
/>
</g>
</g>
<g
id="eB8dk2fHKWC13_tr"
transform="translate(139.785004,140.086979) rotate(0)"
>
<g
id="eB8dk2fHKWC13"
transform="translate(-127.999968,-127.995139)"
opacity="0"
>
<path
d="M128,0.47h.33c.36,0,.73,0,1.09.01h.17c5.45.09,9.79,4.57,9.73,10.02-.07,5.51-4.57,9.93-10.07,9.91h-1.24c-5.51-.04-9.96-4.51-9.96-10.02-.01-5.45,4.39-9.88,9.84-9.91h.11ZM245.62,118.39h.03c5.45.01,9.86,4.42,9.88,9.87c0,.04,0,.08,0,.12v0c0,.12,0,.24,0,.36v0c0,.01,0,.03,0,.04v.09c0,.37,0,.73-.01,1.09-.11,5.45-4.6,9.78-10.05,9.7-5.51-.08-9.92-4.6-9.88-10.1l.01-1.24c.06-5.49,4.52-9.92,10.02-9.93ZM126.01,235.58h.12l1.24.01c5.51.07,9.93,4.57,9.9,10.08-.04,5.48-4.51,9.89-9.99,9.85-.01,0-.02,0-.03,0h-.46-.19l-.82-.01h-.12c-5.45-.12-9.77-4.63-9.67-10.07.09-5.47,4.55-9.85,10.02-9.86ZM10.4,115.63h.2c5.51.12,9.89,4.65,9.82,10.16l-.02,1.24c-.09,5.5-4.59,9.91-10.1,9.88-5.45-.04-9.85-4.47-9.83-9.93c0-.04,0-.08,0-.12v0c0-.36,0-.73.01-1.09v-.09v0c0-.13,0-.27.01-.41.14-5.37,4.54-9.64,9.91-9.64Z"
fill="#113053"
/>
</g>
</g>
</svg>
);
};
export default Loader;

View File

@@ -0,0 +1,300 @@
#eB8dk2fHKWC2_tr {
animation: eB8dk2fHKWC2_tr__tr 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC2_tr__tr {
0% {
transform: translate(139.785027px, 140.086989px) rotate(45.236493deg);
animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
}
10% {
transform: translate(139.785027px, 140.086989px) rotate(-197.740907deg);
animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
}
20% {
transform: translate(139.785027px, 140.086989px) rotate(-108.6deg);
animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
}
30% {
transform: translate(139.785027px, 140.086989px) rotate(-17.484014deg);
animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
}
33.333333% {
transform: translate(139.785027px, 140.086989px) rotate(-17.48deg);
animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
}
43.333333% {
transform: translate(139.785027px, 140.086989px) rotate(160.887995deg)
}
100% {
transform: translate(139.785027px, 140.086989px) rotate(160.887995deg)
}
}
#eB8dk2fHKWC2_ts {
animation: eB8dk2fHKWC2_ts__ts 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC2_ts__ts {
0% {
transform: scale(1, 0.995019)
}
33.333333% {
transform: scale(1, 0.995019);
animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
}
43.333333% {
transform: scale(0.101121, 0.102033);
animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
}
50% {
transform: scale(0.1, 0.1);
animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
}
60% {
transform: scale(1, 1)
}
100% {
transform: scale(1, 1)
}
}
#eB8dk2fHKWC2 {
animation: eB8dk2fHKWC2_c_o 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC2_c_o {
0% {
opacity: 1
}
6.666667% {
opacity: 1
}
10% {
opacity: 0
}
13.333333% {
opacity: 0
}
20% {
opacity: 1
}
30% {
opacity: 1
}
36.666667% {
opacity: 1
}
40% {
opacity: 0
}
100% {
opacity: 0
}
}
#eB8dk2fHKWC4 {
animation: eB8dk2fHKWC4__m 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC4__m {
0% {
d: path('M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
}
10% {
d: path('M85.4,249.8C85.4,249.8,85.399999,249.800001,85.399999,249.800001C85.399999,249.800001,85.4,249.800002,85.4,249.800002C85.4,249.800002,90.484102,251.966034,95.043213,248.269966C100.484052,243.859082,98.694728,236.722769,97.073675,234.469349C95.517658,232.306335,94.559418,231.751273,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
}
20% {
d: path('M85.4,249.8C85.4,249.8,85.399999,249.800001,85.399999,249.800001C85.399999,249.800001,85.4,249.800002,85.4,249.800002C85.4,249.800002,90.484102,251.966034,95.043213,248.269966C100.484052,243.859082,98.694728,236.722769,97.073675,234.469349C95.517658,232.306335,94.559418,231.751273,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
}
30% {
d: path('M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
}
33.333333% {
d: path('M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
}
43.333333% {
d: path('M84.281285,246.076032C107.50521,254.051555,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,86.465691,239.82846,53.85604,207.193233C41.31604,204.283233,32.439249,213.928672,40.474905,219.54755C40.474905,219.54755,61.310295,238.187372,84.281285,246.076032Z')
}
100% {
d: path('M84.281285,246.076032C107.50521,254.051555,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,86.465691,239.82846,53.85604,207.193233C41.31604,204.283233,32.439249,213.928672,40.474905,219.54755C40.474905,219.54755,61.310295,238.187372,84.281285,246.076032Z')
}
}
#eB8dk2fHKWC6 {
animation: eB8dk2fHKWC6__m 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC6__m {
0% {
d: path('M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z')
}
10% {
d: path('M250.887564,168.08137C250.887564,168.081368,250.887563,168.081375,250.887563,168.081375C250.887563,168.081375,253.7831,157.676613,244.778825,154.781475C235.762034,151.882313,232.694053,158.881918,231.752888,162.486547C231.017121,165.304508,231.564293,168.517464,232.231509,169.666243C233.407087,171.690293,235.517449,173.828597,238.467701,174.606956C241.339242,175.364549,245.542656,175.427978,248.770823,172.704057C248.770823,172.704057,250.400569,171.202441,250.887564,168.08137Z')
}
20% {
d: path('M250.887564,168.08137C250.887564,168.081368,250.887563,168.081375,250.887563,168.081375C250.887563,168.081375,253.7831,157.676613,244.778825,154.781475C235.762034,151.882313,232.694053,158.881918,231.752888,162.486547C231.017121,165.304508,231.564293,168.517464,232.231509,169.666243C233.407087,171.690293,235.517449,173.828597,238.467701,174.606956C241.339242,175.364549,245.542656,175.427978,248.770823,172.704057C248.770823,172.704057,250.400569,171.202441,250.887564,168.08137Z')
}
30% {
d: path('M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z')
}
33.333333% {
d: path('M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z')
}
43.333333% {
d: path('M241.985702,180.287452C255.201364,145.393106,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,189.760952,38.146938,199.370952,46.756938C229.706596,66.855753,234.126292,101.544407,234.194759,127.574104C235.798839,155.047874,216.192342,185.901625,205.13,201.21C199.980012,208.336696,214.039151,220.128533,219.270001,215.35C219.270001,215.35,237.299554,192.660656,241.985702,180.287452Z')
}
100% {
d: path('M241.985702,180.287452C255.201364,145.393106,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,189.760952,38.146938,199.370952,46.756938C229.706596,66.855753,234.126292,101.544407,234.194759,127.574104C235.798839,155.047874,216.192342,185.901625,205.13,201.21C199.980012,208.336696,214.039151,220.128533,219.270001,215.35C219.270001,215.35,237.299554,192.660656,241.985702,180.287452Z')
}
}
#eB8dk2fHKWC8 {
animation: eB8dk2fHKWC8__m 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC8__m {
0% {
d: path('M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z')
}
10% {
d: path('M171.58686,7.8192C164.834536,7.661923,162.882928,13.414575,162.613915,14.669774C162.613914,14.669774,161.858025,17.37084,162.366976,18.743708C162.782522,19.864622,163.527502,21.022768,164.723558,21.957074C165.842173,22.830886,168.859974,24.254302,168.859974,24.254302C168.859974,24.254302,168.859968,24.254306,168.859967,24.254304C181.289967,27.534304,184.046866,11.109212,171.586866,7.819212C171.586866,7.819212,171.58686,7.8192,171.58686,7.8192Z')
}
20% {
d: path('M171.58686,7.8192C164.834536,7.661923,162.882928,13.414575,162.613915,14.669774C162.613914,14.669774,161.858025,17.37084,162.366976,18.743708C162.782522,19.864622,163.527502,21.022768,164.723558,21.957074C165.842173,22.830886,168.859974,24.254302,168.859974,24.254302C168.859974,24.254302,168.859968,24.254306,168.859967,24.254304C181.289967,27.534304,184.046866,11.109212,171.586866,7.819212C171.586866,7.819212,171.58686,7.8192,171.58686,7.8192Z')
}
30% {
d: path('M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z')
}
33.333333% {
d: path('M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z')
}
43.333333% {
d: path('M154.601291,1.547478C127.732134,-3.659063,101.676041,0.16217,89.834975,4.047622C73.018778,9.565582,43.015709,29.967817,36.85,38.21C28.01,47.52,41.568561,62.002759,50.57,52.76C67.005248,35.884138,77.788003,22.937369,100.935291,18.024709C148.028227,8.029949,175.904245,24.591662,199.370952,46.756938C210.775532,51.88401,219.463487,39.878796,215.289997,35.759998C189.664787,10.470596,154.601291,1.547478,154.601291,1.547478Z')
}
100% {
d: path('M154.601291,1.547478C127.732134,-3.659063,101.676041,0.16217,89.834975,4.047622C73.018778,9.565582,43.015709,29.967817,36.85,38.21C28.01,47.52,41.568561,62.002759,50.57,52.76C67.005248,35.884138,77.788003,22.937369,100.935291,18.024709C148.028227,8.029949,175.904245,24.591662,199.370952,46.756938C210.775532,51.88401,219.463487,39.878796,215.289997,35.759998C189.664787,10.470596,154.601291,1.547478,154.601291,1.547478Z')
}
}
#eB8dk2fHKWC10 {
animation: eB8dk2fHKWC10__m 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC10__m {
0% {
d: path('M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z')
}
3.333333% {
d: path('M4.90273,88.748028C1.236063,104.534694,0.694614,122.375568,4.181281,138.328902C7.119767,155.82704,18.329955,178.442148,31.722495,188.944182C39.448991,194.869945,48.960631,181.919808,35.808325,167.974185C27.053341,155.46954,26.778713,144.786038,23.180834,130.168643C19.139468,114.899686,18.114526,100.786543,20.952073,87.411869C21.572437,79.045425,6.897064,77.595457,4.916661,86.915441L4.90273,88.748028Z')
}
10% {
d: path('M3.04819,95.324083C3.04819,95.324083,5.563842,99.566705,5.563842,99.566705C5.563842,99.566705,11.253926,104.287825,15.031546,103.153927C19.091035,103.791214,24.274539,98.764542,25.851733,95.404259C27.275674,92.370488,25.596139,87.698114,24.002501,85.705929C20.798403,80.519057,13.463578,80.659628,12.636219,80.655608C8.65731,80.636275,3.191193,86.96637,3.089982,89.826322L3.04819,95.324083Z')
}
20% {
d: path('M3.04819,95.324083C3.04819,95.324083,5.563842,99.566705,5.563842,99.566705C5.563842,99.566705,11.253926,104.287825,15.031546,103.153927C19.091035,103.791214,24.274539,98.764542,25.851733,95.404259C27.275674,92.370488,25.596139,87.698114,24.002501,85.705929C20.798403,80.519057,13.463578,80.659628,12.636219,80.655608C8.65731,80.636275,3.191193,86.96637,3.089982,89.826322L3.04819,95.324083Z')
}
30% {
d: path('M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z')
}
33.333333% {
d: path('M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z')
}
43.333333% {
d: path('M36.436007,38.11681C-7.498754,85.801617,-0.826469,134.911183,5.658972,158.164678C15.873566,192.855226,35.43893,215.965329,40.28,219.33C49.84,227.9,63.271136,215.585685,53.661136,206.975685C38.384036,191.128398,25.999041,166.121323,22.77,152.4C12.429986,121.009925,27.020185,73.061168,50.245766,52.61587C65.058304,39.576508,51.054205,23.186387,36.436019,38.116819L36.436007,38.11681Z')
}
100% {
d: path('M36.436007,38.11681C-7.498754,85.801617,-0.826469,134.911183,5.658972,158.164678C15.873566,192.855226,35.43893,215.965329,40.28,219.33C49.84,227.9,63.271136,215.585685,53.661136,206.975685C38.384036,191.128398,25.999041,166.121323,22.77,152.4C12.429986,121.009925,27.020185,73.061168,50.245766,52.61587C65.058304,39.576508,51.054205,23.186387,36.436019,38.116819L36.436007,38.11681Z')
}
}
#eB8dk2fHKWC11_ts {
animation: eB8dk2fHKWC11_ts__ts 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC11_ts__ts {
0% {
transform: translate(139.784999px, 140.086986px) scale(1, 1)
}
30% {
transform: translate(139.784999px, 140.086986px) scale(1, 1)
}
43.333333% {
transform: translate(139.784999px, 140.086986px) scale(0.102813, 0.102813)
}
50% {
transform: translate(139.784999px, 140.086986px) scale(0.102813, 0.102813)
}
60% {
transform: translate(139.784999px, 140.086986px) scale(1.001075, 1.001075)
}
100% {
transform: translate(139.784999px, 140.086986px) scale(1.001075, 1.001075)
}
}
#eB8dk2fHKWC11 {
animation: eB8dk2fHKWC11_c_o 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC11_c_o {
0% {
opacity: 0
}
30% {
opacity: 0
}
36.666667% {
opacity: 0
}
40% {
opacity: 1
}
100% {
opacity: 1
}
}
#eB8dk2fHKWC13_tr {
animation: eB8dk2fHKWC13_tr__tr 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC13_tr__tr {
0% {
transform: translate(139.785004px, 140.086979px) rotate(0deg)
}
10% {
transform: translate(139.785004px, 140.086979px) rotate(0deg)
}
20% {
transform: translate(139.785004px, 140.086979px) rotate(90.041277deg)
}
100% {
transform: translate(139.785004px, 140.086979px) rotate(90.041277deg)
}
}
#eB8dk2fHKWC13 {
animation: eB8dk2fHKWC13_c_o 3000ms linear infinite normal forwards
}
@keyframes eB8dk2fHKWC13_c_o {
0% {
opacity: 0
}
6.666667% {
opacity: 0
}
10% {
opacity: 1
}
13.333333% {
opacity: 1
}
20% {
opacity: 0
}
100% {
opacity: 0
}
}