Button with "idle" and "saving" states

project-edit.html

@@ -49,7 +49,13 @@
 		<div class="text-xs text-slate-500 italic -mt-3 mb-4">88/500 max. characters</div>
 
 		<div class="mt-8">
-			<input type="submit" class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2" value="Save Project" />
+			<button type="submit" class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2">
+				<!-- SHOW if in idle state -->
+				<span class="hidden">Save Project</span>
+
+				<!-- SHOW if in saving state; DISABLE button while in saving state -->
+				<span class=""><i class="fa-solid fa-spinner fa-spin-pulse"></i> Saving&hellip;</span>
+			</button>
 			<button type="button" class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md">Cancel</button>
 		</div>
 	</form>