MetricTableRow subtitle has overflow

[niekdemelker]

• Laravel Version: 11.19.0
• Nova Version: 4.34.3
• PHP Version: 8.3.9
• Operating System and Version: pop-os and windows
• Browser type and version: firefox 128.0.3 (64-bits) and chromium 127.0.6533.88

Description:

The TableMetric presents an overflow issue when the subtitle is to long, making the action buttons unreachable (or only after scroll). This can be seen in the image provided below.

The subtitle text has the CSS class 'truncate', which intention is to trim the string with text-overflow: ellipsis;, but as you can see there is just an overflow with scrollbar. I would suggest the subtitle will ether get trimmed or wrapped to a new line, the action buttons shouldn't be pushed away. I also tested this in different browsers with the same experience.

Detailed steps to reproduce the issue on a fresh Nova installation:

Make a new table metric

add an MetricTableRow with a long subtitle to a Dashboard.

Example of Table Metric:

class Example extends Table
{
    public function calculate(NovaRequest $request)
    {
        return [
            MetricTableRow::make()
                ->title('Overflow It!')
                ->subtitle('The subtitle is to long making an overflow, even tho this has a class with the name truncate, witch should prevent the overflow, pushing the action buttons out of view.')
                ->actions(fn () => [
                    MenuItem::externalLink('Random Action', 'http://127.0.0.1:8000/'),
                ]);
        ]
    }
}

[jeremynikolic]

Thanks @niekdemelker for reporting this, we've managed to reproduce the issue and will be fixing it 👍

[github-actions[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.