fix: safari action button color fix

ccontrols · May 16, 2020 · b5e76dc · b5e76dc
1 parent fc985e7
commit b5e76dc
Showing 1 changed file with 7 additions and 6 deletions.
diff --git a/ui/components/src/ActionBar/ActionBar.tsx b/ui/components/src/ActionBar/ActionBar.tsx
@@ -20,6 +20,8 @@ const ActionColors = ({
 }) => ({
   backgroundColor: theme.colors?.['action'],
   color: disabled ? '#ddd' : 'background',
+  //safari fix:
+  '-webkit-text-fill-color': 'initial',
   cursor: disabled ? 'not-allowed' : undefined,
   px: 2,
   py: 1,
@@ -81,25 +83,24 @@ export const ActionBar: FunctionComponent<ActionBarProps> = ({
 
   return (
     <div
-      css={{
+      sx={{
         position: 'relative',
       }}
     >
       <Flex
-        css={{
+        sx={{
           position: 'absolute',
           width: '100%',
         }}
       >
-        <div
-          style={{
-            display: 'flex',
+        <Flex
+          sx={{
             flexDirection: 'row-reverse',
             marginLeft: 'auto',
           }}
         >
           {items}
-        </div>
+        </Flex>
       </Flex>
     </div>
   );