Steps to reproduce:

  1. Setup a fresh drupal 8 (minimal).
  2. Enable and set Seven as default theme.
  3. Go to /admin/structure/block/list/seven
  4. Swap the order of 'Primary tabs' and 'Page title'. then save.
  5. Open a page that has more then one tab (ie admin/people).
  6. Narrow your browser window.
  7. You will see an overlapped and buggy header.

Before swapping 'Primary tabs' and 'Page title':

After the swap:

CommentFileSizeAuthor
#28 tabs_do_not_stack-2859242-28.patch478 bytesskylord
#24 Screenshot_After_Patch_22.png25.36 KBandregp
#24 Screenshot_Before_Patch_22.png26.35 KBandregp
#22 interdiff-2859242-21_22.txt724 bytesGauravvvv
#22 2859242-22.patch600 bytesGauravvvv
#21 2859242-21.patch626 bytesandregp
#21 Screenshot_After_Patch_21_b.png25.4 KBandregp
#21 Screenshot_After_Patch_21_a.png26.28 KBandregp
#20 Screenshot_Tabs_Before.png20.74 KBandregp
#20 Screenshot_Tabs_After.png21.73 KBandregp
#11 interdiff-2859242-11.txt800 bytesHOG
#11 collapsed-tabs-2859242-11.patch629 bytesHOG
#6 with-secondary-tabs.png31.97 KBloominade
#6 show-secondary-tabs.png101.83 KBloominade
#3 more-info.png435.19 KBloominade
tabs-narrow.png45.44 KBloominade
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

loominade created an issue. See original summary.

cilefen’s picture

cilefen CreditAttribution: cilefen commented
Status: Active » Postponed (maintainer needs more info)

I cannot reproduce this on 8.4.x. More information is needed.

loominade’s picture

loominade CreditAttribution: loominade commented
Version: 8.2.6 » 8.4.x-dev
Status: Postponed (maintainer needs more info) » Active
FileSize
more-info.png435.19 KB

Issue persists in 8.4.x-dev

I am using OSX/Chrome:
more info

loominade’s picture

loominade CreditAttribution: loominade commented
Issue summary: View changes

I can only reproduce this using the minimal installation profile

loominade’s picture

loominade CreditAttribution: loominade commented
Title: Tabs do not stack correctly » Tabs do not stack correctly when placed outside (or not at the bottom of) the header region

I figured it out: Tab stacking only works when the tabs are the last block in the header region otherwise inactive tabs cannot be hidden

loominade’s picture

loominade CreditAttribution: loominade commented
FileSize
show-secondary-tabs.png101.83 KB
with-secondary-tabs.png31.97 KB

another way to break this: enable the secondary tabs
enable secondary tabs
with secondary tabs

tacituseu’s picture

tacituseu CreditAttribution: tacituseu commented

@loominade: yes it all relies on:

.content-header {
  overflow: hidden;
}

in core\themes\seven\css\components\content-header.css

Version: 8.4.x-dev » 8.5.x-dev

Drupal 8.4.0-alpha1 will be released the week of July 31, 2017, which means new developments and disruptive changes should now be targeted against the 8.5.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.5.x-dev » 8.6.x-dev

Drupal 8.5.0-alpha1 will be released the week of January 17, 2018, which means new developments and disruptive changes should now be targeted against the 8.6.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.6.x-dev » 8.7.x-dev

Drupal 8.6.0-alpha1 will be released the week of July 16, 2018, which means new developments and disruptive changes should now be targeted against the 8.7.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

HOG’s picture

HOG CreditAttribution: HOG at Skilld, Drupal Ukraine Community commented
FileSize
collapsed-tabs-2859242-11.patch629 bytes
interdiff-2859242-11.txt800 bytes

Version: 8.7.x-dev » 8.8.x-dev

Drupal 8.7.0-alpha1 will be released the week of March 11, 2019, which means new developments and disruptive changes should now be targeted against the 8.8.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.8.x-dev » 8.9.x-dev

Drupal 8.8.0-alpha1 will be released the week of October 14th, 2019, which means new developments and disruptive changes should now be targeted against the 8.9.x-dev branch. (Any changes to 8.9.x will also be committed to 9.0.x in preparation for Drupal 9’s release, but some changes like significant feature additions will be deferred to 9.1.x.). For more information see the Drupal 8 and 9 minor version schedule and the Allowed changes during the Drupal 8 and 9 release cycles.

Version: 8.9.x-dev » 9.1.x-dev

Drupal 8.9.0-beta1 was released on March 20, 2020. 8.9.x is the final, long-term support (LTS) minor release of Drupal 8, which means new developments and disruptive changes should now be targeted against the 9.1.x-dev branch. For more information see the Drupal 8 and 9 minor version schedule and the Allowed changes during the Drupal 8 and 9 release cycles.

Version: 9.1.x-dev » 9.2.x-dev

Drupal 9.1.0-alpha1 will be released the week of October 19, 2020, which means new developments and disruptive changes should now be targeted for the 9.2.x-dev branch. For more information see the Drupal 9 minor version schedule and the Allowed changes during the Drupal 9 release cycle.

Version: 9.2.x-dev » 9.3.x-dev

Drupal 9.2.0-alpha1 will be released the week of May 3, 2021, which means new developments and disruptive changes should now be targeted for the 9.3.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

smustgrave’s picture

smustgrave CreditAttribution: smustgrave at Mobomo commented
Status: Active » Reviewed & tested by the community

know this is super old but I experienced this issue on seven with my primary tabs block in the header section and "tab" block in the pre content section. The last patch worked for me.

Version: 9.3.x-dev » 9.4.x-dev

Drupal 9.3.0-rc1 was released on November 26, 2021, which means new developments and disruptive changes should now be targeted for the 9.4.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

quietone’s picture

quietone CreditAttribution: quietone at PreviousNext commented
Status: Reviewed & tested by the community » Needs work
Issue tags: +Needs issue summary update, +Needs steps to reproduce

@smustgrave, thanks for confirming the patch works.

I tested using the steps in the Issue Summary and could not reproduce the problem. I think I reproduced it by swapping the order of 'Primary tabs' and 'Page title' on /admin/structure/block/list/seven so that 'Page title' was last.

This needs an issue summary update with the correct steps to reproduce. Since this is a UI issue it also needs new screenshots, before and after, in the issue summary.

andregp’s picture

andregp CreditAttribution: andregp at CI&T commented
Issue summary: View changes
Issue tags: -Needs issue summary update, -Needs steps to reproduce
FileSize
Screenshot_Tabs_After.png21.73 KB
Screenshot_Tabs_Before.png20.74 KB
andregp’s picture

andregp CreditAttribution: andregp at CI&T commented
Status: Needs work » Needs review
FileSize
Screenshot_After_Patch_21_a.png26.28 KB
Screenshot_After_Patch_21_b.png25.4 KB
2859242-21.patch626 bytes

I made a reroll of patch #11 for 9.4.x
Here are some prints with this patch applied.

Gauravvvv’s picture

Gauravvvv CreditAttribution: Gauravvvv at Srijan | A Material+ Company for Drupal India Association commented
FileSize
2859242-22.patch600 bytes
interdiff-2859242-21_22.txt724 bytes

Re-rolled patch #21, Attached interdiff for same.

Status: Needs review » Needs work

The last submitted patch, 22: 2859242-22.patch, failed testing. View results

andregp’s picture

andregp CreditAttribution: andregp at CI&T commented
Status: Needs work » Reviewed & tested by the community
FileSize
Screenshot_Before_Patch_22.png26.35 KB
Screenshot_After_Patch_22.png25.36 KB

The test fail was a random test error. Added a retest and it passed.

Thanks @Gauravmahlawat for the cs fixes.

Patch #22 still applies cleanly and solves the issue.

Version: 9.4.x-dev » 9.5.x-dev

Drupal 9.4.0-alpha1 was released on May 6, 2022, which means new developments and disruptive changes should now be targeted for the 9.5.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

larowlan’s picture

larowlan
Location 🇦🇺🏝.au GMT+10
CreditAttribution: larowlan at PreviousNext commented
Priority: Normal » Minor
Status: Reviewed & tested by the community » Postponed

We're actively trying to deprecate the Seven theme, so postponing this in the meantime.
Once we move it to contrib, we may choose to unpostpone this issue.

longwave’s picture

longwave
he/him
Primary language English
Location UK
CreditAttribution: longwave at Full Fat Things commented
Project: Drupal core » Seven
Version: 9.5.x-dev » 1.0.0-alpha1
Component: Seven theme » Code
Status: Postponed » Reviewed & tested by the community

The Seven theme has been removed from Drupal 10 core. I confirmed that this issue only affects Seven and no other themes included with Drupal core, so I am moving this to the contributed Seven project.

skylord’s picture

skylord CreditAttribution: skylord commented
FileSize
tabs_do_not_stack-2859242-28.patch478 bytes

Reroll for current contrib version.