From 39f9c3507bcd856441e3bf1db627550b164fc625 Mon Sep 17 00:00:00 2001
From: meganrogge <merogge@microsoft.com>
Date: Tue, 15 Mar 2022 10:37:38 -0400
Subject: [PATCH] rename css, fix background color getting applied

---
 css/xterm.css                                    | 4 ++--
 demo/client.ts                                   | 4 +++-
 src/browser/Decorations/OverviewRulerRenderer.ts | 2 +-
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/css/xterm.css b/css/xterm.css
index 44bb062a..0ca59399 100644
--- a/css/xterm.css
+++ b/css/xterm.css
@@ -179,10 +179,10 @@
 	position: absolute;
 }
 
-.xterm-decoration-scrollbar {
+.xterm-decoration-overview-ruler {
     z-index: 7;
     position: absolute;
     top: 0;
     right: 0;
     width: 50px;
-} 
\ No newline at end of file
+}
diff --git a/demo/client.ts b/demo/client.ts
index e1347e3d..b80e2e76 100644
--- a/demo/client.ts
+++ b/demo/client.ts
@@ -548,7 +548,9 @@ function addDecoration() {
   const marker = term.addMarker(1);
   const decoration = term.registerDecoration({ marker });
   decoration.onRender((e) => {
-    e.style.backgroundColor = 'red';
+    if (e.classList.value === 'xterm-decoration') {
+      e.style.backgroundColor = 'red';
+    }
   });
 }
 
diff --git a/src/browser/Decorations/OverviewRulerRenderer.ts b/src/browser/Decorations/OverviewRulerRenderer.ts
index 8a78bb78..083db5e9 100644
--- a/src/browser/Decorations/OverviewRulerRenderer.ts
+++ b/src/browser/Decorations/OverviewRulerRenderer.ts
@@ -29,7 +29,7 @@ export class OverviewRulerRenderer extends Disposable {
   ) {
     super();
     this._canvas = document.createElement('canvas');
-    this._canvas.classList.add('xterm-decoration-scrollbar');
+    this._canvas.classList.add('xterm-decoration-overview-ruler');
     this._viewportElement.parentElement?.insertBefore(this._canvas, this._viewportElement);
     this._ctx = this._canvas.getContext('2d');
     this._canvas.style.width = `${this._optionsService.options.overviewRulerWidth || ScrollbarConstants.WIDTH}px`;