Implement dark theme and theme switching

This commit is contained in:
2025-08-11 17:39:56 +02:00
parent e702bcb694
commit f15c0840c4
4 changed files with 106 additions and 33 deletions

View File

@@ -18,8 +18,8 @@ function InstanceList({ editInstance }: InstanceListProps) {
return (
<div className="flex items-center justify-center py-12" aria-label="Loading">
<div className="text-center">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto mb-4"></div>
<p className="text-gray-600">Loading instances...</p>
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-primary mx-auto mb-4"></div>
<p className="text-muted-foreground">Loading instances...</p>
</div>
</div>
)
@@ -28,7 +28,7 @@ function InstanceList({ editInstance }: InstanceListProps) {
if (error) {
return (
<div className="text-center py-12">
<div className="text-red-600 mb-4">
<div className="text-destructive mb-4">
<p className="text-lg font-semibold">Error loading instances</p>
<p className="text-sm">{error}</p>
</div>
@@ -39,15 +39,15 @@ function InstanceList({ editInstance }: InstanceListProps) {
if (instances.length === 0) {
return (
<div className="text-center py-12">
<p className="text-gray-600 text-lg mb-2">No instances found</p>
<p className="text-gray-500 text-sm">Create your first instance to get started</p>
<p className="text-foreground text-lg mb-2">No instances found</p>
<p className="text-muted-foreground text-sm">Create your first instance to get started</p>
</div>
)
}
return (
<div className="space-y-4">
<h2 className="text-xl font-semibold text-gray-900 mb-6">
<h2 className="text-xl font-semibold text-foreground mb-6">
Instances ({instances.length})
</h2>