gingerbread award

files/events/assets/css/blizzard.css

@@ -346,6 +346,200 @@ body {
 	border-radius: 9999px;
   }  
 
-/* award replacements */
-/* train awards */
+/* awards */
 
+/* gingerbread */
+.fall-snowflake {
+	color: #fff;
+	font-size: 1em;
+	font-family: Serif;
+	text-shadow: 0 0 1px #000;
+  pointer-events: none;
+}
+
+@-webkit-keyframes fall-snowflakes-fall {
+	0% {
+		top: -20%
+	}
+	100% {
+		top: 100%
+	}
+}
+
+@-webkit-keyframes fall-snowflakes-shake {
+	0% {
+		-webkit-transform: translateX(0px);
+		transform: translateX(0px)
+	}
+	50% {
+		-webkit-transform: translateX(80px);
+		transform: translateX(80px)
+	}
+	100% {
+		-webkit-transform: translateX(0px) rotate(360deg);
+		transform: translateX(0px) rotate(360deg);
+	}
+}
+
+@keyframes fall-snowflakes-fall {
+	0% {
+		top: -20%
+	}
+	100% {
+		top: 100%
+	}
+}
+
+@keyframes fall-snowflakes-shake {
+	0% {
+		transform: translateX(0px)
+	}
+	50% {
+		transform: translateX(80px)
+	}
+	100% {
+		transform: translateX(0px) rotate(360deg);
+	}
+}
+
+.fall-snowflake {
+	position: fixed;
+	top: -20%;
+	z-index: 9999;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+	cursor: default;
+	-webkit-animation-name: fall-snowflakes-fall, fall-snowflakes-shake;
+	-webkit-animation-duration: 10s, 4s;
+	-webkit-animation-timing-function: linear, ease-in-out;
+	-webkit-animation-iteration-count: infinite, infinite;
+	-webkit-animation-play-state: running, running;
+	animation-name: fall-snowflakes-fall, fall-snowflakes-shake;
+	animation-duration: 10s, 4s;
+	animation-timing-function: linear, ease-in-out;
+	animation-iteration-count: infinite, infinite;
+	animation-play-state: running, running
+}
+
+.fall-snowflake:nth-of-type(0) {
+	left: 1%;
+	-webkit-animation-delay: 0s, 0s;
+	animation-delay: 0s, 0s
+}
+.fall-snowflake:nth-of-type(1) {
+	left: 10%;
+	-webkit-animation-delay: 1s, 1s;
+	animation-delay: 1s, 1s
+}
+.fall-snowflake:nth-of-type(2) {
+	left: 20%;
+	-webkit-animation-delay: 6s, .5s;
+	animation-delay: 6s, .5s
+}
+.fall-snowflake:nth-of-type(3) {
+	left: 30%;
+	-webkit-animation-delay: 4s, 2s;
+	animation-delay: 4s, 2s
+}
+.fall-snowflake:nth-of-type(4) {
+	left: 40%;
+	-webkit-animation-delay: 2s, 2s;
+	animation-delay: 2s, 2s
+}
+.fall-snowflake:nth-of-type(5) {
+	left: 50%;
+	-webkit-animation-delay: 8s, 3s;
+	animation-delay: 8s, 3s
+}
+.fall-snowflake:nth-of-type(6) {
+	left: 60%;
+	-webkit-animation-delay: 6s, 2s;
+	animation-delay: 6s, 2s
+}
+.fall-snowflake:nth-of-type(7) {
+	left: 70%;
+	-webkit-animation-delay: 2.5s, 1s;
+	animation-delay: 2.5s, 1s
+}
+.fall-snowflake:nth-of-type(8) {
+	left: 80%;
+	-webkit-animation-delay: 1s, 0s;
+	animation-delay: 1s, 0s
+}
+.fall-snowflake:nth-of-type(9) {
+	left: 90%;
+	-webkit-animation-delay: 3s, 1.5s;
+	animation delay: 3s, 1.5s
+}
+.fall-snowflake:nth-of-type(10) {
+	left: 100%;
+	-webkit-animation-delay: 3s, 2s;
+	animation-delay: 3s, 2s
+}
+.fall-snowflake:nth-of-type(11) {
+	left: 5%;
+	-webkit-animation-delay: 1s, 4s;
+	animation-delay: 1s, 4s
+}
+.fall-snowflake:nth-of-type(12) {
+	left: 15%;
+	-webkit-animation-delay: 1s, 1.5s;
+	animation-delay: 1s, 1.5s
+}
+.fall-snowflake:nth-of-type(13) {
+	left: 25%;
+	-webkit-animation-delay: 6s, 2.5s;
+	animation-delay: 6s, 2.5s
+}
+.fall-snowflake:nth-of-type(14) {
+	left: 35%;
+	-webkit-animation-delay: 4s, 1s;
+	animation-delay: 4s, 1s
+}
+.fall-snowflake:nth-of-type(15) {
+	left: 45%;
+	-webkit-animation-delay: 2s, 4s;
+	animation-delay: 2s, 4s
+}
+.fall-snowflake:nth-of-type(16) {
+	left: 55%;
+	-webkit-animation-delay: 8s, 3s;
+	animation-delay: 8s, 3s
+}
+.fall-snowflake:nth-of-type(17) {
+	left: 65%;
+	-webkit-animation-delay: 6s, 3s;
+	animation-delay: 6s, 3s
+}
+.fall-snowflake:nth-of-type(18) {
+	left: 75%;
+	-webkit-animation-delay: 2.5s, 4s;
+	animation-delay: 2.5s, 4s
+}
+.fall-snowflake:nth-of-type(19) {
+	left: 85%;
+	-webkit-animation-delay: 2s, 0s;
+	animation-delay: 2s, 0s
+}
+.fall-snowflake:nth-of-type(20) {
+	left: 95%;
+	-webkit-animation-delay: 3s, 1.5s;
+	animation delay: 3s, 1.5s
+}
+
+.animate-spin {
+  animation: spin 5600ms linear infinite;
+}
+
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* */

files/events/helpers/const.py

@@ -1,4 +1,53 @@
 EVENT_AWARDS = {
-
+    "snow": {
+		"kind": "snow",
+		"title": "Snow",
+		"description": "",
+		"icon": "fas fa-snowflake",
+		"color": "text-blue-200",
+		"price": 300,
+		"deflectable": False,
+		"cosmetic": True
+	},
+	"gingerbread": {
+		"kind": "gingerbread",
+		"title": "Gingerbread",
+		"description": "",
+		"icon": "fas fa-gingerbread-man",
+		"color": "",
+		"price": 300,
+		"deflectable": False,
+		"cosmetic": True
+	},
+	"lights": {
+		"kind": "lights",
+		"title": "Lights",
+		"description": "",
+		"icon": "fas fa-lights-holiday",
+		"color": "",
+		"price": 300,
+		"deflectable": False,
+		"cosmetic": True
+	},
+	"candycane": {
+		"kind": "candycane",
+		"title": "Candy Cane",
+		"description": "",
+		"icon": "fas fa-candy-cane",
+		"color": "",
+		"price": 400,
+		"deflectable": False,
+		"cosmetic": True
+	},
+	"fireplace": {
+		"kind": "fireplace",
+		"title": "Fireplace",
+		"description": "",
+		"icon": "fas fa-fireplace",
+		"color": "",
+		"price": 600,
+		"deflectable": False,
+		"cosmetic": True
+	},
 }
 EVENT_FORCED_HAT = '/i/hats/Santa Hat I.webp?h=7'

files/events/templates/awards.html

@@ -0,0 +1,7 @@
+<div class="awards-container">
+	{% for i in range(p.award_count("gingerbread", v)) %}
+		<div class="fall-snowflake">
+			<img src="/i/event/awards/gingerbread.png?v=1" class="animate-spin object-contain" style="width: 40px; height: 40px;" alt="animate marsey gingerbread icon" />
+		</div>
+	{% endfor %}
+</div>