From c5a8c6075e6e5ce08058eaa6e72b8aed28a501b3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Raimund=20Schl=C3=BC=C3=9Fler?=
 <raimund.schluessler@mailbox.org>
Date: Sat, 20 Mar 2021 15:06:34 +0100
Subject: [PATCH] Allow last crumb to shrink if all crumbs collapsed
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Raimund Schlüßler <raimund.schluessler@mailbox.org>
---
 src/components/Breadcrumb/Breadcrumb.vue   | 12 ++++++++++++
 src/components/Breadcrumbs/Breadcrumbs.vue |  7 ++++++-
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/components/Breadcrumb/Breadcrumb.vue b/src/components/Breadcrumb/Breadcrumb.vue
index 0864391f57..fc1ca6e772 100644
--- a/src/components/Breadcrumb/Breadcrumb.vue
+++ b/src/components/Breadcrumb/Breadcrumb.vue
@@ -220,6 +220,14 @@ export default {
 	height: $clickable-area;
 	padding: 0;
 
+	&:last-child {
+		max-width: 210px;
+
+		a {
+			flex-shrink: 1;
+		}
+	}
+
 	&::before {
 		display: flex;
 		align-items: center;
@@ -236,6 +244,10 @@ export default {
 		padding-right: 2px;
 	}
 
+	> a, > span {
+		max-width: 100%;
+	}
+
 	a {
 		align-items: center;
 		display: inline-flex;
diff --git a/src/components/Breadcrumbs/Breadcrumbs.vue b/src/components/Breadcrumbs/Breadcrumbs.vue
index fd46e7fc1f..ec1f72fb7e 100644
--- a/src/components/Breadcrumbs/Breadcrumbs.vue
+++ b/src/components/Breadcrumbs/Breadcrumbs.vue
@@ -502,7 +502,7 @@ export default {
 			: []
 		this.addCrumbs(crumbs, crumbs2, crumbs1.length)
 
-		return createElement('div', { class: 'breadcrumb', ref: 'container' }, crumbs)
+		return createElement('div', { class: ['breadcrumb', { collapsed: (this.hiddenCrumbs.length === breadcrumbs.length - 2) }], ref: 'container' }, crumbs)
 	},
 }
 </script>
@@ -512,6 +512,11 @@ export default {
 	width: 100%;
 	flex-grow: 1;
 
+	&.collapsed  .crumb:last-child {
+		min-width: 100px;
+		flex-shrink: 1;
+	}
+
 	.crumb--hovered{
 		background-color: var(--color-primary-light);
 	}