fix: use theme colours

This commit is contained in:
Leon
2025-07-19 10:24:02 +02:00
parent 6f7503039d
commit d267c7271b
5 changed files with 11 additions and 11 deletions

View File

@@ -31,7 +31,7 @@ export default function LoginPage() {
}
return (
<div className="min-h-screen bg-gray-50 flex items-center justify-center">
<div className="min-h-screen bg-background flex items-center justify-center">
<div className="max-w-md w-full space-y-8 p-8">
<div className="text-center">
<div className="flex justify-center mb-4">
@@ -43,8 +43,8 @@ export default function LoginPage() {
className="rounded-lg"
/>
</div>
<h2 className="text-3xl font-bold text-gray-900">LetterFeed</h2>
<p className="mt-2 text-gray-600">Sign in to your account</p>
<h2 className="text-3xl font-bold text-foreground">LetterFeed</h2>
<p className="mt-2 text-muted-foreground">Sign in to your account</p>
</div>
<Card>

View File

@@ -61,7 +61,7 @@ function LetterFeedApp() {
}
return (
<div className="min-h-screen bg-gray-50">
<div className="min-h-screen bg-background">
<div className="container mx-auto px-4 sm:px-6 lg:px-8 py-8">
<Header
onOpenAddNewsletter={() => setIsAddDialogOpen(true)}

View File

@@ -8,9 +8,9 @@ interface EmptyStateProps {
export function EmptyState({ onAddNewsletter }: EmptyStateProps) {
return (
<div className="text-center py-12">
<Rss className="w-12 h-12 text-gray-400 mx-auto mb-4" />
<h3 className="text-lg font-medium text-gray-900 mb-2">No newsletters registered</h3>
<p className="text-gray-600 mb-4">Get started by adding your first newsletter</p>
<Rss className="w-12 h-12 text-muted-foreground mx-auto mb-4" />
<h3 className="text-lg font-medium text-foreground mb-2">No newsletters registered</h3>
<p className="text-muted-foreground mb-4">Get started by adding your first newsletter</p>
<Button onClick={onAddNewsletter}>
<Plus className="w-4 h-4 mr-2" />
Add Your First Newsletter

View File

@@ -39,8 +39,8 @@ export function Header({ onOpenAddNewsletter, onOpenSettings }: HeaderProps) {
className="rounded-lg"
/>
<div>
<h1 className="text-2xl md:text-3xl font-bold text-gray-900">LetterFeed</h1>
<p className="text-gray-600 mt-1 hidden md:block">
<h1 className="text-2xl md:text-3xl font-bold text-foreground">LetterFeed</h1>
<p className="text-muted-foreground mt-1 hidden md:block">
Newsletters as RSS feeds
</p>
</div>

View File

@@ -2,8 +2,8 @@ import { Loader2 } from "lucide-react"
export function LoadingSpinner() {
return (
<div className="min-h-screen bg-gray-50 flex items-center justify-center">
<Loader2 className="w-12 h-12 text-gray-400 animate-spin" data-testid="loading-spinner" />
<div className="min-h-screen bg-background flex items-center justify-center">
<Loader2 className="w-12 h-12 text-muted-foreground animate-spin" data-testid="loading-spinner" />
</div>
)
}