refactor: update loading and error boundary components to use Card for consistency

This commit is contained in:
Ardeman
2025-03-19 18:00:29 +08:00
parent abf7e829ba
commit deeefda8bc
+3 -3
View File
@@ -69,7 +69,7 @@ clientLoader.hydrate = true as const
export const HydrateFallback = () => { export const HydrateFallback = () => {
return ( return (
<Card> <Card>
<div className="flex h-96 items-center justify-center"> <div className="flex h-96 items-center justify-center gap-1">
<ArrowPathIcon className="size-5 animate-spin" />{' '} <ArrowPathIcon className="size-5 animate-spin" />{' '}
<span>Loading...</span> <span>Loading...</span>
</div> </div>
@@ -94,7 +94,7 @@ export const ErrorBoundary = ({ error }: Route.ErrorBoundaryProps) => {
} }
return ( return (
<div className="container mx-auto p-4"> <Card>
<h1>{message}</h1> <h1>{message}</h1>
<p>{details}</p> <p>{details}</p>
{stack && ( {stack && (
@@ -102,7 +102,7 @@ export const ErrorBoundary = ({ error }: Route.ErrorBoundaryProps) => {
<code>{stack}</code> <code>{stack}</code>
</pre> </pre>
)} )}
</div> </Card>
) )
} }