merge upstream

src/app/components/combat/player-combat-card/player-combat-card.component.css

@@ -1,61 +1,3 @@
-@keyframes weapon-collapse-side-in-left {
-  0% {
-    background: rgba(15, 25, 35, 0.6);
-    opacity: 0;
-  }
-  40% {
-    transform: scaleX(0) translateX(-50%);
-    opacity: 0;
-  }
-  90% {
-    background: rgba(15, 25, 35, 0.6);
-  }
-  100% {
-    transform: scaleX(1) translateX(0%);
-    opacity: 1;
-  }
-}
-
-@keyframes weapon-collapse-side-in-right {
-  0% {
-    background: rgba(15, 25, 35, 0.6);
-    opacity: 0;
-  }
-  40% {
-    transform: scaleX(0) translateX(50%);
-    opacity: 0;
-  }
-  90% {
-    background: rgba(15, 25, 35, 0.6);
-  }
-  100% {
-    transform: scaleX(1) translateX(0%);
-    opacity: 1;
-  }
-}
-
-.animate-weapon-collapse-in {
-  transform-origin: left;
-  animation-name: weapon-collapse-side-in-left;
-}
-
-.animate-weapon-collapse-in.right {
-  transform-origin: right;
-  animation-name: weapon-collapse-side-in-right;
-}
-
-.animate-weapon-collapse-out {
-  transform-origin: left;
-  animation-name: weapon-collapse-side-in-left;
-  animation-direction: reverse;
-}
-
-.animate-weapon-collapse-out.right {
-  transform-origin: right;
-  animation-name: weapon-collapse-side-in-right;
-  animation-direction: reverse;
-}
-
 @keyframes hpbar-in {
   0% {
     width: 0%;

src/app/components/combat/player-combat-card/player-combat-card.component.html

@@ -303,8 +303,6 @@
   @if (player.isAlive) {
     <div
       class="vw-120 border-timer relative flex flex-col justify-center"
-      animate.enter="animate-weapon-collapse-in animate-duration-200 animate-style-both"
-      animate.leave="animate-weapon-collapse-out animate-duration-150 animate-style-keep"
       [class.items-end]="right()"
       [class]="[weaponInfoBackgroundClass(), right() ? 'rounded-tl-sm' : 'rounded-tr-sm']"
       [class.right]="right()"

src/app/components/combat/player-list/player-list.component.css

@@ -13,7 +13,7 @@
 }
 
 .animate-slide-in.left {
-  animation: slide-in-left cubic-bezier(0.33, 1, 0.68, 1);
+  animation: slide-in-left cubic-bezier(0.66, 0, 0.236, 1);
   will-change: opacity;
 }
 
@@ -32,7 +32,7 @@
 }
 
 .animate-slide-out.left {
-  animation: slide-out-left cubic-bezier(0.32, 0, 0.67, 0);
+  animation: slide-out-left cubic-bezier(0.66, 0, 0.236, 1);
   will-change: opacity;
 }
 
@@ -51,7 +51,7 @@
 }
 
 .animate-slide-in.right {
-  animation: slide-in-right cubic-bezier(0.33, 1, 0.68, 1);
+  animation: slide-in-right cubic-bezier(0.66, 0, 0.236, 1);
   will-change: opacity;
 }
 
@@ -70,6 +70,6 @@
 }
 
 .animate-slide-out.right {
-  animation: slide-out-right cubic-bezier(0.32, 0, 0.67, 0);
+  animation: slide-out-right cubic-bezier(0.66, 0, 0.236, 1);
   will-change: opacity;
 }

src/app/components/combat/player-list/player-list.component.html

@@ -11,8 +11,8 @@
               [isAlive]="player.isAlive"
               [right]="tIdx === 1"
               [color]="team.isAttacking ? 'attacker' : 'defender'"
-              animate.enter="animate-slide-in animate-duration-200"
-              animate.leave="animate-slide-out animate-duration-100"
+              animate.enter="animate-slide-in animate-duration-230"
+              animate.leave="animate-slide-out animate-duration-150"
               [class]="tIdx === 0 ? 'left' : 'right'"
             ></app-player-combat-card>
           } @else {
@@ -23,8 +23,8 @@
               [isAlive]="player.isAlive"
               [right]="tIdx === 1"
               [color]="team.isAttacking ? 'attacker' : 'defender'"
-              animate.enter="animate-slide-in animate-duration-200"
-              animate.leave="animate-slide-out animate-duration-100"
+              animate.enter="animate-slide-in animate-duration-230"
+              animate.leave="animate-slide-out animate-duration-150"
               [class]="tIdx === 0 ? 'left' : 'right'"
             >
             </app-player-combat-card-minimal>

src/app/components/common/abilities/abilities.component.css

@@ -1,31 +0,0 @@
-@keyframes translate-to-right {
-  from {
-    transform: translateX(-100%) scaleX(0.7);
-  }
-  to {
-    transform: translateX(0%) scaleX(1);
-  }
-}
-
-@keyframes translate-to-left {
-  from {
-    transform: translateX(100%) scaleX(0.7);
-  }
-  to {
-    transform: translateX(0%) scaleX(1);
-  }
-}
-
-.animate-translate {
-  animation: translate-to-right;
-  will-change: transform;
-}
-
-.animate-translate.right {
-  animation: translate-to-left;
-  will-change: transform;
-}
-
-.animate-reverse {
-  animation-direction: reverse !important;
-}

src/app/components/common/abilities/abilities.component.html

@@ -4,8 +4,6 @@
       class="flex w-full flex-row justify-between gap-6 overflow-hidden"
       [class.justify-end]="right"
       [class.right]="right"
-      animate.enter="animate-translate animate-duration-250"
-      animate.leave="animate-translate animate-reverse animate-duration-200"
     >
       <div class="flex flex-col gap-1.5">
         <img
@@ -66,8 +64,6 @@
         class="vw-22 animate-style-early"
         [class.brightness-35]="!isAvailable(player.abilities?.ability2 || 0)"
         src="assets/ability2/{{ player.agentInternal }}Ability2.webp"
-        animate.enter="animate-fade-in animate-duration-250 animate-delay-300"
-        animate.leave="animate-fade-out animate-duration-200"
       />
     </div>
   }

src/app/components/shopping/roundreasons/roundreasons.component.css

@@ -41,7 +41,13 @@
 @keyframes animations-reasons {
   0% {
     opacity: 0;
-    transform: translateY(100%);
+    transform: translateY(200%);
+  }
+  40% {
+    opacity: 0;
+  }
+  89.9% {
+    opacity: 0.7;
   }
   100% {
     opacity: 1;

src/app/components/shopping/roundreasons/roundreasons.component.html

@@ -1,8 +1,8 @@
 @if (isShown()) {
   <div
-    class="max-vw-615 vh-100 relative flex flex-row items-center py-0.5"
-    animate.enter="animate-reasons-in animate-duration-180"
-    animate.leave="animate-reasons-out animate-duration-180"
+    class="max-vw-615 vh-100 relative flex flex-row items-center py-0.5 overflow-visible"
+    animate.enter="animate-reasons-in animate-duration-330"
+    animate.leave="animate-reasons-out animate-duration-330"
   >
     <!-- Main background element underneath everything -->
     <div

src/app/components/shopping/scoreboard/scoreboard.component.css

@@ -23,6 +23,12 @@
     opacity: 1;
     transform: translateY(0%);
   }
+  0.1% {
+    opacity: 0.7;
+  }
+  60% {
+    opacity: 0;
+  }
   100% {
     opacity: 0;
     transform: translateY(18rem);

src/app/components/shopping/scoreboard/scoreboard.component.html

@@ -1,8 +1,8 @@
 @if (isShown()) {
   <div
     class="vw-1920 vh-316 mt-53.5 flex flex-row bg-[#171C22B3]"
-    animate.enter="animate-scoreboard-in animate-duration-180"
-    animate.leave="animate-scoreboard-out animate-duration-180"
+    animate.enter="animate-scoreboard-in animate-duration-330"
+    animate.leave="animate-scoreboard-out animate-duration-330"
   >
     <div class="absolute top-[22vh] left-[58vh] opacity-35">
       <img

src/app/overlays/testing/testing.component.ts

@@ -378,11 +378,11 @@ export class TestingComponent implements OnInit {
               locked: false,
             },
             {
-              name: "BeeSting",
-              fullName: "BeeSting#DEBUG",
+              name: "delusion",
+              fullName: "delusion#DEBUG",
               playerId: 0,
               isAlive: true,
-              agentInternal: "Terra",
+              agentInternal: "Rift",
               isObserved: false,
               armorName: "Heavy",
               money: 2100,