fitted number inputs

Author: manglemix

usr-web/src/lib/index.ts

@@ -113,10 +113,10 @@ export class TeamQuery {
 	public verifyNames(names: Set<string>): string | null {
 		let leftValid;
 		if (typeof this.left === 'string') {
-            let word = this.left;
-            if (word.startsWith('!')) {
-                word = word.substring(1);
-            }
+			let word = this.left;
+			if (word.startsWith('!')) {
+				word = word.substring(1);
+			}
 			leftValid = word === '*' || names.has(word) || TEAM_SET.has(word) ? null : word;
 		} else {
 			leftValid = this.left.verifyNames(names);
@@ -125,13 +125,11 @@ export class TeamQuery {
 			return leftValid;
 		}
 		if (typeof this.right === 'string') {
-            let word = this.right;
-            if (word.startsWith('!')) {
-                word = word.substring(1);
-            }
-			return word === '*' || names.has(word) || TEAM_SET.has(word)
-				? null
-				: word;
+			let word = this.right;
+			if (word.startsWith('!')) {
+				word = word.substring(1);
+			}
+			return word === '*' || names.has(word) || TEAM_SET.has(word) ? null : word;
 		} else {
 			return this.right.verifyNames(names);
 		}

usr-web/src/routes/(apps)/manifest/+page.svelte

@@ -101,7 +101,7 @@
 	<title>USR Manifest</title>
 </svelte:head>
 
-<section class="w-min m-4">
+<section class="m-4 w-min">
 	<div class="flex flex-row justify-between">
 		<label>
 			<input type="checkbox" bind:checked={hideInStorage} />
@@ -215,69 +215,65 @@
 	{#snippet selectAnOrder()}
 		<h2>Select an order</h2>
 	{/snippet}
-	{#snippet input()} 
-	<label>
-		Item Name*
-		<input type="text" bind:value={pending_order_name} placeholder="Item Name" />
-	</label>
-
-	<label>
-		Vendor*
-		<input type="text" bind:value={pending_order_vendor} placeholder="Vendor" />
-	</label>
-
-	<label>
-		Link*
-		<input
-			type="url"
-			bind:value={pending_order_link}
-			placeholder="Link to the store"
-		/>
-	</label>
+	{#snippet input()}
+		<label>
+			Item Name*
+			<input type="text" bind:value={pending_order_name} placeholder="Item Name" />
+		</label>
 
-	<div class="flex flex-row justify-around">
 		<label>
-			Count*
-			<input type="number" bind:value={pending_order_count} />
+			Vendor*
+			<input type="text" bind:value={pending_order_vendor} placeholder="Vendor" />
 		</label>
-		
+
 		<label>
-			Unit Cost* (USD)
-			<input type="number" bind:value={pending_order_unit_cost} step="0.01" />
+			Link*
+			<input type="url" bind:value={pending_order_link} placeholder="Link to the store" />
 		</label>
-	</div>
 
-	<label>
-		Team*
-		<select id="team" bind:value={pending_order_team}>
-			<option value="" disabled selected>Select a team</option>
-			<option value="Software">Software</option>
-			<option value="Mechanical">Mechanical</option>
-			<option value="Electrical">Electrical</option>
-			<option value="Systems">Systems</option>
-			<option value="Social">Social</option>
-			<option value="Admin">Admin</option>
-		</select>
-	</label>
+		<div class="num-inputs flex flex-row justify-around gap-4">
+			<label>
+				Count*
+				<input type="number" bind:value={pending_order_count} />
+			</label>
+
+			<label>
+				Unit Cost* (USD)
+				<input type="number" bind:value={pending_order_unit_cost} step="0.01" />
+			</label>
+		</div>
+
+		<label>
+			Team*
+			<select id="team" bind:value={pending_order_team}>
+				<option value="" disabled selected>Select a team</option>
+				<option value="Software">Software</option>
+				<option value="Mechanical">Mechanical</option>
+				<option value="Electrical">Electrical</option>
+				<option value="Systems">Systems</option>
+				<option value="Social">Social</option>
+				<option value="Admin">Admin</option>
+			</select>
+		</label>
 
-	<label>
-		Reason*
-		<textarea bind:value={pending_order_reason} placeholder="Reason"></textarea>
-	</label>
+		<label>
+			Reason*
+			<textarea bind:value={pending_order_reason} placeholder="Reason"></textarea>
+		</label>
 
-	<label>
-		Store In
-		<input
-			type="text"
-			bind:value={pending_order_store_in}
-			placeholder="Where to leave the item"
-		/>
-	</label>
+		<label>
+			Store In
+			<input
+				type="text"
+				bind:value={pending_order_store_in}
+				placeholder="Where to leave the item"
+			/>
+		</label>
 	{/snippet}
 	<section id="order-operations-content" class="flex flex-col gap-4 p-4">
 		{#if tabIndex === 0}
 			{@render input()}
-			
+
 			<button
 				onclick={async () => {
 					if (
@@ -491,4 +487,14 @@
 		padding: 0.2rem;
 		border: 1px solid black;
 	}
+	.num-inputs input {
+		width: 6rem;
+	}
+	.num-inputs label {
+		display: flex;
+		flex-direction: row;
+		gap: 0.5rem;
+		align-items: center;
+		text-align: end;
+	}
 </style>

usr-web/src/routes/(apps)/scheduler/+page.svelte

@@ -335,7 +335,7 @@
 	<title>USR Scheduler</title>
 </svelte:head>
 
-<section id="schedule-operations" class="ml-4 mr-4 mb-4">
+<section id="schedule-operations" class="mb-4 ml-4 mr-4">
 	<div id="schedule-tabs" class="flex flex-row">
 		<button
 			onclick={() => {
@@ -417,7 +417,7 @@
 	</section>
 </section>
 
-<div class="flex justify-end flex-row-reverse flex-wrap gap-4 m-4">
+<div class="m-4 flex flex-row-reverse flex-wrap justify-end gap-4">
 	{#if tabIndex !== 0}
 		<section class="flex flex-row flex-wrap gap-4">
 			{#if selectedCellPeople !== null}
@@ -431,7 +431,7 @@
 			{/if}
 		</section>
 	{/if}
-	
+
 	<table>
 		<thead>
 			<tr>
@@ -481,7 +481,9 @@
 										selectedCellPeople = people;
 										selectedCell = [x, y];
 									}}
-									id={selectedCell !== null && selectedCell[0] === x && selectedCell[1] === y ? 'selected-cell' : ''}
+									id={selectedCell !== null && selectedCell[0] === x && selectedCell[1] === y
+										? 'selected-cell'
+										: ''}
 								>
 								</td>
 							{/snippet}