grid layout in Cluster to much space between widgets and/or content (with FIX / SOLUTION)

[Eelco]

Package

filament/filament

Package Version

v3.2.85

Laravel Version

v10.48.12

Livewire Version

v3.5.0

PHP Version

8.3.7

Problem description

When using a Cluster with a lot of menu items. all pages and resources who have header Widgets have too much space between the header Widgets and the content below (tables).

Expected behavior

There should be not much space between widgets and content.

Steps to reproduce

After installing repo. Go to the Life Cluster page, then to the Users Page. space between widgets and table is growing when there are more navigation items in the menu. it also gets worse if you add more users to the usersResource table...

you can also resize the window to see the whitespace growing or shrinking...

vendor/filament/filament/resources/views/components/page/index.blade.php and starting on line 57:

@class([
                'flex flex-col gap-8' => $subNavigation,
                match ($subNavigationPosition) {
                    SubNavigationPosition::Start, 
                    SubNavigationPosition::End => 'md:flex-row',
                    default => null,
                } => $subNavigation,
                'h-full' => $fullHeight,
            ])
        >

should have and extra class md:items-start behind md:flex-row:

like so:

@class([
                'flex flex-col gap-8' => $subNavigation,
                match ($subNavigationPosition) {
                    SubNavigationPosition::Start, 
                    SubNavigationPosition::End => 'md:flex-row md:items-start',
                    default => null,
                } => $subNavigation,
                'h-full' => $fullHeight,
            ])
        >

Reproduction repository

https://github.com/eelco2k/filamentphp-issue-cluster

Relevant log output

No response

[github-actions]

Hey @eelco2k! We're sorry to hear that you've hit this issue. 💛

However, it looks like you forgot to fill in the reproduction repository URL. Can you edit your original post and then we'll look at your issue?

We need a public GitHub repository which contains a Laravel app with the minimal amount of Filament code to reproduce the problem. Please do not link to your actual project, what we need instead is a minimal reproduction in a fresh project without any unnecessary code. This means it doesn't matter if your real project is private / confidential, since we want a link to a separate, isolated reproduction. That would allow us to download it and review your bug much easier, so it can be fixed quicker. Please make sure to include a database seeder with everything we need to set the app up quickly.

[github-actions]

Thank you for providing reproduction steps! Reopening the issue now.

[Zep Fietje]

Duplicate of #11909.