Visible scrollbar in expanding sidebar and text leaves it's menubutton

[TheSoulrester]

Package

filament/filament

Package Version

v2.16.17

Laravel Version

9.31.0

Livewire Version

No response

PHP Version

PHP 8.1.10

Problem description

While the collapsed sidebar is decollapsing, there is a scrollbar visible for a short time in the footer area of the sidebar. Moreover, the text of the menu-button exits the button and slided in from the left side.

Here is a short video: https://youtu.be/zE6UyFnEyrQ

Expected behavior

There won't be any scrollbar in the sidebar footer area and the text of the menubutton won't leave the button while expanding

Steps to reproduce

1. Close the left sidebar
2. Open the left sidebar
3. While the sidebar opens, you can see a scrollbar in the footer area and the text of any button will leave the button and is sliding in from the left side.

Reproduction repository

https://github.com/Feuerwehr-Bamberg-Loschgruppe-1/strichliste-lg1

Relevant log output

--

[danharrin]

Can you submit a PR to fix this? Personally I don't think it's that visually offensive to consider a "bug"... 🤔

[TheSoulrester]

I'm not very familiar with github. I think I can only create a pull request if I forked this repo?

I created a new laravel environement and installed the TALL stack. After that, I added filament admin. The problem with the appearing scrollbar was already from the beginning.

[zepfietje]

I do think this is a bug, even if it's not that visually offensive.

@TheSoulrester, our contributing instructions should help you get started: https://github.com/filamentphp/filament#contributing.

[Kristories]

Yeah, I don't think this is a bug. But let me fix this.

[zepfietje]

@danharrin, the linked PR only fixes part of this issue. The menu item text issue still exists, right?

[Kristories]

the text of any button will leave the button and is sliding in from the left side.

@TheSoulrester What do you expect?

@danharrin I don't see https://demo.filamentphp.com using v2.16.18. Can you update?

[TheSoulrester]

Hey @Kristories thank you for fixing one part of this issue this fast.

According to your question: I would expect that the button text won't exit its button while the menu is expanding.

While the menu expands, the text jumps out of the menubutton to the left border, is expanding there and after the menu finished expanding, the text "jumps" in the button again. And this is, in my opinion, a visual "bug"/issue.

In the demo I see that you'll never see the text exiting the button because the background and text colour is white. If you change over to the dark mode, you can see it better.

[Kristories]

Yeah, you're right @TheSoulrester. I'll fix this one.