From 81b46b8c53ae5303c8d241523ed8d4ae29912c27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Se=CC=81rgio=20Ramos?= <mail@sergioramos.me>
Date: Thu, 25 Jan 2018 17:15:07 +0000
Subject: [PATCH] fix(ui-toolkit): fix disabled popover color in webkit

fixes #1050
---
 .../src/components/create-instance/affinity.js       | 12 ++++++++++--
 .../__tests__/__snapshots__/popover.spec.js.snap     |  1 +
 packages/ui-toolkit/src/popover/item.js              |  2 ++
 3 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/my-joy-beta/src/components/create-instance/affinity.js b/packages/my-joy-beta/src/components/create-instance/affinity.js
index 02ba305e..e07cdc0a 100644
--- a/packages/my-joy-beta/src/components/create-instance/affinity.js
+++ b/packages/my-joy-beta/src/components/create-instance/affinity.js
@@ -26,7 +26,11 @@ export const Rule = rule => (
         The instance
       </H5>
       <FormGroup name="rule-instance-conditional" field={Field}>
-        <Select touched={rule['rule-instance-conditional']} width={remcalc(66)} embedded>
+        <Select
+          touched={rule['rule-instance-conditional']}
+          width={remcalc(66)}
+          embedded
+        >
           <option value="must">must</option>
           <option value="should">should</option>
         </Select>
@@ -35,7 +39,11 @@ export const Rule = rule => (
         be on
       </H5>
       <FormGroup name="rule-instance-placement" field={Field}>
-        <Select touched={rule['rule-instance-placement']} width={remcalc(90)} embedded>
+        <Select
+          touched={rule['rule-instance-placement']}
+          width={remcalc(90)}
+          embedded
+        >
           <option value="same">the same</option>
           <option value="different">a different</option>
         </Select>
diff --git a/packages/ui-toolkit/src/popover/__tests__/__snapshots__/popover.spec.js.snap b/packages/ui-toolkit/src/popover/__tests__/__snapshots__/popover.spec.js.snap
index 7864f60c..8da8fbb0 100644
--- a/packages/ui-toolkit/src/popover/__tests__/__snapshots__/popover.spec.js.snap
+++ b/packages/ui-toolkit/src/popover/__tests__/__snapshots__/popover.spec.js.snap
@@ -41,6 +41,7 @@ Array [
 
 .c1:hover {
   color: rgb(53,53,53);
+  -webkit-text-fill-color: currentcolor;
 }
 
 .c0 {
diff --git a/packages/ui-toolkit/src/popover/item.js b/packages/ui-toolkit/src/popover/item.js
index 73824388..681e8c69 100644
--- a/packages/ui-toolkit/src/popover/item.js
+++ b/packages/ui-toolkit/src/popover/item.js
@@ -17,11 +17,13 @@ const BaseItem = styled.span`
 
     &:hover {
       color: ${props => props.theme.secondaryHover};
+      -webkit-text-fill-color: currentcolor;
     }
   `};
 
   ${is('disabled')`
     color: ${props => props.theme.grey};
+    -webkit-text-fill-color: currentcolor;
   `};
 `;