akveo / nebular

:boom: Customizable Angular UI Library based on Eva Design System :new_moon_with_face::sparkles:Dark Mode
https://akveo.github.io/nebular
MIT License
8.04k stars 1.51k forks source link

nb-option scrolling issue #2581

Open antoshens opened 3 years ago

antoshens commented 3 years ago

Issue type

I'm submitting a ...

Issue description

Current behavior: Currently, each input that allows seeing list of options (there are nb-select, nb-autocomplete, nb-datepicker) has the next scrolling issue. If you open the nb-option list and scroll your page to the top or bottom, this list scrolls along with the page.

Expected behavior: It should disappear or be sticky to the position that it was initially opened.

Steps to reproduce: To reproduce this bug you have to simply put any of these controls (nb-select, nb-autocomplete, nb-datepicker) inside a nb-card-body and have the scrollable content inside this card-body.

Initial opening:

image

Scrolling down:

image

As you can see the options (calendar in our case) don't disappear it scrolls with the page content.

Related code:

<nb-card-body>
    <form [formGroup]="formGroup">
        <div class="row">
            <div class="col-lg-4">
                <input nbInput fullWidth placeholder="Date" [nbDatepicker]="passwordExpiration" formControlName="date">
                <nb-datepicker #passwordExpiration></nb-datepicker>
            </div>
        </div>
    </form>
</nb-card-body>

Other information:

npm, node, OS, Browser

Node: 10.15.3
Npm: 6.14.4
OS: Windows 10
Browser: Chrome, Firefox, and maybe all the others.

Angular, Nebular

Angular: 9.1.12
Nebular: 5.1.0
genesisrhapsodos98 commented 3 years ago

This is supposedly fixed by #1012, but apparently the problem still persists.

muckinger commented 3 years ago

This is supposedly fixed by #1012, but apparently the problem still persists.

Can confirm, Problem still exists. Any news?