diff --git a/client/src/constants/Config.js b/client/src/constants/Config.js index 029e75ee..5c372b04 100755 --- a/client/src/constants/Config.js +++ b/client/src/constants/Config.js @@ -18,6 +18,11 @@ const MAX_SIZE_TO_DISPLAY_CONTENT = 256 * 1024; const IS_MAC = navigator.platform.startsWith('Mac'); +// Where the pointer cannot hover there is no room for a tooltip: a tap gives the +// button focus, and a hint meant for the moment before a click ends up covering +// the thing that was just clicked. +const IS_TOUCH_PRIMARY = window.matchMedia('(hover: none)').matches; + export default { BASE_PATH, ACCESS_TOKEN_KEY, @@ -29,4 +34,5 @@ export default { ACTIVITIES_LIMIT, MAX_SIZE_TO_DISPLAY_CONTENT, IS_MAC, + IS_TOUCH_PRIMARY, }; diff --git a/client/src/lib/custom-ui/components/Tooltip/Tooltip.jsx b/client/src/lib/custom-ui/components/Tooltip/Tooltip.jsx index 50bd625d..06430f04 100644 --- a/client/src/lib/custom-ui/components/Tooltip/Tooltip.jsx +++ b/client/src/lib/custom-ui/components/Tooltip/Tooltip.jsx @@ -7,6 +7,8 @@ import React, { useMemo } from 'react'; import PropTypes from 'prop-types'; import { Popup as SemanticUIPopup } from 'semantic-ui-react'; +import Config from '../../../../constants/Config'; + import styles from './Tooltip.module.css'; const callAll = @@ -32,7 +34,7 @@ const Tooltip = React.forwardRef( }); }, [children, content, props, ref, ariaLabel, onClick]); - if (disabled || !content) { + if (disabled || !content || Config.IS_TOUCH_PRIMARY) { return trigger; }