Merge pull request #2934 from input-output-hk/fix/ddw-1040-bug-tooltips-on-dialogs-hidden-on-hover

Author: danielmain

CHANGELOG.md

@@ -12,6 +12,7 @@
 
 ### Fixes
 
+- Fixed tooltip being hidden in several places ([PR-2934](https://github.com/input-output-hk/daedalus/pull/2934))
 - Adjusted padding for search field in stake pools ([PR 2945](https://github.com/input-output-hk/daedalus/pull/2945))
 - Fixed margin for dialogs content and token table header ([PR 2944](https://github.com/input-output-hk/daedalus/pull/2944))
 - Fixed performance issue on stake pool list view ([PR 2924](https://github.com/input-output-hk/daedalus/pull/2924))

source/renderer/app/components/news/NewsFeed.scss

@@ -13,7 +13,7 @@
   top: 0;
   transition: margin-right 400ms ease;
   width: 460px;
-  z-index: $dialog-z-index;
+  z-index: $news-feed-z-index;
 
   &.noTransition {
     transition: none;

source/renderer/app/components/wallet/WalletCreateDialog.tsx

@@ -6,8 +6,8 @@ import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import { defineMessages, intlShape, FormattedHTMLMessage } from 'react-intl';
 import vjf from 'mobx-react-form/lib/validators/VJF';
-import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import SVGInline from 'react-svg-inline';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import ReactToolboxMobxForm, {
   handleFormErrors,
 } from '../../utils/ReactToolboxMobxForm';

source/renderer/app/components/wallet/send-form/WalletSendAssetsConfirmationDialog.tsx

@@ -4,12 +4,12 @@ import { Input } from 'react-polymorph/lib/components/Input';
 import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import { CheckboxSkin } from 'react-polymorph/lib/skins/simple/CheckboxSkin';
-import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { get } from 'lodash';
 import BigNumber from 'bignumber.js';
 import SVGInline from 'react-svg-inline';
 import { intlShape, FormattedHTMLMessage } from 'react-intl';
 import vjf from 'mobx-react-form/lib/validators/VJF';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import Dialog from '../../widgets/Dialog';
 import DialogCloseButton from '../../widgets/DialogCloseButton';

source/renderer/app/components/wallet/settings/ChangeSpendingPasswordDialog.tsx

@@ -4,8 +4,8 @@ import classnames from 'classnames';
 import { Input } from 'react-polymorph/lib/components/Input';
 import { defineMessages, FormattedHTMLMessage, intlShape } from 'react-intl';
 import vjf from 'mobx-react-form/lib/validators/VJF';
-import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import SVGInline from 'react-svg-inline';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import ReactToolboxMobxForm from '../../../utils/ReactToolboxMobxForm';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 import Dialog from '../../widgets/Dialog';

source/renderer/app/components/wallet/wallet-import/WalletSelectImportDialog.tsx

@@ -8,13 +8,13 @@ import {
 import { observer } from 'mobx-react';
 import { ButtonSkin } from 'react-polymorph/lib/skins/simple/ButtonSkin';
 import { Button } from 'react-polymorph/lib/components/Button';
-import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import { CheckboxSkin } from 'react-polymorph/lib/skins/simple/CheckboxSkin';
 import { Checkbox } from 'react-polymorph/lib/components/Checkbox';
 import { Link } from 'react-polymorph/lib/components/Link';
 import { LinkSkin } from 'react-polymorph/lib/skins/simple/LinkSkin';
 import classNames from 'classnames';
 import SVGInline from 'react-svg-inline';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
 import styles from './WalletSelectImportDialog.scss';
 import DialogCloseButton from '../../widgets/DialogCloseButton';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/close-c... Remove this comment to see the full error message

source/renderer/app/components/widgets/forms/FormFieldSkinTooltip.tsx

@@ -5,10 +5,11 @@ import type { Element } from 'react';
 import { omit } from 'lodash';
 import classnames from 'classnames';
 import SVGInline from 'react-svg-inline';
-import { PopOver } from 'react-polymorph/lib/components/PopOver';
 // @ts-ignore ts-migrate(2307) FIXME: Cannot find module '../../../assets/images/exclama... Remove this comment to see the full error message
 import exclamationPointIcon from '../../../assets/images/exclamation-point.inline.svg';
 import styles from './FormFieldSkinTooltip.scss';
+import { PopOver } from 'react-polymorph/lib/components/PopOver';
+
 type Props = {
   className: string;
   disabled: boolean;

source/renderer/app/themes/mixins/layers.scss

@@ -1,5 +1,6 @@
-$backdrop-z-index: 10000;
-$dialog-z-index: 10000;
+$news-feed-z-index: 10000;
+$backdrop-z-index: 9998;
+$dialog-z-index: 9998;
 $loader-backdrop-z-index: 5;
 $back-to-top-z-index: 5;
 $sticky-header-z-index: 1;