:doodle {
@grid:15 / 100%;
width:100vw;
height:100vh;
}
/*snowing cats and dogs*/
:after {
content:@p(ðķ,ðķ,ðķ,ðĐ,ðĐ,ðĐ,ðš,ðš,ðą,ðļ ,ðđ,ðŧ,ðū,ðŋ,ð,ðĶ,ð,ð
,ð);
}
/*and some barnyard friends*/
@random(.13) {
:after {
content:@p(ð,ð,ð,ð,ð,ð
,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð,ð ,ðĄ,ðĒ,ðĢ,ðĪ,ðĨ,ðĶ,ð§,ðĻ,ðĐ,ðŠ,ðŦ,ðŽ,ð,ðŪ,ðŊ,ð°,ðē,ðģ,ðī,ðĩ,ðķ,ð·,ðļ,ðđ,ðš,ðŧ,ðž,ð―,ð·,ð,ð,ð,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ
,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ,ðĶ ,ðĶĄ,ðĶĒ);
}
}
font-size:@p(3vmin, 4vmin, 1.75em);
text-shadow:2px 2px white;
animation: snow @r(8s, 25s) infinite linear;
@random(.3) { animation: snow @r(15s, 30s) infinite linear;
font-size:@p(2vmin, 3vmin, 1.5em);
}
@random(.05) { animation: snow @r(7s, 17s) infinite linear;
font-size:@p(1em,1vmin);
}
will-change:transform;
@keyframes snow {
0% {
transform: translateY(-200vh) translateX(@r(-10px, 10px));
}
100% {
transform:translateY(100vh) translateX(calc(.1*@index()*@p(-2vmin,2vmin))) rotate(@r(-720deg, 720deg));
}
}