mirror of
https://github.com/apache/superset.git
synced 2026-06-09 09:39:25 +00:00
fix: Hide Safari default tooltip (#1283)
* Hide Safari default tooltip * Fix lint * Add emotion dependency * Fix package.json
This commit is contained in:
@@ -32,6 +32,7 @@
|
||||
"prop-types": "^15.7.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@emotion/react": "^11.1.5",
|
||||
"@types/react": "*",
|
||||
"antd": "^4.9.4",
|
||||
"react": "^16.13.1"
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
import React from 'react';
|
||||
import { useTheme } from '@superset-ui/core';
|
||||
import { useTheme, css } from '@superset-ui/core';
|
||||
import { Tooltip as BaseTooltip } from 'antd';
|
||||
import { TooltipProps } from 'antd/lib/tooltip';
|
||||
import { Global } from '@emotion/react';
|
||||
|
||||
export { TooltipProps } from 'antd/lib/tooltip';
|
||||
|
||||
@@ -9,11 +10,25 @@ export const Tooltip = ({ overlayStyle, color, ...props }: TooltipProps) => {
|
||||
const theme = useTheme();
|
||||
const defaultColor = `${theme.colors.grayscale.dark2}e6`;
|
||||
return (
|
||||
<BaseTooltip
|
||||
overlayStyle={{ fontSize: theme.typography.sizes.s, lineHeight: '1.6', ...overlayStyle }}
|
||||
color={defaultColor || color}
|
||||
{...props}
|
||||
/>
|
||||
<>
|
||||
{/* Safari hack to hide browser default tooltips */}
|
||||
<Global
|
||||
styles={css`
|
||||
.ant-tooltip-open {
|
||||
display: inline-block;
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
`}
|
||||
/>
|
||||
<BaseTooltip
|
||||
overlayStyle={{ fontSize: theme.typography.sizes.s, lineHeight: '1.6', ...overlayStyle }}
|
||||
color={defaultColor || color}
|
||||
{...props}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user