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

Modal not centered correctly when using detachable: false #1009

Closed
rmarchiori opened this issue Sep 9, 2019 · 3 comments
Closed

Modal not centered correctly when using detachable: false #1009

rmarchiori opened this issue Sep 9, 2019 · 3 comments
Labels
lang/javascript Anything involving JavaScript type/bug Any issue which is a bug or PR which fixes a bug
Milestone

Comments

@rmarchiori
Copy link
Contributor

Bug Report

Hello, it seems that the modal is not centering correctly when using option detachable: false and we have a long scrollable content.

My guess is that it is not calculating the top property correctly, it seems to be using the body height instead of viewport height.

Note 1: If you remove detachable : false option it works.
Note 2: If you remove like a paragraph of text you will then see the modal, but it won't be centered though.

Steps to reproduce

  1. Open the fiddle and click on show modal button

Expected result

Modal should be centered.

Actual result

Modal is not centered.

Testcase

jsFiddle link

My original Semantic-ui repository issue link

Version

2.7.8

@lubber-de lubber-de added the state/awaiting-investigation Anything which needs more investigation label Sep 9, 2019
@rmarchiori rmarchiori changed the title Modal no centered correctly when using detachable: false Modal not centered correctly when using detachable: false Sep 9, 2019
@GammaGames
Copy link
Contributor

It's not centered vertically, though it does stay centered if you make the window tall enough for the content and resize it down.

Screen record from 2019-09-09 13 43 25

@prudho
Copy link
Contributor

prudho commented Sep 12, 2019

It's centered to the dimmer. If your viewport is too small and have to scroll, the dimmer stay upper so the modal is not centered anymore. It's a bug, but I don't know how to fix this 😕

@prudho prudho added type/bug Any issue which is a bug or PR which fixes a bug tag/help-wanted Issues which need help to fix or implement labels Sep 12, 2019
@lubber-de lubber-de added this to the 2.8.0 milestone Sep 12, 2019
@lubber-de
Copy link
Member

Fixed by #1013
See your adjusted jsfiddle here http://jsfiddle.net/dgzLjxwv/

@lubber-de lubber-de added lang/javascript Anything involving JavaScript and removed state/awaiting-investigation Anything which needs more investigation tag/help-wanted Issues which need help to fix or implement labels Sep 12, 2019
@lubber-de lubber-de added the tag/next-release/nightly Any issue which has a corresponding PR which has been merged and is available in the nightly build label Sep 13, 2019
@y0hami y0hami closed this as completed in c73530b Nov 14, 2019
@y0hami y0hami removed the tag/next-release/nightly Any issue which has a corresponding PR which has been merged and is available in the nightly build label Nov 14, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
lang/javascript Anything involving JavaScript type/bug Any issue which is a bug or PR which fixes a bug
Projects
None yet
Development

No branches or pull requests

5 participants