init

animation.css

@@ -0,0 +1,245 @@
+@keyframes fade-in {
+	from {
+		opacity: 0;
+	}
+
+	to {
+		opacity: 1;
+	}
+}
+
+@keyframes open {
+	from {
+		transform: scale(0);
+	}
+
+	to {
+		transform: scale(1);
+	}
+}
+
+@keyframes open-dialog {
+	from {
+		opacity: 0.1;
+		transform: scale(0.8);
+	}
+
+	to {
+		opacity: 1;
+		transform: scale(1);
+	}
+}
+
+@keyframes close-dialog {
+	from {
+		opacity: 1;
+		transform: scale(1);
+	}
+
+	to {
+		opacity: 0;
+		transform: scale(0.8);
+	}
+}
+
+@keyframes moveout-left {
+	from {
+		left: 100%;
+	}
+
+	to {
+		left: -100%;
+	}
+}
+
+@keyframes player-died {
+
+	5%,
+	15%,
+	25%,
+	35%,
+	55%,
+	65% {
+		transform: translateX(5px) rotate(0deg);
+	}
+
+	10%,
+	30%,
+	40%,
+	50%,
+	70% {
+		transform: translateX(-5px) rotate(0deg);
+	}
+
+	20%,
+	60% {
+		transform: translate(-1px) rotate(0deg);
+	}
+
+	45%,
+	85% {
+		transform: translateX(1px) rotate(0deg);
+	}
+
+	95% {
+		transform: translateX(-2px) rotate(0deg);
+	}
+
+	100% {
+		transform: none;
+	}
+}
+
+@keyframes use-card {
+	0% {
+		transform: scale(4);
+		opacity: 1;
+	}
+
+	20% {
+		transform: scale(1);
+		opacity: 1;
+	}
+
+	100% {
+		transform: scale(1);
+		opacity: 0;
+	}
+}
+
+@keyframes turned-over {
+	0% {
+		transform: rotateY(0deg);
+	}
+
+	50% {
+		transform: rotateY(90deg);
+	}
+
+	100% {
+		transform: rotateY(0deg);
+	}
+}
+
+@keyframes open-fade-in {
+	from {
+		opacity: 0;
+		transform: scale(0.7);
+	}
+
+	to {
+		opacity: 1;
+		transform: scale(1);
+	}
+}
+
+@keyframes open-fade-in-out {
+	0% {
+		opacity: 0;
+		transform: scale(0.7);
+	}
+
+	40% {
+		opacity: 1;
+		transform: scale(1);
+	}
+
+	60% {
+		opacity: 1;
+		transform: scale(1);
+	}
+
+	100% {
+		opacity: 0;
+		transform: scale(1);
+	}
+}
+
+@keyframes player-hurt {
+	0% {
+		transform: translateX(0px);
+	}
+
+	4% {
+		transform: translateX(1px);
+	}
+
+	50% {
+		transform: translateX(-14px);
+	}
+
+	100% {
+		transform: translateX(0px);
+	}
+}
+
+@keyframes fade-in-out-selectable {
+	0% {
+		opacity: 0;
+	}
+
+	50% {
+		opacity: 0.2;
+	}
+
+	100% {
+		opacity: 0;
+	}
+}
+
+@keyframes swing {
+	0% {
+		transform: rotate(-5deg);
+		transform-origin: top center;
+	}
+
+	100% {
+		transform: rotate(5deg);
+		transform-origin: top center;
+	}
+}
+
+@keyframes kf-sprites-glow {
+	0% {
+		background-size: 2300px 100%;
+		background-position: 0px 0px;
+	}
+
+	10.00% {
+		background-position: -230px 0px;
+	}
+
+	20.00% {
+		background-position: -460px 0px;
+	}
+
+	30.00% {
+		background-position: -690px 0px;
+	}
+
+	40.00% {
+		background-position: -920px 0px;
+	}
+
+	50.00% {
+		background-position: -1150px 0px;
+	}
+
+	60.00% {
+		background-position: -1380px 0px;
+	}
+
+	70.00% {
+		background-position: -1610px 0px;
+	}
+
+	80.00% {
+		background-position: -1840px 0px;
+	}
+
+	90.00%,
+	100% {
+		background-size: 2300px 100%;
+		background-position: -2070px 0px;
+	}
+}