Fix overflowing topbar with very long breadcrumb

Fixes #6348
getkirby · Jul 22, 2024 · ea18cad · ea18cad
1 parent 744a004
commit ea18cad
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/panel/src/components/Navigation/Breadcrumb.vue b/panel/src/components/Navigation/Breadcrumb.vue
@@ -100,16 +100,14 @@ export default {
 	display: flex;
 	align-items: center;
 	min-width: 0;
+	transition: flex-shrink 0.1s;
 }
 .k-breadcrumb ol li:not(:last-child)::after {
 	content: var(--breadcrumb-divider);
 	opacity: 0.175;
 	flex-shrink: 0;
 }
-.k-breadcrumb ol li {
-	min-width: 0;
-	transition: flex-shrink 0.1s;
-}
+
 .k-breadcrumb .k-icon[data-type="loader"] {
 	opacity: 0.5;
 }

diff --git a/panel/src/components/View/Topbar.vue b/panel/src/components/View/Topbar.vue
@@ -52,6 +52,8 @@ export default {
 
 .k-topbar-breadcrumb {
 	margin-inline-start: -2px;
+	flex-shrink: 1;
+	min-width: 0;
 }
 
 .k-topbar-spacer {