From b4a62b3b20af27afa080be63056bf2f12c3de44f Mon Sep 17 00:00:00 2001
From: thepaperpilot <thepaperpilot@gmail.com>
Date: Sat, 25 Feb 2023 18:48:36 -0600
Subject: [PATCH] Minor graphic tweaks

---
 src/data/common.css    | 14 +++++++++++---
 src/data/projEntry.tsx |  4 ++--
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/data/common.css b/src/data/common.css
index 374b56a..3044d00 100644
--- a/src/data/common.css
+++ b/src/data/common.css
@@ -220,7 +220,7 @@
 }
 
 .waiting {
-    font-size: 4vmin;
+    font-size: 2vmin;
     height: 8vmin;
     display: flex;
     align-items: center;
@@ -260,6 +260,7 @@
     background: var(--background);
     filter: drop-shadow(2px 4px 6px black);
     text-shadow: -1px 1px 0 var(--raised-background), 1px 1px 0 var(--raised-background), 1px -1px 0 var(--raised-background), -1px -1px 0 var(--raised-background);
+    z-index: 1;
 }
 
 .stream-details {
@@ -338,12 +339,19 @@
 }
 
 .character-transition-enter-from {
-    transform: translateY(100%);
+    transform: translateX(-100%);
 }
 .character-transition-leave-to {
+    transform: translateX(100%);
+}
+.streamer-transition-enter-from {
+    transform: translateY(100%);
+}
+.streamer-transition-leave-to {
     transform: translateY(-100%);
 }
-.character-trensition-active {
+.character-trensition-active,
+.streamer-transition-active {
     position: absolute;
 }
 
diff --git a/src/data/projEntry.tsx b/src/data/projEntry.tsx
index a94d679..ac60875 100644
--- a/src/data/projEntry.tsx
+++ b/src/data/projEntry.tsx
@@ -995,7 +995,7 @@ export const main = createLayer("main", function (this: BaseLayer) {
                                         </div>
                                     </div>
                                     <Row class="streamers-container">
-                                        <TransitionGroup name="character-transition">
+                                        <TransitionGroup name="streamer-transition">
                                             {battle.value.streamers
                                                 .slice()
                                                 .reverse()
@@ -1056,7 +1056,7 @@ export const main = createLayer("main", function (this: BaseLayer) {
                                         </div>
                                     </div>
                                     <Row class="streamers-container">
-                                        <TransitionGroup name="character-transition">
+                                        <TransitionGroup name="streamer-transition">
                                             {battle.value.enemyStreamers.map((streamer, i) => (
                                                 <CharacterSlot
                                                     key={i}