Scrolling sideways on resource index broken since nova 4.17.0

[ramonfeleus]

• Laravel Version: 9.47.0
• Nova Version: >=4.17.0
• PHP Version: 8.1
• Browser type and version: Google Chrome 108.0.5359.124 and others.

Description:

Open a Nova Resource index page on a smaller screen where all columns do not fit horizontally in the viewport(e.g. smartphone, tablet, small desktop). Attempt to scroll sideways to view the other columns and action buttons. Scrolling sideways won't work. This happened after we've upgraded a an older site's nova version to the latest 4.20.2 version. After downgrading nova to specific versions I found that it has been an issue since nova 4.17.0. It seems the precedence of css classes on the list is the problem:

The o1-overflow-hidden class sets an overflow: hidden, disallowing all scrolling on the overview. While o1-overflow-x-auto should enable scrolling on the horizontal x-axis by setting overflow-x: auto. But the o1-overflow-hidden overrides o1-overflow-x-auto. In the screenshot you will see that o1-overflow-hidden appears twice in the css inheritance in the inspector, indicating it might be in the css twice.

When I set composer to nova 4.16.1 it works. This has different html classes which make sure the scrolling on the x-axis is enabled again after setting overflow: hidden on the overview.

The MenuBuilder.vue along with entry.css and entry.js from the nova-menu-builder are the only files within my project which actually have the o1-overflow-hidden class. So I'm guessing the menu builder is interfering with other resource index pages.

Detailed steps to reproduce the issue:

• Upgrade to latests version or >= 4.17.0.
• Open index of resource with plenty of columns on a small screen, attempt to scroll horizontally to reveal other columns (no scrolling allowed).
• Downgrade nova to 4.16.1.
• Open index of resource with plenty of columns on a small screen, attempt to scroll horizontally to reveal other columns: scrolling works.

[KasparRosin]

@ramonfeleus Hey, thanks for the report. I transfered the issue to nova-sortable, since I assume this package causes it.

Could you confirm, that you also have nova-sortable installed?

[ramonfeleus]

@ramonfeleus Hey, thanks for the report. I transfered the issue to nova-sortable, since I assume this package causes it.

Could you confirm, that you also have nova-sortable installed?

Thanks. Yes, that's also in the stack, nova-translatable as well from Outl1ne.

[KasparRosin]

Published version 3.4.2 that addresses this issue. Thanks for the report!