2022-06-09 16:26:27 +02:00
|
|
|
import { Stear } from "../stear/main.js";
|
2022-06-09 15:29:53 +02:00
|
|
|
|
|
|
|
|
var animation = Stear.addAnimation({
|
|
|
|
|
"0%": {left: "4%",top: "4%"},
|
|
|
|
|
"8.33%": {left: "52%",top: "4%"},
|
|
|
|
|
"25%": {left: "52%",top: "4%"},
|
|
|
|
|
"33.33%": {left: "52%",top: "52%"},
|
|
|
|
|
"50%": {left: "52%",top: "52%"},
|
|
|
|
|
"58.33%": {left: "4%",top: "52%"},
|
|
|
|
|
"75%": {left: "4%",top: "52%"},
|
|
|
|
|
"83.33%": {left: "4%",top: "4%"},
|
|
|
|
|
"100%": {left: "4%",top: "4%"},
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
Stear.addGlobalStyleJSON({
|
|
|
|
|
display: "inline-block",
|
|
|
|
|
position: "relative",
|
|
|
|
|
width: "80px",
|
|
|
|
|
height: "80px",
|
|
|
|
|
},".box");
|
|
|
|
|
|
|
|
|
|
Stear.addGlobalStyleJSON({
|
|
|
|
|
position: "absolute",
|
|
|
|
|
height: "44%",
|
|
|
|
|
width: "44%",
|
|
|
|
|
borderRadius: "25%",
|
|
|
|
|
backgroundColor: "#000",
|
|
|
|
|
animation: `${animation} 6s linear infinite`,
|
|
|
|
|
},".box div");
|
|
|
|
|
|
|
|
|
|
Stear.addGlobalStyleJSON({
|
|
|
|
|
animationDelay: "0s"
|
|
|
|
|
}, ".box div:nth-child(1)");
|
|
|
|
|
|
|
|
|
|
Stear.addGlobalStyleJSON({
|
|
|
|
|
animationDelay: "-2s"
|
|
|
|
|
}, ".box div:nth-child(2)");
|
|
|
|
|
|
|
|
|
|
Stear.addGlobalStyleJSON({
|
|
|
|
|
animationDelay: "-4s"
|
|
|
|
|
}, ".box div:nth-child(3)");
|
|
|
|
|
|
