From 1a50cfabe08593e020003e60a0c590e3d2797ec9 Mon Sep 17 00:00:00 2001
From: Daniel Imms <2193314+Tyriar@users.noreply.github.com>
Date: Fri, 13 May 2022 07:56:45 -0700
Subject: [PATCH] Dom renderer: top decorations above selection

Fixes #3799
---
 css/xterm.css                                     | 5 +++++
 src/browser/renderer/dom/DomRendererRowFactory.ts | 5 +++++
 2 files changed, 10 insertions(+)

diff --git a/css/xterm.css b/css/xterm.css
index 2f84c859..95fc61ed 100644
--- a/css/xterm.css
+++ b/css/xterm.css
@@ -183,3 +183,8 @@
     right: 0;
     pointer-events: none;
 }
+
+.xterm-decoration-top {
+    z-index: 2;
+    position: relative;
+}
diff --git a/src/browser/renderer/dom/DomRendererRowFactory.ts b/src/browser/renderer/dom/DomRendererRowFactory.ts
index bf3939e8..3491b76f 100644
--- a/src/browser/renderer/dom/DomRendererRowFactory.ts
+++ b/src/browser/renderer/dom/DomRendererRowFactory.ts
@@ -195,6 +195,11 @@ export class DomRendererRowFactory {
         isTop = d.options.layer === 'top';
       }
 
+      // If it's a top decoration, render on above the selection
+      if (isTop) {
+        charElement.classList.add(`xterm-decoration-top`);
+      }
+
       // Foreground
       switch (fgColorMode) {
         case Attributes.CM_P16: