From 8b70bc998e1627ae7c89112578022a71c2ba4a36 Mon Sep 17 00:00:00 2001
From: Markus Stange <mstange.moz@gmail.com>
Date: Wed, 10 Aug 2022 17:35:11 -0400
Subject: [PATCH] Tweak close button styling.

---
 src/components/timeline/Track.css | 24 ++++++++++++++++--------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/src/components/timeline/Track.css b/src/components/timeline/Track.css
index 5a32c82e9b..2748930054 100644
--- a/src/components/timeline/Track.css
+++ b/src/components/timeline/Track.css
@@ -63,21 +63,29 @@
 }
 
 .timelineTrackCloseButton {
-  position: relative;
-  right: 5px;
   overflow: hidden;
-  width: 11px;
-  height: 11px;
-  padding: 0;
+  width: 15px;
+  height: 15px;
+  box-sizing: content-box;
+  padding: 1px;
   border: 0;
-  background: url(../../../res/img/svg/searchfield-cancel.svg) top left
-    no-repeat;
+  margin: 0 2px;
+  background: url(../../../res/img/svg/close-dark.svg) no-repeat center;
+  background-origin: content-box;
   background-size: contain;
+  border-radius: 2px;
   color: transparent;
-  margin-inline-start: 8px;
   -moz-user-focus: ignore;
 }
 
+.timelineTrackCloseButton:hover {
+  background-color: rgb(0 0 0 / 0.15);
+}
+
+.timelineTrackCloseButton:active:hover {
+  background-color: rgb(0 0 0 / 0.3);
+}
+
 .timelineTrackLabel:not(:hover) > .timelineTrackCloseButton {
   display: none;
 }