From 5b487c151aecfff72d55362adc3a4ea3e55a55e1 Mon Sep 17 00:00:00 2001
From: NejcZdovc <nejc.zdovc@3zsistemi.si>
Date: Thu, 30 Mar 2017 01:06:31 +0200
Subject: [PATCH] Followup on #7944, change inactive private tab background to
 30% of original color

Auditors: @bsclifton @cezaraugusto @bradleyrichter

Test Plan:
- open private tab
- open another private tab
- non active private tab should have light purple bg
---
 app/renderer/components/styles/tab.js | 8 ++++++++
 app/renderer/components/tabContent.js | 2 +-
 js/components/tab.js                  | 6 ++++++
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/app/renderer/components/styles/tab.js b/app/renderer/components/styles/tab.js
index 46c132aae59..7db22fbde19 100644
--- a/app/renderer/components/styles/tab.js
+++ b/app/renderer/components/styles/tab.js
@@ -106,6 +106,14 @@ const styles = StyleSheet.create({
     }
   },
 
+  private: {
+    background: 'rgba(75, 60, 110, 0.3)',
+
+    ':hover': {
+      background: globalStyles.color.privateTabBackgroundActive
+    }
+  },
+
   dragging: {
     ':hover': {
       closeTab: {
diff --git a/app/renderer/components/tabContent.js b/app/renderer/components/tabContent.js
index 864749877d6..702ebe59fc2 100644
--- a/app/renderer/components/tabContent.js
+++ b/app/renderer/components/tabContent.js
@@ -223,7 +223,7 @@ class TabTitle extends ImmutableComponent {
   get themeColor () {
     const themeColor = this.props.tab.get('themeColor') || this.props.tab.get('computedThemeColor')
     const activeNonPrivateTab = !this.props.tab.get('isPrivate') && this.props.isActive
-    const activePrivateTab = this.props.tab.get('isPrivate') && this.props.isActive
+    const activePrivateTab = (this.props.tab.get('isPrivate') && this.props.isActive) || this.props.isHover
     const defaultColor = activePrivateTab ? globalStyles.color.white100 : globalStyles.color.black100
 
     return activeNonPrivateTab && this.props.paintTabs && !!themeColor
diff --git a/js/components/tab.js b/js/components/tab.js
index 2c24b2b14e5..2c00f1eeaf0 100644
--- a/js/components/tab.js
+++ b/js/components/tab.js
@@ -33,6 +33,7 @@ class Tab extends ImmutableComponent {
     this.onMouseEnter = this.onMouseEnter.bind(this)
     this.onMouseLeave = this.onMouseLeave.bind(this)
     this.onUpdateTabSize = this.onUpdateTabSize.bind(this)
+    this.isHover = false
   }
   get frame () {
     return windowStore.getFrame(this.props.tab.get('frameKey'))
@@ -139,6 +140,8 @@ class Tab extends ImmutableComponent {
       windowActions.setPreviewFrame(null)
     }
     windowActions.setTabHoverState(this.frame, false)
+
+    this.isHover = false
   }
 
   onMouseEnter (e) {
@@ -154,6 +157,8 @@ class Tab extends ImmutableComponent {
         window.setTimeout(windowActions.setPreviewFrame.bind(null, this.frame), previewMode ? 0 : 200)
     }
     windowActions.setTabHoverState(this.frame, true)
+
+    this.isHover = true
   }
 
   onAuxClick (e) {
@@ -301,6 +306,7 @@ class Tab extends ImmutableComponent {
           <TabTitle
             isActive={this.props.isActive}
             paintTabs={this.props.paintTabs}
+            isHover={this.isHover}
             tab={this.props.tab}
             pageTitle={this.displayValue}
           />