Toot

Written by Wes on 2024-09-25 at 19:48

@Una @argyleink Thanks for the info!

Any GitHub issue I can follow along to see when this might be possible?

For now I'm just making the little arrow a visual PE on mouse enter event.

document.querySelector("button").addEventListener("mouseenter", () => {
  popover.showPopover();

  if (popover.computedStyleMap().get("margin-top").value !== 0) {
    // popover is below
    popover.dataset["position"] = "bottom";
  } else {
    popover.dataset["position"] = "top";
  }
});

And then some CSS based on the data-position attribute to move the little arrow around. Works good enough for mouse usage, touch usage just won't have the arrow for now.

=> View attached media

=> More informations about this toot | View the thread | More toots from goulet@techhub.social

Mentions

=> View Una@front-end.social profile | View argyleink@front-end.social profile

Tags