After updating to Drupal 8.6.x all horizontal tab content is wrapped by a border.

This was because there was a change in the Seven theme core/themes/seven/css/components/details.css. 

.seven-details {
  margin-top: 1em;
  margin-bottom: 1em;
  background-color: #fcfcfa;
  border: 1px solid #bfbfbf;
  border-radius: 3px;
}

We just need to make a small change in formatters/tabs/horizontal-tabs.css

horizontal-tabs-panes .horizontal-tabs-pane {
  padding: 0 1em;
  border: 0;
}
CommentFileSizeAuthor
#9 interdiff_3-8.txt335 bytesniklan
#9 horizontal-tab-content-detail-border-3012461-9.patch434 bytesniklan
#3 horizontal-tab-content-detail-border-3012461.patch380 bytespartdigital
#5 3012461-5.patch368 bytesmahtab_alam
border.png61.1 KBpartdigital

Comments

partdigital created an issue. See original summary.

partdigital’s picture

partdigital commented
Issue summary: View changes
partdigital’s picture

partdigital commented
StatusFileSize
new horizontal-tab-content-detail-border-3012461.patch380 bytes
tessa bakker’s picture

tessa bakker
she/they
Primary language Dutch
commented
Status: Needs review » Reviewed & tested by the community

Thanks for the patch!

Tested with Seven en horizontal tabs in Drupal 8.6

mahtab_alam’s picture

mahtab_alam commented
StatusFileSize
new 3012461-5.patch368 bytes
tessa bakker’s picture

tessa bakker
she/they
Primary language Dutch
commented

@mahtab_alam Why the need for a new patch?

I removed your patch for the list now, if it's still needed, please explain why and change the status to 'Needs review'.

partdigital’s picture

partdigital commented

@Tess Bakker, it looks @mahtab_alam has been active in the Field Group issue queue and made a bunch of patches with nominal changes. I suspect to pad his profile with contributions.

partdigital’s picture

partdigital commented
niklan’s picture

niklan
Primary language Russian
Location Russia, Perm
commented
StatusFileSize
new horizontal-tab-content-detail-border-3012461-9.patch434 bytes
new interdiff_3-8.txt335 bytes

+1 for RTBC.

I think we also need to remove background-color set by .seven-details, because this looks out of place.

I also think we must unset padding for .horizontal-tabs-panes .horizontal-tabs-pane, because we already have margins from .seven-details and paddings from .seven-details__wrapper which do the same thing.

tessa bakker’s picture

tessa bakker
she/they
Primary language Dutch
commented
Status: Reviewed & tested by the community » Needs review

  • zuuperman committed 3764a05 on 8.x-3.x authored by Niklan 
    Issue #3012461 by partdigital, Niklan, mahtab_alam: Horizontal tab...
nils.destoop’s picture

nils.destoop commented
Status: Needs review » Fixed

Thx for the patch, I committed it to dev

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.