react-parabola/index.css

Parabolic motion of an object

.sale-list {
  margin-top: 40px;
}
.sale-list .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;
}
.shopping-cart .plus-one {
  display: none;
  width: 40px;
  line-height: 40px;
  text-align: center;
}
.shopping-cart .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;
  }
}