Tabs: Vertical Tabs should be 40px min height (#63446)

* Inserter: Reduce the height of the categories tabs to 40px * Make all vertically oriented tabs have a min height of 40px
WordPress · Jul 15, 2024 · abed060 · abed060
1 parent 7a3d339
commit abed060
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 0 deletions.
diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -12,6 +12,7 @@
 -   `CustomSelectControlV2`: animate select popover appearance. ([#63343](https://github.com/WordPress/gutenberg/pull/63343))
 -   `CustomSelectControlV2`: do not flip popover if legacy adapter. ([#63357](https://github.com/WordPress/gutenberg/pull/63357)).
 -   `DropdownMenuV2`: invert animation direction. ([#63443](https://github.com/WordPress/gutenberg/pull/63443)).
+-   `Tabs`: Vertical Tabs should be 40px min height. ([#63446](https://github.com/WordPress/gutenberg/pull/63446)).
 
 ### Enhancements
 

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 )`