kevinfaveri/vue-twemoji-picker

The popper is too far away from the popper trigger

guanzo opened this issue · 3 comments

guanzo commented

I set pickerArrowEnabled to false, which makes the arrow go away, but the popper doesn't change position, leading to a big gap between the popper and the trigger. It looks weird.

Even with the arrow, the popper is too far away imo. With or without the arrow, the popper should be within 5-10px. My trigger is exactly 24px by 24px, there is no extra, invisible spacing due to padding or w/e.

With arrow:

witharrow
Without arrow:

noarrow

kevinfaveri commented

Could you provide a codesandbox or codepen for this scenario? Thank you for the feedback Eric!

guanzo commented

https://codesandbox.io/s/festive-goodall-zxymf

You can toggle pickerArrowEnabled to see the difference.

In both cases, the popper is too far away for my taste.

EDIT: I just realized this is probably fixable thru the popperjs config. I haven't used popperjs for years, so i forgot how configurable it is.

kevinfaveri commented

Hi there @guanzo!

I've done some tweaking in the TwemojiPicker positioning for a lot of use cases, and it should better fit your needs now. The tweak is available from version: 5.6.1 onwards.

  • 👍1