Move chat in front of code

pastagang · Jan 23, 2025 · 78c8b77 · 78c8b77
1 parent 61097bd
commit 78c8b77
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 10 deletions.
diff --git a/src/editor.js b/src/editor.js
@@ -313,10 +313,11 @@ export class PastaMirror {
       const offsetY = 4; // not sure why
       messageContainer.style = `position:fixed;top:${pos.top + offsetY}px;left:${pos.left + offsetX}px`;
       messageContainer.classList.add('rising-animation');
+      messageContainer.classList.add('message-container');
       chatContainer.appendChild(messageContainer);
       setTimeout(() => {
         messageContainer.remove();
-      }, 3000);
+      }, 7000);
     } else {
       console.warn('could not get line position');
     }

diff --git a/src/style.css b/src/style.css
@@ -560,23 +560,20 @@ dialog {
 .chat-container {
   width: 100%;
   height: 100%;
-  position: fixed;
+  position: absolute;
   top: 0;
   left: 0;
   pointer-events: none;
-  & div {
-    background: #111111;
-    color: white;
-  }
 }
 
 .message-container {
   position: fixed; /* top + left is set from code */
   transform: translateX(-50%);
-  width: 100px;
-  height: 100px;
-  background-color: red;
+  background-color: #33333399;
+  color: white;
   opacity: 1;
+  z-index: 1000;
+  font-size: 1.2rem;
 }
 
 @keyframes rise-and-fade {
@@ -590,5 +587,5 @@ dialog {
 }
 
 .rising-animation {
-  animation: rise-and-fade 3s ease-out forwards;
+  animation: rise-and-fade 6s ease-out forwards;
 }