JSFiddle - React, Tailwind, and code Playground

by Vanessa RC

CoffeeScript

# Set device background
Screen.backgroundColor = "#00D5C4"
	
circle = new Layer
	backgroundColor: "#1AEADA"
	borderRadius: 1000
	width: 500
	height: 500
	x: 120
	y: 300
	scale: 0
	rotation: -360
	
logo = new Layer
	width: 274
	height: 366
	x: 230
	y: 360
	image: "images/logo.png"
	scale: 0

text = new Layer
	width: 218
	height: 38
	image: "images/welcome.png"
	x: 270
	y: 860
	scale: 0
	
init = (circle, logo, text) -> 	
	circle.animate 
		properties: 
			scale: 1
		time: 6
		delay: 0.8
		curve: "spring(300,40,60)"
		
	logo.animate 
		properties: 
			scale: 1
		time: 1
		delay: 0.8
		curve: "spring(300,40,60)"
		
		
	text.animate 
		properties: 
			scale: 1
		time: 1
		delay: 1.2
		curve: "spring(200,15,0)"

	return circle + logo + text
 init(circle, logo, text)