:doodle {
@grid: 10x10;
@size: 50em;
grid-gap: 1px;
}
:container {
grid-gap: 1px;
}
@shape: @p( heart, clover 5, star, hypocycloid 5, clover 5);
@size: @r(5em, 1em,0.5em);
background-color: hsla(@r(360), 85%, @r(70%, 90%), @r(.9));
transform: scale(@rand(.1,1.5,.9)) translate3d(@r(150px), @r(200px), 0) rotate(@r(360deg));
animation: test infinite @r(5000ms, 10000ms) ease-in-out;
@keyframes test {
0% {
transform: translate3d(0, 0, 0);
}
50% {
transform: translate3d(@r(-500%, 1000%), @r(-500%, 1000%), 0);
}
100% {
transform: translate3d(0, 0, 0);
}