Make all vertically oriented tabs have a min height of 40px

WordPress · Jul 12, 2024 · 09429f2 · 09429f2
1 parent 00fb50c
commit 09429f2
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/packages/block-editor/src/components/inserter/style.scss b/packages/block-editor/src/components/inserter/style.scss
@@ -243,7 +243,6 @@ $block-inserter-tabs-height: 44px;
 		display: block;
 		position: relative;
 		height: auto;
-		min-height: 40px;
 
 		&[aria-selected="true"] {
 			color: var(--wp-admin-theme-color);

diff --git a/packages/components/src/tabs/styles.ts b/packages/components/src/tabs/styles.ts
@@ -120,6 +120,12 @@ export const Tab = styled( Ariakit.Tab )`
 			opacity: 1;
 		}
 	}
+
+	[aria-orientation='vertical'] & {
+		min-height: ${ space(
+			10
+		) }; // Avoid fixed height to allow for long strings that go in multiple lines.
+	}
 `;
 
 export const TabPanel = styled( Ariakit.TabPanel )`