diff --git a/static/css/theme.css b/static/css/theme.css index 84666bad6f..6a81fc3609 100644 --- a/static/css/theme.css +++ b/static/css/theme.css @@ -1952,7 +1952,7 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right { } /* remove margin if only a single code block is contained in the tab (FF without :has using .codify style) */ -#body .tab-content.tab-panel-style.codify > .tab-content-text{ +#body .tab-content.codify > .tab-content-text{ padding: 0; } #body .tab-content-text:has(> div.highlight:only-child){ diff --git a/static/js/theme.js b/static/js/theme.js index 6e8be86b12..752ce5f2c8 100644 --- a/static/js/theme.js +++ b/static/js/theme.js @@ -67,22 +67,22 @@ function adjustContentWidth(){ function fixCodeTabs(){ /* if only a single code block is contained in the tab and no style was selected, treat it like style=code */ - var codeTabPanels = Array.from( document.querySelectorAll( '.tab-content.tab-panel-style' ) ).filter( function( tabPanel ){ - return tabPanel.querySelector( '.tab-content-text > div.highlight:only-child, .tab-content-text > pre.pre-code:only-child'); + var codeTabContents = Array.from( document.querySelectorAll( '.tab-content.tab-panel-style' ) ).filter( function( tabContent ){ + return tabContent.querySelector( '*:scope > .tab-content-text > div.highlight:only-child, *:scope > .tab-content-text > pre.pre-code:only-child'); }); - codeTabPanels.forEach( function( tabPanel ){ - var p = tabPanel.parentNode.parentNode; - var tabId = tabPanel.dataset.tabItem; - var tabButton = p.querySelector( '.tab-nav-button.tab-panel-style[data-tab-item="'+tabId+'"]' ); - if( tabPanel.classList.contains( 'initial' ) ){ + codeTabContents.forEach( function( tabContent ){ + var tabId = tabContent.dataset.tabItem; + var tabPanel = tabContent.parentNode.parentNode; + var tabButton = tabPanel.querySelector( '.tab-nav-button.tab-panel-style[data-tab-item="'+tabId+'"]' ); + if( tabContent.classList.contains( 'initial' ) ){ tabButton.classList.remove( 'initial' ); tabButton.classList.add( 'code' ); - tabPanel.classList.remove( 'initial' ); - tabPanel.classList.add( 'code' ); + tabContent.classList.remove( 'initial' ); + tabContent.classList.add( 'code' ); } // mark code blocks for FF without :has() - tabPanel.classList.add( 'codify' ); + tabContent.classList.add( 'codify' ); }); }