Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

S-Group pop-up tool tip is positioned so that it overlaps structure #2216

Closed
Zhirnoff opened this issue Feb 14, 2023 · 0 comments · Fixed by #2289
Closed

S-Group pop-up tool tip is positioned so that it overlaps structure #2216

Zhirnoff opened this issue Feb 14, 2023 · 0 comments · Fixed by #2289

Comments

@Zhirnoff
Copy link
Collaborator

Zhirnoff commented Feb 14, 2023

Steps to Reproduce

  1. Open Ketcher
  2. Create structure and make Data S-Group with 'Field name' and 'Field value'
  3. With 'Selection tool' hover over created S-Group

Actual behavior
S-Group pop-up tool tip is positioned so that it overlaps structure and makes it difficult to interact with structure.
Expected behavior
S-Group pop-up tool tip is positioned so that it doesn't overlap a structure.
Should make a pop-up tooltip away from highlighted S-Group structure.
Screenshots

2023-02-14_17h29_14.mp4

Desktop (please complete the following information):

  • OS: Windows 10
  • Browser Chrome
  • Version 109.0.5414.120 (Official Build) (64-bit)

Ketcher version
Version 2.8.0-rc.2

Additional context

#184560284

@Zhirnoff Zhirnoff added the bug label Feb 14, 2023
@Zhirnoff Zhirnoff added this to the Ketcher 2.9.0-rc.1 milestone Feb 14, 2023
@Konstantin1996 Konstantin1996 self-assigned this Feb 24, 2023
KonstantinEpam23 pushed a commit that referenced this issue Mar 8, 2023
…ture (#2289)

* Change Calculation of the position for InfoPanel component. For template structure calculation do not change at all.
For now it calculates according to the green rectangle that appears when user hovering over the element.
Function calculateMiddleCoordsForRect calculate middle coord for each side of the rect.
After that panel appears relativly to the middle point of side.

- created WrapperPositionedRelativeToRectangle component.
- moved calculateScrollOffsetX , calculateScrollOffsetY into helpers.ts to reduce code duplication
- created calculateMiddleCoordsForRect accepts array of arrays [[1,2], [3,4], [3,4]] => [{ x: 2, y: 3 }, { x: 3, y: 4}]
- added wrapperRef on div to get dinamically changed width / height of the element

* - fixed issue with selection tool

* - fixed eslint error

* - fixed comments

---------

Co-authored-by: Konstantin Zharich <kostantin_zharich@epam.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants