Tabs should remain horizontal on desktop beyond a certain width

Created on 12 December 2018, over 6 years ago
Updated 8 June 2025, 6 days ago

There is logic in /core/themes/seven/js/nav-tabs.js that if the height of a set of tabs is taller the first set of tabs, (primary tabs), to switch to a vertical or mobile view. This is great on mobile and tablet, but doesn't work well on large desktop, as you end up with very long full-width vertical tabs that push everything way below the fold. For example if you have many display modes, it pushes everything below the fold:

In my case, when the secondary tabs are set to verity on a macbook retina on /admin/structure/types/manage/article/display, the ul.tabs.secondary these secondary tabs are 1375 pixels in height! (Labels changed to preserve anonymity).

I don't believe any special is required to recreate this. Just create a bunch of view modes.

Proposed Solution:

Update the logic to exclude the vertical tabs after a certain width.

🐛 Bug report
Status

Needs work

Version

1.0

Component

Code

Created by

🇺🇸United States oknate Greater New York City Area

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024