From 28d45b89e0648f8bafc27e2543ae72927715fdd8 Mon Sep 17 00:00:00 2001
From: Gazook89 <58999374+Gazook89@users.noreply.github.com>
Date: Fri, 11 Mar 2022 23:10:50 -0600
Subject: [PATCH 1/4] set mask-image blends to fixed points

fixed blend points allows for different sized metadata panel without inadvertently masking text.
---
 client/homebrew/editor/metadataEditor/metadataEditor.less | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.less b/client/homebrew/editor/metadataEditor/metadataEditor.less
index 357ed6abd..14e3e653e 100644
--- a/client/homebrew/editor/metadataEditor/metadataEditor.less
+++ b/client/homebrew/editor/metadataEditor/metadataEditor.less
@@ -118,8 +118,9 @@
 						color: white;
 					}
 					img {
-						mask-image: linear-gradient(90deg, transparent, black 20%);
-						-webkit-mask-image: linear-gradient(90deg, transparent, black 20%);
+						mask-image: linear-gradient(90deg, transparent 150px, black 250px);
+						-webkit-mask-image: linear-gradient(90deg, transparent 150px, black 250px);
+						width: 100%;
 				    position: absolute;
 				    right: 0px;
 				    top: 0px;

From 3a82e2a24b05370d6b8103928b7b111751c5f9e8 Mon Sep 17 00:00:00 2001
From: Gazook89 <58999374+Gazook89@users.noreply.github.com>
Date: Fri, 11 Mar 2022 23:11:27 -0600
Subject: [PATCH 2/4] fix *suppdorted* typo

---
 client/homebrew/editor/metadataEditor/metadataEditor.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.jsx b/client/homebrew/editor/metadataEditor/metadataEditor.jsx
index 087e344b5..fbd4011c1 100644
--- a/client/homebrew/editor/metadataEditor/metadataEditor.jsx
+++ b/client/homebrew/editor/metadataEditor/metadataEditor.jsx
@@ -151,7 +151,7 @@ const MetadataEditor = createClass({
 			dropdown =
 				<Nav.dropdown className='disabled' trigger='disabled'>
 					<div>
-						{`Themes are not suppdorted in the Legacy Renderer`} <i className='fas fa-caret-down'></i>
+						{`Themes are not supported in the Legacy Renderer`} <i className='fas fa-caret-down'></i>
 					</div>
 				</Nav.dropdown>;
 		} else {

From a6ede58d8e89bc0eb58764aa0e793405e3398dff Mon Sep 17 00:00:00 2001
From: Gazook89 <58999374+Gazook89@users.noreply.github.com>
Date: Fri, 11 Mar 2022 23:16:08 -0600
Subject: [PATCH 3/4] set dropdown items to appear *over* subsequent items

change navdropdown items to position:absolute; so they appear *over* the next metadata items, rather than pushing them down when dropdown is open.
---
 client/homebrew/editor/metadataEditor/metadataEditor.less | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.less b/client/homebrew/editor/metadataEditor/metadataEditor.less
index 14e3e653e..9cb7d1965 100644
--- a/client/homebrew/editor/metadataEditor/metadataEditor.less
+++ b/client/homebrew/editor/metadataEditor/metadataEditor.less
@@ -87,6 +87,7 @@
 		.navDropdownContainer {
 			background-color: white;
 			width: 100%;
+			position: relative;
 			&.disabled {
 				font-style:italic;
 				font-style: italic;
@@ -107,6 +108,8 @@
 			}
 			.navDropdown {
 				box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
+				position:absolute;
+				width:100%;
 				.item {
 					padding: 3px 3px;
 					border-top: 1px solid rgb(118, 118, 118);

From e12579a2a292bc571295885dc5039f1e14b49f39 Mon Sep 17 00:00:00 2001
From: Trevor Buckner <calculuschild@gmail.com>
Date: Sun, 13 Mar 2022 01:38:48 -0500
Subject: [PATCH 4/4] Restore original image size, shift position to not cover
 text

---
 client/homebrew/editor/metadataEditor/metadataEditor.less | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.less b/client/homebrew/editor/metadataEditor/metadataEditor.less
index 9cb7d1965..a7746c882 100644
--- a/client/homebrew/editor/metadataEditor/metadataEditor.less
+++ b/client/homebrew/editor/metadataEditor/metadataEditor.less
@@ -121,11 +121,10 @@
 						color: white;
 					}
 					img {
-						mask-image: linear-gradient(90deg, transparent 150px, black 250px);
-						-webkit-mask-image: linear-gradient(90deg, transparent 150px, black 250px);
-						width: 100%;
+						mask-image: linear-gradient(90deg, transparent, black 20%);
+						-webkit-mask-image: linear-gradient(90deg, transparent, black 20%);
 				    position: absolute;
-				    right: 0px;
+				    left: ~"max(100px, 100% - 300px)";
 				    top: 0px;
 					}
 				}