:doodle {
@grid: 1x40 / 100vmin;
}
@place-cell: center;
width: @rand(100vmin, 100vmin);
height: @rand(100vmin, 100vmin);
transform: translate(@rand(-120%, 120%), @rand(-100%, 100%)) scale(@rand(.8, 5)) skew(@rand(45deg));
clip-path: polygon(
@r(0, 50%) @r(0, 80%),
@r(30%, 60%) @r(0%, 30%),
@r(60%, 100%) @r(0%, 50%),
@r(60%, 100%) @r(50%, 100%),
@r(30%, 60%) @r(60%, 100%),
@r(0, 30%) @r(60%, 100%)
);
background: @pick(#f4433699, #357DDF99, #84BCFF99, #FFDBB799, #6DCAFA99, #FFAACA99, #e6437d99,
#ebbf4d99, #00bcd499, #03a9f499,
#2196f399, #68B77199, #5ee46399, #f8e64599, #ffc10799, #ff572299, #43f8bf99, #e136eb99, #f57c2399,
#32ed3999);
opacity: @rand(.2, .4);
position: relative;
top: @rand(-150%, 150%);
left: @rand(-150%, 150%);
animation: colorChange @rand(6.1s, 26.1s) infinite @rand(-.5s, -2.5s) linear alternate;
@keyframes colorChange {
100% {
left: 100;
top: ;
filter: hue-rotate(360deg);
}
}
