From 7624724efc42e6ea92708aa2a3e8507d09dbf270 Mon Sep 17 00:00:00 2001
From: vyneer <vyn33r@gmail.com>
Date: Mon, 15 Jul 2024 14:21:30 +0300
Subject: [PATCH] fix: remove some performance-impacting css properties

---
 assets/chat/css/style.scss                  | 15 +++++++++------
 assets/chat/js/messages/ChatEventMessage.js |  1 +
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/assets/chat/css/style.scss b/assets/chat/css/style.scss
index 60304a45..7071b5cc 100644
--- a/assets/chat/css/style.scss
+++ b/assets/chat/css/style.scss
@@ -273,8 +273,6 @@ hr {
 .chat-lines {
   font-family: $chat-lines-font;
   line-height: 1.65em;
-  backface-visibility: hidden;
-  perspective: 1000px;
   outline: 0 !important;
 }
 
@@ -309,7 +307,6 @@ hr {
   .chat-user {
     cursor: pointer;
     position: relative;
-    z-index: 120;
   }
   .chat-user:hover {
     text-decoration: underline;
@@ -329,7 +326,6 @@ hr {
   .externallink {
     color: $color-link;
     position: relative;
-    z-index: 120;
   }
   .externallink:visited {
     color: $color-link-visited;
@@ -568,7 +564,6 @@ hr {
 
   .event-wrapper {
     border-radius: 10px;
-    overflow: hidden;
   }
 
   .event-top {
@@ -577,6 +572,13 @@ hr {
     background-color: $color-chat-emphasize;
     justify-content: space-between;
     align-items: center;
+    border-top-right-radius: 10px;
+    border-top-left-radius: 10px;
+
+    &.no-bottom {
+      border-bottom-right-radius: 10px;
+      border-bottom-left-radius: 10px;
+    }
   }
 
   .event-icon {
@@ -594,6 +596,8 @@ hr {
   .event-bottom {
     padding: $gutter-xs $gutter-md * 2 $gutter-xs $gutter-md;
     background-color: $color-chat-bg;
+    border-bottom-right-radius: 10px;
+    border-bottom-left-radius: 10px;
   }
 
   .user {
@@ -948,7 +952,6 @@ hr {
   }
 }
 .emote {
-  z-index: 1;
   display: inline-block;
   position: relative;
   overflow: hidden;
diff --git a/assets/chat/js/messages/ChatEventMessage.js b/assets/chat/js/messages/ChatEventMessage.js
index 06834cad..90563b82 100644
--- a/assets/chat/js/messages/ChatEventMessage.js
+++ b/assets/chat/js/messages/ChatEventMessage.js
@@ -27,6 +27,7 @@ export default class ChatEventMessage extends ChatMessage {
         this.buildMessageTxt(chat);
     } else {
       eventTemplate.querySelector('.event-bottom').remove();
+      eventTemplate.querySelector('.event-top').classList.toggle('no-bottom');
     }
 
     return eventTemplate;