Choppy animation in mdb select dropdown

Start your code here

<div class="row">
    <div class="col-md-6">
        <mdb-select [options]="optionsSelect" placeholder="Choose your option"></mdb-select>
        <label>Example label</label>
    </div>
</div>

optionsSelect: Array<any>;         
    
    ngOnInit() { 
        this.optionsSelect = [
            { value: '1', label: 'Option 1' },
            { value: '2', label: 'Option 2' },
            { value: '3', label: 'Option 3' },
        ];
    } 

itdev pro commented 7 years ago

Any field you add below the mdb-select, you will see the animation choppiness.

---

 _material-select.scss

/scss/angular/pro/_material-select.scss,

mdb-select-dropdown {} line (at end of the file)

opacity: 0 to opacity: 1.0

itdev pro commented 7 years ago

Will you be applying this fix to future releases?

---

Damian Gemza staff commented 7 years ago

We'll take a deeper look on this case to think how to solve it in right way :)

---

itdev pro commented 7 years ago

Did you guys implement a better solution for this. I do not like the idea of having to change your file every time I update to the latest version

---

Damian Gemza staff commented 7 years ago

Dear itdev, Unfortunately, we didn't implement better solution for this. We're working on solving this problem. For now, you can always put your style in global stylesheet. It won't be overwritten by our releases. Best Regards, Damian

---

Damian Gemza staff commented 7 years ago

I've fixed this problem right now. Solution will be available in next MDB Angular release. If you need this now, feel free to download our dev version of MDB Angular which includes every latest fixes! https://git.mdbootstrap.com/mdb/angular/ng-pro/tree/dev Best Regards, Damian

---