UN-3185: Fix squished route-loading spinner in the content area (#2118)

GenericLoader's .center uses width/height: inherit, which collapsed to a
narrow column when used as LazyOutlet's content-area Suspense fallback (the
loader text wrapped one word per line beside the sidebar). Wrap the fallback in
a full-width, flex-centered .lazyOutletFallback box and pin .center to width:100%
so it renders centered at its natural size. The top-level loader in Router.jsx
is unaffected (it doesn't use this wrapper).

Author: jaseemjaskp

frontend/src/components/error/LazyOutlet/LazyOutlet.css

@@ -0,0 +1,17 @@
+/* Center the route-loading fallback in the content area. */
+.lazyOutletFallback {
+  display: flex;
+  width: 100%;
+  min-height: 60vh;
+  align-items: center;
+  justify-content: center;
+}
+
+/* GenericLoader's .center uses `width/height: inherit`, which collapses to a
+   narrow column inside the flex content area (the loader text ends up wrapping
+   one word per line next to the sidebar). Pin it to the full fallback width so
+   it renders centered at its natural size instead. */
+.lazyOutletFallback > .center {
+  width: 100%;
+  height: auto;
+}

frontend/src/components/error/LazyOutlet/LazyOutlet.jsx

@@ -4,6 +4,7 @@ import { Outlet, useLocation } from "react-router-dom";
 
 import { GenericLoader } from "../../generic-loader/GenericLoader.jsx";
 import { ErrorBoundary } from "../../widgets/error-boundary/ErrorBoundary.jsx";
+import "./LazyOutlet.css";
 
 // A failed dynamic import — almost always a stale hashed chunk after a
 // redeploy (the client's index.html references a filename the CDN no longer
@@ -74,7 +75,15 @@ export function LazyOutlet() {
       onError={handleRouteError}
       fallbackComponent={<RouteLoadError />}
     >
-      <Suspense fallback={<GenericLoader />}>
+      {/* Wrap the loader so it fills the content area and stays centered — see
+          LazyOutlet.css for why GenericLoader needs this here. */}
+      <Suspense
+        fallback={
+          <div className="lazyOutletFallback">
+            <GenericLoader />
+          </div>
+        }
+      >
         <Outlet />
       </Suspense>
     </ErrorBoundary>