Make tab-nav a bit more responsive

Fixes #2473
woocommerce · Nov 30, 2024 · d1961da · d1961da
1 parent c0ff8fc
commit d1961da
Showing 1 changed file with 2 additions and 0 deletions.
diff --git a/js/src/components/app-tab-nav/index.scss b/js/src/components/app-tab-nav/index.scss
@@ -1,5 +1,6 @@
 .app-tab-nav__tabs {
 	display: flex;
+	flex-wrap: wrap;
 	align-items: stretch;
 	box-shadow: inset 0 -1px 0 $gray-400;
 	margin-bottom: var(--main-gap);
@@ -15,6 +16,7 @@
 		margin-left: 0;
 		font-weight: 500;
 		box-sizing: border-box;
+		box-shadow: inset 0 -1px 0 #ccc;
 
 		// This pseudo-element "duplicates" the tab label and sets the text to bold.
 		// This ensures that the tab doesn't change width when selected.