I found a SASS function for "starry sci" creating:
// n is number of stars required
@function multiple-box-shadow ($n)
$value: '#{random(2000)}px #{random(2000)}px #FFF'
@for $i from 2 through $n
$value: '#{$value} , #{random(2000)}px #{random(2000)}px #FFF'
@return unquote($value)
#stars{
box-shadow: multiple-box-shadow(700)
}
I want to translate it to Stylus, but something doesn't work. I try:
random(min, max)
return floor( math(0, "random") * max + min )
$coordinates = random(1, 2000)px
$distortion = random(1, 20)px
// n is number of stars required
multiple-box-shadow($n)
for $i in (1..$n)
$value = $coordinates $coordinates $distortion $distortion #FFFFFF,
return $value
#stars
box-shadow multiple-box-shadow(700)
random function run only ones and the box-shadow value add only once... Can anybody help?
Here's a CodePen snippet to view compiled CSS
My colleague suggested this solution to me: