Layout change.

imports/ui/Assets/AssetDataEntry.svelte

@@ -35,8 +35,7 @@
 
 		if (isOpen_AddAssetType) {
 			openAddAssetTypeButton.classList.add("reject-button");
-		}
-		else {
+		} else {
 			openAddAssetTypeButton.classList.remove("reject-button");
 		}
 	}
@@ -72,12 +71,14 @@
 </script>
 
 <div class="listContainer">
-	<Dialog bind:open={openDialog} surface$style="width: 850px; max-width: calc(100vw - 32px);" on:SMUIDialog:closed={dialogClosed}>
+	<Dialog bind:open={openDialog} surface$style="width: 850px; max-width: calc(100vw - 32px);"
+	        on:SMUIDialog:closed={dialogClosed}>
 		<Title id="large-scroll-title">Asset Types</Title>
 		<Content id="large-scroll-content">
 			<List class="assetTypesList" twoLine singleSelection bind:selectedIndex={assetTypeDialogSelectedIndex}>
 				{#each $assetTypes as type}
-					<Item on:SMUI:action={() => (assetTypeDialogSelectedValue = type)} selected={assetTypeDialogSelectedValue === type}>
+					<Item on:SMUI:action={() => (assetTypeDialogSelectedValue = type)}
+					      selected={assetTypeDialogSelectedValue === type}>
 						<Text>
 							<PrimaryText>{type.name}</PrimaryText>
 							<SecondaryText>{type.description}</SecondaryText>
@@ -96,8 +97,6 @@
 		</Actions>
 	</Dialog>
 
-	<div class="columnContainer">
-		<div class="listColumn">
 	<h3 style="display: inline-block">Asset Types</h3>
 	<Button class="addBtn" on:click={openAssetTypesDialog}>
 		<Label>Add...</Label>
@@ -109,9 +108,6 @@
 			</Item>
 		{/each}
 	</List>
-			
-		</div>
-		<div class="fieldColumn">
 	<div style="grid-column: 1/span 1">
 		<TextField type="text" style="width: 100%" bind:value={assetId} label="AssetId">
 		</TextField>
@@ -120,39 +116,35 @@
 		<TextField type="text" style="width: 100%" bind:value={serial} label="Serial">
 		</TextField>
 	</div>
+	<div style="text-align: right">
+		<Button on:click={addAsset} variant="raised">Add</Button>
 	</div>
 </div>
-	<Button on:click={addAsset}>Add</Button>
-</div>
 
 <style>
     .columnContainer {
         display: grid;
         grid-template-columns: minmax(20rem, 1fr) minmax(20rem, 1fr);
     }
+
     :global(.addBtn) {
         margin-left: 4rem;
     }
+
     :global(.assetTypeList) {
         --mdc-ripple-color: blue;
         --mdc-ripple-selected-opacity: 0.2;
     }
 
-    .listContainer {
-        display: inline-block;
-        margin: 1rem;
-        max-width: 500px;
-    }
     div.listContainer h2 {
         margin: 0;
     }
-    .list {
-        //border: 2px solid #4f4e4e;
-    }
+
     .listItem:nth-child(even) {
         /*background: #f6f6f6;*/
         background: white;
     }
+
     .listItem {
         margin: 4px 0;
         overflow: hidden;
@@ -163,9 +155,11 @@
         padding-top: 0.4rem;
         border-bottom: 1px solid gray;
     }
+
     .listItem:last-child {
         border: 0;
     }
+
     .listItem.selected {
         background-color: rgba(255, 255, 0, 0.38);
     }