From d9f094053f7c12207a76794cd3be50db21e303fe Mon Sep 17 00:00:00 2001
From: nathan <nathangray.bsc+github@gmail.com>
Date: Tue, 12 Jul 2022 11:36:18 -0600
Subject: [PATCH] Et2Select: Ellipsis on tags that are too long

---
 api/js/etemplate/Et2Select/Tag/Et2EmailTag.ts | 2 ++
 api/js/etemplate/Et2Select/Tag/Et2Tag.ts      | 5 ++++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/api/js/etemplate/Et2Select/Tag/Et2EmailTag.ts b/api/js/etemplate/Et2Select/Tag/Et2EmailTag.ts
index 50a0c61e2d..1acafa5332 100644
--- a/api/js/etemplate/Et2Select/Tag/Et2EmailTag.ts
+++ b/api/js/etemplate/Et2Select/Tag/Et2EmailTag.ts
@@ -35,10 +35,12 @@ export class Et2EmailTag extends Et2Tag
 			.tag__prefix {				
 				width: 20px;
 				height: 20px;
+				flex: 0 1 auto;
 				
 				background-color: initial;
 				background-repeat: no-repeat;
 				background-size: contain;
+				background-position-y: center;
 				
 				opacity: 30%;
 				cursor: pointer;
diff --git a/api/js/etemplate/Et2Select/Tag/Et2Tag.ts b/api/js/etemplate/Et2Select/Tag/Et2Tag.ts
index 3f15233ae8..04315e9cf9 100644
--- a/api/js/etemplate/Et2Select/Tag/Et2Tag.ts
+++ b/api/js/etemplate/Et2Select/Tag/Et2Tag.ts
@@ -23,6 +23,7 @@ export class Et2Tag extends Et2Widget(SlTag)
 			shoelace, css`
 		:host {
 			flex: 1 1 auto;
+			overflow: hidden;
 		}
 		.tag--pill {
 			overflow: hidden;
@@ -34,7 +35,9 @@ export class Et2Tag extends Et2Widget(SlTag)
 		}
 		.tag__content {
 			padding: 0px 0.2rem;
-			flex: 1 1 auto;
+			flex: 1 2 auto;
+			overflow: hidden;
+			text-overflow: ellipsis;
 		}
 		/* Avoid button getting truncated by right side of button */
 		.tag__remove {