And I found my old pet project when I was interested in Sass. Well, this looks not very organic or rhythmic, not Brownian motion.
Pug:
- for (var x = 0; x < 11; x++)
div.b
Sass:
.b
width: 10vmin
height: 10vmin
border-radius: 50%
position: absolute
top: 0
left: 0
animation-iteration-count: infinite
animation-direction: alternate
animation-timing-function: linear
animation-fill-mode: backwards
@for $i from 1 through 15
@keyframes anm#{$i}
0%
left: 10vmin
top: 10vmin
opacity: 0
100%
left: random(250)+vmin
top: random(250)+vmin
transform: scale(random(3))
.b:nth-child(#{$i})
animation-name: anm#{$i}
animation-duration: random(20)+s
animation-delay: $i/10 +s
background: linear-gradient(45deg, rgb(random(255), random(255), random(255)), rgb(random(255), random(255), random(255)))
Top comments (0)