ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

old decay

Browse Source
This commit is contained in:
ntr 2019-07-03 00:05:38 +10:00
parent 7bdbdd2fd4
commit b5b22ed558
1 changed files with 13 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
client/src/components/anims/decay.jsx
View File

@ -19,12 +19,18 @@ class Decay extends Component {
version="1.1" version="1.1"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 300 300"> viewBox="0 0 300 300">
<defs>
<filter id="decayFilter">
<feGaussianBlur in="SourceGraphic" stdDeviation="3" />
<feMerge>
<feMergeNode />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
</defs>
<g> <g>
{times(15, () => ( {times(15, () => (
<g class="box"> <rect filter="url(#decayFilter)" class="blue" x="135" y="135" width="20" height="20" />
<rect class="blue" x="135" y="135" width="30" height="30" />
<rect class="white" style={{ strokeWidth: '2px' }} x="135" y="135" width="30" height="30" />
</g>
))} ))}
</g> </g>
</svg> </svg>
@ -42,7 +48,9 @@ class Decay extends Component {
})); }));
this.animations.push(anime({ this.animations.push(anime({
targets: ['#decay .box'], targets: ['#decay rect'],
stroke: [COLOURS.WHITE, COLOURS.BLUE],
strokeWidth: [4, 2],
transform: () => ` transform: () => `
translate(${anime.random(-120, 120)} ${anime.random(-120, 120)}) translate(${anime.random(-120, 120)} ${anime.random(-120, 120)})
rotate(${anime.random(-15, 15)}) rotate(${anime.random(-15, 15)})