[NcSelect] Minor presentation issue
Closed this issue · 13 comments
When opening NcSelect, there is a small gap between the input and the suggestion box.
When zooming the page (here 170% with Firefox 121) , the suggestion box gets zoomed different from the other elements
@Pytal I would like to reopen this issue, since the resizing behavior still exists in 8.5.0.
@Pytal I would like to reopen this issue, since the resizing behavior still exists in 8.5.0.
Do you have an example, where it is still broken?
Or on which web-browser.
See the second screenshot. Had it on Firefox and Chrome as well.
In this case it was the polls app. But in the files app, this happens too.
See the second screenshot. Had it on Firefox and Chrome as well. In this case it was the polls app. But in the files app, this happens too.
What version? Does this version includes the PR with the fix?
This is coming from the internal logic when :append-to-body="true" which was primarily added to support the dropdown being automatically positioned above the input when it would otherwise be outside of the viewport
Here I think it is not necessary as the select is near the top of the page so I would set :append-to-body="false" @dartcafe
I see this issue with the lowest priority, since it is an edge case; NcSelect must have the open state while zooming. But the issue should be reopened until fixed. At least the files app is also affected and maybe other apps.
And to clarify regarding the questions:
- It still happens with release 8.5.0 as well as with the predecessor.
- Yes, #5095 is included as long - as I assume, because the gap is gone and it is included within the release notes - the fix is checked in with release 8.5.0.
1/2 issues of the issue was fixed by linked PR
The issue comes from external library - VueSelect. In append-to-body directive it takes the size only on inserted. So changing select size after open results in different size between select's dropdown and select's content.
https://github.com/sagalbot/vue-select/blob/master/src/directives/appendToBody.js
As @Pytal mentioned, in some cases it is fixable via disabling appendToBody. Comes from #3656
However, without appendToBody we have 2 other issues:
- No auto position (e.g. it opens down when there is no place there)
overflowviewbox, where Select is cut by container border
Hmm, a problem might be simpler that it seemed to be. Wait a second...
Tested with the new release. For the main purpose it works now. Still get a glitch in an absolute edge case.