december theme

assets/anim.december.scss

@@ -1,3 +1,10 @@
+@include css-animated-emote(REE) {
+    @include emote-animation(100ms, 7) {
+        0% { transform: translateX(0); }
+        100% { transform: translateX(3px); }
+    }
+}
+
 @include sprite-animation(
     $file-name: COGGERS,
     $frame-count: 60,

assets/anim.scss

@@ -218,6 +218,13 @@ $context-css-animated-emote-mixin: false;
     }
 }
 
+@include css-animated-emote(REE) {
+    @include emote-animation(100ms, 7) {
+        0% { transform: translateX(0); }
+        100% { transform: translateX(3px); }
+    }
+}
+
 @mixin Gigachad() {
     .text > .generify-container:has(+ .generify-container.generify-emote-Gigachad[data-modifiers~="mirror"]) {
         @content;
@@ -587,9 +594,9 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
 @include sprite-animation(
     $file-name: COGGERS,
     $frame-count: 60,
-    $sprite-width: 1920px,
-    $sprite-height: 32px,
-    $animation-duration: 800ms,
+    $sprite-width: 1680px,
+    $sprite-height: 28px,
+    $animation-duration: 1800ms,
     $iteration-count: 2
 );
 
@@ -614,8 +621,8 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
 @include sprite-animation(
     $file-name: PepoDance,
     $frame-count: 10,
-    $sprite-width: 460px,
-    $sprite-height: 32px,
+    $sprite-width: 280px,
+    $sprite-height: 28px,
     $animation-duration: 500ms,
     $iteration-count: 5
 );
@@ -631,8 +638,8 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
 
 @include sprite-animation(
     $file-name: LAG,
-    $frame-count: 9,
-    $sprite-width: 360px,
+    $frame-count: 10,
+    $sprite-width: 390px,
     $sprite-height: 32px,
     $animation-duration: 4000ms,
     $iteration-count: 2,
@@ -651,17 +658,17 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
 
 @include sprite-animation(
     $file-name: VroomVroom,
-    $frame-count: 101,
-    $sprite-width: 2828px,
-    $sprite-height: 28px,
-    $animation-duration: 4000ms,
-    $iteration-count: 2
+    $frame-count: 76,
+    $sprite-width: 7296px,
+    $sprite-height: 32px,
+    $animation-duration: 5320ms,
+    $iteration-count: 1
 );
 
 @include sprite-animation(
     $file-name: WAG,
     $frame-count: 2,
-    $sprite-width: 74px,
+    $sprite-width: 84px,
     $sprite-height: 32px,
     $animation-duration: 500ms,
     $iteration-count: 10
@@ -686,16 +693,6 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
     $iteration-count: 10
 );
 
-@include sprite-animation(
-    $file-name: ComfyWAG,
-    $frame-count: 2,
-    $sprite-width: 76px,
-    $sprite-height: 32px,
-    $animation-duration: 500ms,
-    $iteration-count: 10
-);
-
-
 @include sprite-animation(
     $file-name: illyaTriggered,
     $frame-count: 8,
@@ -787,23 +784,6 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
     $can-animate-forever: true
 );
 
-@include sprite-animation(
-    $file-name: REE,
-    $frame-count: 39,
-    $sprite-width: 1248px,
-    $sprite-height: 32px,
-    $animation-duration: 3900ms,
-    $animation-direction: alternate,
-    $iteration-count: 2,
-    $can-animate-forever: true,
-    $extra-animation: true,
-    $extra-animation-duration: 100ms,
-    $extra-animation-iteration-count: 64
-) {
-    0% { transform: translateX(0); }
-    100% { transform: translateX(3px); }
-}
-
 @include sprite-animation(
     $file-name: RIDIN,
     $frame-count: 8,
@@ -894,18 +874,6 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
     $can-animate-forever: true
 );
 
-@include sprite-animation(
-    $file-name: PepoWant,
-    $frame-count: 150,
-    $sprite-width: 7050px,
-    $sprite-height: 32px,
-    $animation-duration: 2.5s,
-    $animation-direction: alternate,
-    $iteration-count: 2,
-    $end-on-frame: 1,
-    $can-animate-forever: true
-);
-
 @include sprite-animation(
     $file-name: modCheck,
     $frame-count: 28,
@@ -917,17 +885,6 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
     $can-animate-forever: true
 );
 
-@include sprite-animation(
-    $file-name: DaFeels,
-    $frame-count: 180,
-    $sprite-width: 5760px,
-    $sprite-height: 32px,
-    $animation-duration: 5s,
-    $iteration-count: 1,
-    $end-on-last-frame: true,
-    $can-animate-forever: true
-);
-
 @include sprite-animation(
     $file-name: WICKEDSTEER,
     $frame-count: 24,
@@ -1030,17 +987,6 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
     $end-on-last-frame: true
 );
 
-@include sprite-animation(
-    $file-name: YEE,
-    $frame-count: 192,
-    $sprite-width: 11904px,
-    $sprite-height: 32px,
-    $animation-duration: 3.2s,
-    $iteration-count: 1,
-    $can-animate-forever: true,
-    $end-on-last-frame: true
-);
-
 @include sprite-animation(
     $file-name: HocusPocus,
     $frame-count: 33,
@@ -1092,12 +1038,164 @@ $spritesDir : '/assets/emotes/emoticons-animated/';
 );
 
 @include sprite-animation(
-    $file-name: AngelThump,
-    $frame-count: 90,
-    $sprite-width: 7560px,
+    $file-name: SNOWBALL,
+    $frame-count: 35,
+    $sprite-width: 1750px,
     $sprite-height: 32px,
-    $animation-duration: 3s,
+    $animation-duration: 2450ms,
+    $iteration-count: 2,
+    $can-animate-forever: true
+);
+
+@include sprite-animation(
+    $file-name: PeepoS,
+    $frame-count: 35,
+    $sprite-width: 1750px,
+    $sprite-height: 32px,
+    $animation-duration: 2450ms,
+    $iteration-count: 2,
+    $can-animate-forever: true
+);
+
+@include sprite-animation(
+    $file-name: PepoFight,
+    $frame-count: 35,
+    $sprite-width: 1855px,
+    $sprite-height: 32px,
+    $animation-duration: 2450ms,
+    $iteration-count: 2,
+    $can-animate-forever: true
+);
+
+@include sprite-animation(
+    $file-name: PeepoWeird,
+    $frame-count: 35,
+    $sprite-width: 1750px,
+    $sprite-height: 32px,
+    $animation-duration: 2450ms,
+    $iteration-count: 2,
+    $can-animate-forever: true,
+    $end-on-last-frame: true
+);
+
+@include sprite-animation(
+    $file-name: SNOWBALLFIGHT,
+    $frame-count: 70,
+    $sprite-width: 3500px,
+    $sprite-height: 32px,
+    $animation-duration: 4900ms,
     $iteration-count: 1,
     $can-animate-forever: true,
     $end-on-last-frame: true
 );
+
+@include sprite-animation(
+    $file-name: PepoSleep,
+    $frame-count: 91,
+    $sprite-width: 5642px,
+    $sprite-height: 32px,
+    $animation-duration: 6370ms,
+    $iteration-count: 1,
+    $can-animate-forever: true,
+    $end-on-last-frame: true
+);
+
+@include sprite-animation(
+    $file-name: OMEGALUL,
+    $frame-count: 11,
+    $sprite-width: 330px,
+    $sprite-height: 32px,
+    $animation-duration: 3080ms,
+    $iteration-count: 2,
+    $can-animate-forever: true,
+    $end-on-last-frame: true
+);
+
+@include sprite-animation(
+    $file-name: PauseChamp,
+    $frame-count: 80,
+    $sprite-width: 6480px,
+    $sprite-height: 32px,
+    $animation-duration: 1.2s,
+    $iteration-count: 4,
+    $can-animate-forever: true,
+    $end-on-last-frame: true
+);
+
+@include sprite-animation(
+    $file-name: DOGGO,
+    $frame-count: 181,
+    $sprite-width: 6154px,
+    $sprite-height: 32px,
+    $animation-duration: 3s,
+    $iteration-count: 2,
+    $can-animate-forever: true,
+    $end-on-last-frame: true
+);
+
+@include sprite-animation(
+    $file-name: ApeHands,
+    $frame-count: 91,
+    $sprite-width: 2912px,
+    $sprite-height: 32px,
+    $animation-duration: 2s,
+    $iteration-count: 3,
+    $can-animate-forever: true,
+    $end-on-last-frame: true
+);
+
+@include sprite-animation(
+    $file-name: SMUG,
+    $frame-count: 7,
+    $sprite-width: 238px,
+    $sprite-height: 32px,
+    $animation-duration: 1s,
+    $iteration-count: 3,
+    $can-animate-forever: true,
+    $extra-animation: true,
+    $extra-animation-duration: 333ms,
+    $extra-animation-iteration-count: 9
+) {
+    0% {
+        transform: translate(0px,0px);
+    }
+    25% {
+        transform: translate(0px,0.50px);
+        animation-timing-function: ease-in;
+    }
+    37% {
+        transform: translate(0px,0px);
+    }
+    55% {
+        transform: translate(0px,-2px);
+    }
+    60% {
+        transform: translate(0px,-1.5px);
+        animation-timing-function: ease;
+    }
+    100% {
+        transform: translate(0px,0px);
+    }
+}
+
+@include sprite-animation(
+    $file-name: TIMID,
+    $frame-count: 12,
+    $sprite-width: 384px,
+    $sprite-height: 32px,
+    $animation-duration: 1s,
+    $iteration-count: 1,
+    $end-on-last-frame: true,
+    $can-animate-forever: false,
+    $extra-animation: true,
+    $extra-animation-duration: 6s,
+    $extra-animation-delay: 500ms,
+    $extra-animation-iteration-count: 1
+) {
+    0% {background-position-y: 0px; }
+    10% {background-position-y: 20px; }
+}
+
+.generify-emote-TIMID:not(.chat-user + .generify-emote-TIMID) .chat-emote-TIMID {
+    background-position-x: 0px !important;
+}

assets/emotes.json

@@ -214,6 +214,8 @@
         "HocusPocus",
         "AlienPls",
         "Aware",
-        "LOGGERS"
+        "LOGGERS",
+        "SNOWBALL",
+        "SNOWBALLFIGHT"
     ]
 }