flex working, but odd vertical spacing

client/homebrew/editor/metadataEditor/metadataEditor.less

@@ -7,10 +7,21 @@
 	width            : 100%;
 	padding          : 25px;
 	background-color : #999;
+	height           : calc(100vh - 54px); // 54px is the height of the navbar + snippet bar.  probably a better way to dynamic get this.
+
+	display: flex;
+	flex-wrap: wrap;
+	gap: 10px;
+
+	.field-group {
+		display: flex;
+		flex-direction: column;
+		flex: 5;
+		gap: 10px;
+	}
 	.field{
 		display       : flex;
 		width         : 100%;
-		margin-bottom : 10px;
 		&>label{
 			display        : inline-block;
 			vertical-align : top;
@@ -23,7 +34,7 @@
 		}
 		&>.value{
 			flex           : 1 1 auto;
-			min-width      : 200px;
+			width          : 50px;
 		}
 		&.thumbnail{
 			height      : 1.4em;
@@ -43,22 +54,33 @@
 					background-color: #777;
 				}
 			}
-			.thumbnail-preview{
-				position    : relative;
-				width       : 80px;
-				height      : min-content;
-				border      : 2px solid white;
-				margin-left : 5px;
-				max-height  : 115px;
+		}
+
+		&.description {
+			flex: 1;
+			textarea.value {
+				resize      : none;
+				height      : auto;
+				font-family : 'Open Sans', sans-serif;
+				font-size   : 0.8em;
 			}
 		}
 	}
-	.description.field textarea.value{
-		resize      : none;
-		height      : 5em;
-		font-family : 'Open Sans', sans-serif;
-		font-size   : 0.8em;
+
+
+	.thumbnail-preview {
+		position: relative;
+		justify-self: center;
+		width: 80px;
+		height: min-content;
+		border: 2px solid white;
+		flex: 1 1;
+		max-height: 115px;
+		aspect-ratio: 1 / 1;
+		object-fit: contain;
+		background-color: cadetblue;
 	}
+
 	.systems.field .value{
 		label{
 			vertical-align : middle;