Theme switcher tooltips stay on screen on mobile

[binaryfire]

Package

filament/filament

Package Version

3.0.60

Laravel Version

10.2.6

Livewire Version

No response

PHP Version

8.2

Problem description

The tooltips for the dark / light mode switcher stay on screen on mobile.

Expected behavior

They shouldn’t stay on screen after the switcher has closed.

Steps to reproduce

Visit https://demo.filamentphp.com/ on a mobile device. I’m using an iPhone X.

Reproduction repository

https://github.com/filamentphp/demo

Relevant log output

No response

Donate 💰 to fund this issue

• You can donate funding to this issue. We receive the money once the issue is completed & confirmed by you.
• 100% of the funding will be distributed between the Filament core team to run all aspects of the project.
• Thank you in advance for helping us make maintenance sustainable!

[valpuia]

I am using OnePlus (android 13) and I can't reproduce this

[binaryfire]

Screenshots from the demo site. iPhone X, happens in both Chrome and Safari:

[zepfietje]

Can confirm this on iOS.
Have you found a fix, @binaryfire?

[binaryfire]

Hey @zepfietje. Couldn't figure it out. It could be related to tippy.js or Popper (which tippy uses under the hood). Development on both libraries has been discontinued and there are lots of open issues.

I'd really recommend switching Filament over to Floating UI if you're able. It's basically Popper v2.

[zepfietje]

We're currently using https://github.com/ryangjchandler/alpine-tooltip, so let's ask @ryangjchandler about his opinion.

[zepfietje]

Replaced by #13333.