From 2fd4a47b33a6b952c8c0a51d0d77c2609c5f0c0b Mon Sep 17 00:00:00 2001
From: the-djmaze <>
Date: Thu, 6 Oct 2022 11:04:10 +0200
Subject: [PATCH] Improved Message Tags UX #419

---
 dev/Styles/User/MessageView.less                       | 10 +++++++++-
 .../app/templates/Views/User/MailMessageView.html      |  2 +-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/dev/Styles/User/MessageView.less b/dev/Styles/User/MessageView.less
index 3b4f631b4..372d6aff6 100644
--- a/dev/Styles/User/MessageView.less
+++ b/dev/Styles/User/MessageView.less
@@ -97,8 +97,16 @@ html.rl-no-preview-pane {
 
 	.messageTags {
 		margin-top: 6px;
+		align-items: baseline;
+		display: flex;
 	}
-	.messageTags span span {
+	.messageTags > * {
+		flex: 0 0 0;
+	}
+	.messageAssignedTags {
+		flex: 1 0 0;
+	}
+	.messageAssignedTags span {
 		border: 1px solid #808080;
 		padding: 2px;
 	}
diff --git a/snappymail/v/0.0.0/app/templates/Views/User/MailMessageView.html b/snappymail/v/0.0.0/app/templates/Views/User/MailMessageView.html
index 79f0422bf..28533a2c8 100644
--- a/snappymail/v/0.0.0/app/templates/Views/User/MailMessageView.html
+++ b/snappymail/v/0.0.0/app/templates/Views/User/MailMessageView.html
@@ -194,7 +194,7 @@
 				<!-- ko if: tagsAllowed -->
 				<div class="messageTags">
 					<span data-i18n="MESSAGE/TAGS"></span>:
-					<span data-bind="html: message().tagsToHTML()"></span>
+					<span class="messageAssignedTags" data-bind="html: message().tagsToHTML()"></span>
 					<div class="btn-group" data-bind="registerBootstrapDropdown: true" style="display: inline-block">
 						<a class="btn btn-thin btn-transparent dropdown-toggle fontastic" id="tags-dropdown-id" href="#" tabindex="-1">☰</a>
 						<menu class="dropdown-menu right-edge" role="menu" aria-labelledby="tags-dropdown-id">