react-parabola/example/style.less

Parabolic motion of an object

.sale-list {
	margin-top: 40px;
	.sale-item {
		margin: 120px 10px 10px;
		width: 50px;
		height: 50px;
		background: #ecf0f1;
		color: #fff;
		line-height: 50px;
		text-align: center;
		outline: none;
		cursor: pointer;
		border-radius: 4px;
	}
}
.shopping-cart {
	position: fixed;
	right: 20px;
	top: 150px;
	width: 40px;
	height: 40px;
	border: 1px #ddd solid;
	border-top: none;
	border-radius:8px 8px 4px 4px;

	.plus-one {
    display: none;
    width: 40px;
    line-height: 40px;
    text-align: center;
	}

	.plus-one_animate {
		display: inline-block;
		animation: show-plus 0.5s 1;
	}
}
.motion-item {
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	border-radius: 30px;
	background: #cfefdf;
	color: #00a854;
}


@keyframes show-plus {
	from {
		color: #00a854
	}
	to {
		color: #ffffff;
	}
}