“(100% ready) Material Ripples”
Do you refer to the ripple animation?
@s-molinari that is what I actually did, I have already seen that thread. But thanks for helping
You cannot modify the slot, you have to wrap it with another element, a div for example.
Now I am actually traveling. So as soon as I get good internet I’ll push my changes to the fork and ask for a PR. I will link it here.
Hmmm I checked the date time component and the popover also has this issue. Losses anchor and gets positioned to top and not to the triggering element. I solved nesting the <slot> in the popover component with a div of max-height 50vh (it seems that it is not possible to bind styles to slots yet in vue). I will PR now so you can check it out. I think it’s a quick easy fix.
@rstoenescu I found the issue. The problem was that I was giving the “.list” class a height of 100vh. Because of this, don’t know really why, de popover loses it’s anchor.
This also happens in your popover example with the “assignment” button.
In your example the the list displays a 20 elements and with a max-height of 500px. If you shorten the list to, for example, 2 elements the popover won’t lose the anchor. Also if you change the max-height to something like 200px you can preserve the amount of elements in the list without loosing the anchor for the popover.
Conclusion, big heights breaks the anchor position for the popover. Temporary fix? I think that setting the max-amount displayed to 3 or 4 elements in the autocomplete or giving a max-height of 200/300px to the list container inside the popover in the autocomplete component could solve it.
@rstoenescu I tried to look for what was causing the issue, but I cannot manage to edit the main Autocomplete.vue componente to override it. It’s there a way to do it? Or I should copy the autocomplete component and popover componente and import them externally and use them instead the ones Quasar it’s importing?
Looks like your connection to Quasar Framework was lost, please wait while we try to reconnect.