feat: move classic theme fix to css

Automattic · Jun 26, 2024 · 841b71a · 841b71a
1 parent a0fc682
commit 841b71a
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 7 deletions.
diff --git a/assets/css/frontend/components/tabs.css b/assets/css/frontend/components/tabs.css
@@ -9,7 +9,6 @@
 
 .tab-list {
 	display: flex;
-	flex-wrap: wrap;
 	font-family: var(--newspack-ui-font-family, system-ui, sans-serif);
 	font-size: var(--newspack-ui-font-size-s, 16px);
 	font-weight: 600;

diff --git a/includes/blocks/block-editor/tabs/edit.js b/includes/blocks/block-editor/tabs/edit.js
@@ -151,12 +151,6 @@ const TabsEdit = (props) => {
 				if (tabHeader && tabHeaderButton) {
 					tabHeader.style.left = `${tabHeaderButton.offsetLeft}px`;
 					tabHeader.style.top = `-${tabHeader.offsetHeight + 24}px`;
-
-					// For some reason with the Classic Theme, if tabHeader is empty we're 4px off. 
-					if ( document.body.classList.contains('theme-newspack-theme/newspack-theme') && tabHeader.querySelector( 'span' ) ) {
-						tabHeader.style.top = `-${tabHeader.offsetHeight + 28}px`;
-					}
-
 				}
 			});
 		});

diff --git a/includes/blocks/block-editor/tabs/editor.css b/includes/blocks/block-editor/tabs/editor.css
@@ -126,4 +126,14 @@
 
 .wp-block[data-type="newspack/tabs-item"] + .block-list-appender {
 	display: none !important;
+}
+
+body[class*="theme-newspack-theme/newspack-theme"] {
+	& .wp-block[data-type="newspack/tabs"] {
+		& .tab-header {
+			& .rich-text:has( span ) {
+				top: -4px;
+			}
+		}
+	}
 }