filament Theme switcher tooltips stay on screen on mobile

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

Sep 24 '23 19:09 binaryfire

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

Sep 25 '23 07:09 valpuia

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

Sep 25 '23 07:09 binaryfire

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

Sep 25 '23 13:09 zepfietje

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.

Sep 25 '23 17:09 binaryfire

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

Sep 26 '23 13:09 zepfietje

Replaced by https://github.com/filamentphp/filament/issues/13333.

Jun 20 '24 07:06 zepfietje