From 2f5f11634582ae4abf3c543659672ab8ff83c6ac Mon Sep 17 00:00:00 2001
From: Myzel394 <50424412+Myzel394@users.noreply.github.com>
Date: Sun, 5 Dec 2021 12:07:53 +0000
Subject: [PATCH] Improve tabs background coloring (#2395)

* improved tabs background coloring

* improvements

* reverted changes

* color improvements

* added light theme
---
 src/public/app/widgets/tab_row.js      | 8 ++++++++
 src/public/stylesheets/theme-dark.css  | 2 ++
 src/public/stylesheets/theme-light.css | 2 ++
 3 files changed, 12 insertions(+)

diff --git a/src/public/app/widgets/tab_row.js b/src/public/app/widgets/tab_row.js
index f44349ac5..ece05003c 100644
--- a/src/public/app/widgets/tab_row.js
+++ b/src/public/app/widgets/tab_row.js
@@ -187,6 +187,14 @@ const TAB_ROW_TPL = `
         cursor: pointer;
     }
     
+    .tab-row-widget .note-tab:hover .note-tab-wrapper {
+        background-color: var(--inactive-tab-hover-background-color);
+    }
+    
+    .tab-row-widget .note-tab[active]:hover .note-tab-wrapper {
+        background-color: var(--active-tab-hover-background-color);
+    }
+    
     .tab-row-widget .note-tab .note-tab-close:hover {
         background-color: var(--hover-item-background-color);
         color: var(--hover-item-text-color);
diff --git a/src/public/stylesheets/theme-dark.css b/src/public/stylesheets/theme-dark.css
index 3c6009b63..08f0f677e 100644
--- a/src/public/stylesheets/theme-dark.css
+++ b/src/public/stylesheets/theme-dark.css
@@ -54,9 +54,11 @@
     --launcher-pane-text-color: #AAAAAA;
 
     --active-tab-background-color: #666;
+    --active-tab-hover-background-color: #737373;
     --active-tab-text-color: #ccc;
 
     --inactive-tab-background-color: #444;
+    --inactive-tab-hover-background-color: #525252;
     --inactive-tab-text-color: #bbb;
 
     --scrollbar-border-color: #888;
diff --git a/src/public/stylesheets/theme-light.css b/src/public/stylesheets/theme-light.css
index 82fb21d9b..113718989 100644
--- a/src/public/stylesheets/theme-light.css
+++ b/src/public/stylesheets/theme-light.css
@@ -58,9 +58,11 @@ html {
     --launcher-pane-text-color: #333;
 
     --active-tab-background-color: #ddd;
+    --active-tab-hover-background-color: #d1d1d1;
     --active-tab-text-color: black;
 
     --inactive-tab-background-color: #f0f0f0;
+    --inactive-tab-hover-background-color: #e3e3e3;
     --inactive-tab-text-color: #666;
 
     --scrollbar-border-color: #ddd;