Face setup wizard (#17203)

* Fix login page

* Increase face image size and add time ago

* Add component for indicating steps in a wizard

* Split out form inputs from dialog

* Add wizard for adding new face to library

* Simplify dialog

* Translations

* Fix scaling bug

* Fix key missing

* Improve multi select

* Adjust wording and spacing

* Add tip for face training

* Fix padding

* Remove text for buttons on mobile

web/src/components/indicators/StepIndicator.tsx

@@ -0,0 +1,28 @@
+import { cn } from "@/lib/utils";
+
+type StepIndicatorProps = {
+  steps: string[];
+  currentStep: number;
+};
+export default function StepIndicator({
+  steps,
+  currentStep,
+}: StepIndicatorProps) {
+  return (
+    <div className="flex flex-row justify-evenly">
+      {steps.map((name, idx) => (
+        <div className="flex flex-col items-center gap-2">
+          <div
+            className={cn(
+              "flex size-16 items-center justify-center rounded-full",
+              currentStep == idx ? "bg-selected" : "border-2 border-selected",
+            )}
+          >
+            {idx + 1}
+          </div>
+          <div className="w-24 text-center md:w-24">{name}</div>
+        </div>
+      ))}
+    </div>
+  );
+}