Update text colors and translations for improved user experience

This commit addresses several UI and text-related changes across multiple components and pages. Key updates include:
- Modifying link hover colors from a specific red (#da234d) to white for better contrast and consistency.
- Adjusting text colors in various elements, such as buttons and labels, to white for improved readability.
- Translating loading messages and "no results found" messages into German for enhanced localization.
- Minor adjustments to the loading spinner text.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 946a0075-7e32-454b-b348-9e7f576d7f45
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/60d372ff-2c10-46c7-b01b-10c3435136b0/946a0075-7e32-454b-b348-9e7f576d7f45/B14VAa5
This commit is contained in:
sebastjanartic
2025-09-04 14:35:39 +00:00
parent 395dba2daa
commit bfea83b609
19 changed files with 86 additions and 86 deletions
+2 -2
View File
@@ -134,7 +134,7 @@ export default function CookieConsent() {
<Button
onClick={() => setShowDetails(true)}
variant="ghost"
className="text-[#da234d] hover:text-purple-400 hover:bg-transparent"
className="text-white hover:text-purple-400 hover:bg-transparent"
>
<span translate="no">Einstellungen verwalten</span>
</Button>
@@ -158,7 +158,7 @@ export default function CookieConsent() {
<div className="bg-bunny-gray/20 p-4 rounded-lg">
<div className="flex items-center justify-between mb-2">
<h4 className="text-white font-medium">Notwendige Cookies</h4>
<div className="bg-[#da234d]/20 text-[#da234d] px-2 py-1 rounded text-xs">
<div className="bg-[#da234d]/20 text-white px-2 py-1 rounded text-xs">
Immer aktiv
</div>
</div>
+2 -2
View File
@@ -121,7 +121,7 @@ export default function AdSettings({ isOpen, onClose }: AdSettingsProps) {
<div className="sticky top-0 bg-white dark:bg-gray-900 p-6 border-b border-gray-200 dark:border-gray-700">
<div className="flex items-center justify-between">
<div className="flex items-center space-x-3">
<DollarSign className="w-6 h-6 text-[#da234d]" />
<DollarSign className="w-6 h-6 text-white" />
<h2 className="text-2xl font-bold text-gray-900 dark:text-white">
Ad Settings
</h2>
@@ -158,7 +158,7 @@ export default function AdSettings({ isOpen, onClose }: AdSettingsProps) {
</CardTitle>
</CardHeader>
<CardContent>
<div className="text-2xl font-bold text-[#da234d]">
<div className="text-2xl font-bold text-white">
{totalImpressions.toLocaleString()}
</div>
<div className="text-xs text-gray-500">
+1 -1
View File
@@ -4,7 +4,7 @@ interface LoadingSpinnerProps {
className?: string;
}
export function LoadingSpinner({ size = 'md', text = 'Amazing Content', className = '' }: LoadingSpinnerProps) {
export function LoadingSpinner({ size = 'md', text = 'Fantastischer Inhalt', className = '' }: LoadingSpinnerProps) {
const sizeClasses = {
sm: 'w-6 h-6',
md: 'w-10 h-10',
+2 -2
View File
@@ -150,7 +150,7 @@ export default function NetflixGrid({ videos, isLoading }: NetflixGridProps) {
<div className="w-0 h-0 border-l-[12px] border-l-white border-y-[9px] border-y-transparent ml-1"></div>
</div>
<h3 className="text-white text-xl font-bold mb-2">video.folx.tv</h3>
<p className="text-bunny-light">Loading videos...</p>
<p className="text-bunny-light">Videos werden geladen...</p>
</div>
</div>
);
@@ -163,7 +163,7 @@ export default function NetflixGrid({ videos, isLoading }: NetflixGridProps) {
<div className="w-0 h-0 border-l-[9px] border-l-white border-y-[7px] border-y-transparent ml-1"></div>
</div>
<div className="text-bunny-muted text-lg mb-4">
No videos found
Keine Videos gefunden
</div>
<p className="text-sm text-bunny-muted">
Try adjusting your search or filter criteria
+4 -4
View File
@@ -66,10 +66,10 @@ export default function SearchHeader({
<div className="hidden md:flex items-center space-x-6">
<nav className="flex space-x-6">
<Link href="/" className="text-bunny-light hover:text-[#da234d] transition-colors" data-testid="link-home">
<Link href="/" className="text-bunny-light hover:text-white transition-colors" data-testid="link-home">
Home
</Link>
<Link href="/folx-stadl" className="text-bunny-light hover:text-[#da234d] transition-colors" data-testid="link-folx-stadl">
<Link href="/folx-stadl" className="text-bunny-light hover:text-white transition-colors" data-testid="link-folx-stadl">
FOLX STADL
</Link>
</nav>
@@ -106,7 +106,7 @@ export default function SearchHeader({
<nav className="flex flex-col space-y-3">
<Link
href="/"
className="text-bunny-light hover:text-[#da234d] transition-colors text-lg py-2 px-3 rounded-lg hover:bg-white/5"
className="text-bunny-light hover:text-white transition-colors text-lg py-2 px-3 rounded-lg hover:bg-white/5"
data-testid="link-mobile-home"
onClick={() => setIsMobileMenuOpen(false)}
>
@@ -114,7 +114,7 @@ export default function SearchHeader({
</Link>
<Link
href="/folx-stadl"
className="text-bunny-light hover:text-[#da234d] transition-colors text-lg py-2 px-3 rounded-lg hover:bg-white/5"
className="text-bunny-light hover:text-white transition-colors text-lg py-2 px-3 rounded-lg hover:bg-white/5"
data-testid="link-mobile-folx-stadl"
onClick={() => setIsMobileMenuOpen(false)}
>
+2 -2
View File
@@ -32,7 +32,7 @@ export default function VideoAds({ videoId }: VideoAdsProps) {
<div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-1"></div>
</div>
<div className="text-white text-sm font-medium mb-1">video.folx.tv</div>
<div className="text-gray-400 text-xs">Loading ads...</div>
<div className="text-gray-400 text-xs">Werbung wird geladen...</div>
</div>
</Card>
);
@@ -53,7 +53,7 @@ export default function VideoAds({ videoId }: VideoAdsProps) {
<Card className="p-4 border-gray-200 bg-gray-50">
<p className="text-gray-600 text-sm flex items-center gap-2">
<PlayCircle className="w-4 h-4" />
No ad spots configured for this video
Keine Werbeplätze für dieses Video konfiguriert
</p>
</Card>
);
+3 -3
View File
@@ -40,7 +40,7 @@ export default function VideoGrid({ videos, isLoading, hasMore, onLoadMore, view
<div className="w-0 h-0 border-l-[12px] border-l-white border-y-[9px] border-y-transparent ml-1"></div>
</div>
<h3 className="text-white text-xl font-bold mb-2">video.folx.tv</h3>
<p className="text-bunny-light">Loading videos...</p>
<p className="text-bunny-light">Videos werden geladen...</p>
</div>
</div>
);
@@ -53,7 +53,7 @@ export default function VideoGrid({ videos, isLoading, hasMore, onLoadMore, view
<div className="w-0 h-0 border-l-[9px] border-l-white border-y-[7px] border-y-transparent ml-1"></div>
</div>
<div className="text-bunny-muted text-lg mb-4" data-testid="text-no-videos">
No videos found
Keine Videos gefunden
</div>
<p className="text-sm text-bunny-muted">
Try adjusting your search or filter criteria
@@ -91,7 +91,7 @@ export default function VideoGrid({ videos, isLoading, hasMore, onLoadMore, view
<div className="w-4 h-4 bg-[#da234d] rounded flex items-center justify-center animate-pulse">
<div className="w-0 h-0 border-l-[3px] border-l-white border-y-[2px] border-y-transparent"></div>
</div>
<span>Loading more...</span>
<span>Mehr laden...</span>
</>
) : (
<>
+5 -5
View File
@@ -449,7 +449,7 @@ export default function VideoModal({ video, isOpen, onClose, enableAds = true }:
variant="ghost"
size="icon"
onClick={onClose}
className="absolute -top-12 right-0 text-white hover:text-[#da234d] transition-colors z-60"
className="absolute -top-12 right-0 text-white hover:text-white transition-colors z-60"
data-testid="button-close-modal"
>
<X className="text-2xl" />
@@ -527,7 +527,7 @@ export default function VideoModal({ video, isOpen, onClose, enableAds = true }:
onClick={togglePlay}
variant="ghost"
size="icon"
className="text-white hover:text-[#da234d] transition-colors"
className="text-white hover:text-white transition-colors"
data-testid="button-play-pause"
>
{isPlaying ? <Pause className="w-5 h-5" /> : <Play className="w-5 h-5" />}
@@ -539,7 +539,7 @@ export default function VideoModal({ video, isOpen, onClose, enableAds = true }:
onClick={toggleMute}
variant="ghost"
size="icon"
className="text-white hover:text-[#da234d] transition-colors"
className="text-white hover:text-white transition-colors"
data-testid="button-volume"
>
{isMuted ? <VolumeX className="w-5 h-5" /> : <Volume2 className="w-5 h-5" />}
@@ -567,7 +567,7 @@ export default function VideoModal({ video, isOpen, onClose, enableAds = true }:
onClick={() => setShowShareMenu(!showShareMenu)}
variant="ghost"
size="icon"
className="text-white hover:text-[#da234d] transition-colors"
className="text-white hover:text-white transition-colors"
data-testid="button-share"
>
<Share2 className="w-5 h-5" />
@@ -633,7 +633,7 @@ export default function VideoModal({ video, isOpen, onClose, enableAds = true }:
onClick={toggleFullscreen}
variant="ghost"
size="icon"
className="text-white hover:text-[#da234d] transition-colors ml-auto"
className="text-white hover:text-white transition-colors ml-auto"
data-testid="button-fullscreen"
>
<Maximize className="w-5 h-5" />