From 194c572f599972f28ab0c3ceb60a7b1e19c0a812 Mon Sep 17 00:00:00 2001
From: Nejc Zdovc <NejcZdovc@users.noreply.github.com>
Date: Fri, 31 Mar 2017 22:58:31 +0200
Subject: [PATCH] Change inactive private tab background to 30% of original
 color (#7975)

* 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

* Update per feedback by @cezaraugusto

Auditors: @cezaraugusto, @NejcZdovc

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

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..b0ff214ad10 100644
--- a/app/renderer/components/tabContent.js
+++ b/app/renderer/components/tabContent.js
@@ -223,8 +223,8 @@ 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 defaultColor = activePrivateTab ? globalStyles.color.white100 : globalStyles.color.black100
+    const isPrivateTab = this.props.tab.get('isPrivate') && (this.props.isActive || this.props.tab.get('hoverState'))
+    const defaultColor = isPrivateTab ? globalStyles.color.white100 : globalStyles.color.black100
 
     return activeNonPrivateTab && this.props.paintTabs && !!themeColor
       ? getTextColorForBackground(themeColor)