sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update branding to use a new vibrant red color scheme

Browse Source 
Apply the new primary red color #da234d across various UI components, including buttons, loaders, logos, and progress bars, to refresh the platform's visual identity.

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/C6hzfGb
This commit is contained in:
sebastjanartic 2025-09-04 14:30:03 +00:00
parent ea3c606092
commit 3714cb7367
15 changed files with 56 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
client/src/components/CookieConsent.tsx
View File

@ -98,7 +98,7 @@ export default function CookieConsent() {
<div className="p-6">
<div className="flex items-start justify-between mb-4">
<div className="flex items-center space-x-2">
<div className="w-6 h-6 bg-[#e91e63] rounded-lg flex items-center justify-center">
<div className="w-6 h-6 bg-[#da234d] rounded-lg flex items-center justify-center">
<div className="w-0 h-0 border-l-[6px] border-l-white border-y-[4px] border-y-transparent ml-0.5"></div>
</div>
<h3 className="text-lg font-semibold text-white" translate="no">Cookie-Einstellungen</h3>
@ -120,7 +120,7 @@ export default function CookieConsent() {
<div className="flex flex-col sm:flex-row gap-3">
<Button
onClick={handleAcceptAll}
className="bg-[#e91e63] hover:bg-[#e91e63] text-white border-none transition-colors"
className="bg-[#da234d] hover:bg-[#da234d] text-white border-none transition-colors"
>
<span translate="no">Alle akzeptieren</span>
</Button>
@ -213,7 +213,7 @@ export default function CookieConsent() {
<div className="flex flex-col sm:flex-row gap-3">
<Button
onClick={handleSavePreferences}
className="bg-[#e91e63] hover:bg-[#e91e63] text-white border-none transition-colors"
className="bg-[#da234d] hover:bg-[#da234d] text-white border-none transition-colors"
>
Einstellungen speichern
</Button>

2
client/src/components/loading-spinner.tsx
View File

@ -19,7 +19,7 @@ export function LoadingSpinner({ size = 'md', text = 'Amazing Content', classNam
return (
<div className={`flex flex-col items-center justify-center ${className}`}>
<div className={`${sizeClasses[size]} bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-3`}>
<div className={`${sizeClasses[size]} bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-3`}>
<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 ${textSizeClasses[size]} font-medium`}>{text}</div>

6
client/src/components/netflix-grid.tsx
View File

@ -146,7 +146,7 @@ export default function NetflixGrid({ videos, isLoading }: NetflixGridProps) {
return (
<div className="flex items-center justify-center py-20">
<div className="text-center">
<div className="w-16 h-16 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<div className="w-16 h-16 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<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>
@ -159,7 +159,7 @@ export default function NetflixGrid({ videos, isLoading }: NetflixGridProps) {
if (videos.length === 0) {
return (
<div className="text-center py-12">
<div className="w-12 h-12 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg mb-4 mx-auto opacity-50">
<div className="w-12 h-12 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg mb-4 mx-auto opacity-50">
<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">
@ -472,7 +472,7 @@ function CategoryRow({ category, onVideoClick, hideScrollButtons = false }: Cate
}}
className={`rounded-full transition-colors duration-300 ease-in-out ${
index === currentIndex
? 'bg-gradient-to-r from-[#e91e63] to-[#e91e63]'
? 'bg-gradient-to-r from-[#da234d] to-[#da234d]'
: 'bg-white/25 hover:bg-white/40'
}`}
style={{

2
client/src/components/search-header.tsx
View File

@ -57,7 +57,7 @@ export default function SearchHeader({
<div className="flex items-center justify-between py-4">
<div className="flex items-center space-x-4">
<Link href="/" className="flex items-center space-x-2 hover:opacity-80 transition-opacity">
<div className="w-9 h-9 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-9 h-9 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[10px] border-l-white border-y-[7px] border-y-transparent ml-1"></div>
</div>
<h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>

2
client/src/components/thumbnail-generator.tsx
View File

@ -272,7 +272,7 @@ export default function ThumbnailGenerator({
{!isVideoLoaded && (
<div className="absolute inset-0 flex items-center justify-center bg-gray-800">
<div className="text-center">
<div className="w-12 h-12 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-3 mx-auto">
<div className="w-12 h-12 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-3 mx-auto">
<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-white text-sm">video.folx.tv</div>

2
client/src/components/video-ads.tsx
View File

@ -28,7 +28,7 @@ export default function VideoAds({ videoId }: VideoAdsProps) {
return (
<Card className="p-6 border-gray-700 bg-gray-800">
<div className="text-center">
<div className="w-10 h-10 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-3 mx-auto">
<div className="w-10 h-10 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-3 mx-auto">
<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>

4
client/src/components/video-card.tsx
View File

@ -309,13 +309,13 @@ export default function VideoCard({ video, onClick, className = "", hideOverlay
{duration > 0 && (
<div className="absolute bottom-1 left-2 right-2 h-2 bg-black/40 rounded-full overflow-hidden backdrop-blur-sm border border-white/20">
<div
className="h-full bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-200 ease-out shadow-lg relative"
className="h-full bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-200 ease-out shadow-lg relative"
style={{ width: `${(currentTime / duration) * 100}%` }}
>
{/* Glow effect */}
<div className="absolute inset-0 bg-gradient-to-r from-[#f57496] to-[#f06292] opacity-60 blur-sm"></div>
{/* Progress dot at the end */}
<div className="absolute right-0 top-1/2 transform translate-x-1/2 -translate-y-1/2 w-3 h-3 bg-white rounded-full shadow-lg border-2 border-[#e91e63]"></div>
<div className="absolute right-0 top-1/2 transform translate-x-1/2 -translate-y-1/2 w-3 h-3 bg-white rounded-full shadow-lg border-2 border-[#da234d]"></div>
</div>
</div>
)}

6
client/src/components/video-grid.tsx
View File

@ -36,7 +36,7 @@ export default function VideoGrid({ videos, isLoading, hasMore, onLoadMore, view
return (
<div className="flex items-center justify-center py-20" data-testid="grid-loading">
<div className="text-center">
<div className="w-16 h-16 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<div className="w-16 h-16 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<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>
@ -49,7 +49,7 @@ export default function VideoGrid({ videos, isLoading, hasMore, onLoadMore, view
if (videos.length === 0) {
return (
<div className="text-center py-12">
<div className="w-12 h-12 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg mb-4 mx-auto opacity-50">
<div className="w-12 h-12 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg mb-4 mx-auto opacity-50">
<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">
@ -88,7 +88,7 @@ export default function VideoGrid({ videos, isLoading, hasMore, onLoadMore, view
>
{isLoading ? (
<>
<div className="w-4 h-4 bg-[#e91e63] rounded flex items-center justify-center animate-pulse">
<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>

2
client/src/components/video-modal.tsx
View File

@ -505,7 +505,7 @@ export default function VideoModal({ video, isOpen, onClose, enableAds = true }:
data-testid="progress-bar"
>
<div
className="h-full bg-gradient-to-r from-[#e91e63] to-[#e91e63] rounded-full transition-all duration-200"
className="h-full bg-gradient-to-r from-[#da234d] to-[#da234d] rounded-full transition-all duration-200"
style={{ width: `${duration > 0 ? (currentTime / duration) * 100 : 0}%` }}
/>

16
client/src/pages/FolxStadlPage.tsx
View File

@ -80,7 +80,7 @@ export default function FolxStadlPage() {
return (
<div className="min-h-screen bg-bunny-dark flex items-center justify-center">
<div className="text-center">
<div className="w-16 h-16 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<div className="w-16 h-16 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<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>
@ -99,7 +99,7 @@ export default function FolxStadlPage() {
{/* Left side - Logo */}
<div className="flex items-center space-x-6 flex-1">
<Link href="/" className="flex items-center space-x-3 hover:opacity-80 transition-opacity py-4">
<div className="w-10 h-10 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-10 h-10 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[11px] border-l-white border-y-[8px] border-y-transparent ml-1"></div>
</div>
<h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>
@ -113,19 +113,19 @@ export default function FolxStadlPage() {
<nav className="flex space-x-6">
<Link href="/" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
Startseite
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/folx-stadl" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
FOLX STADL
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/geschichte-lied" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
DIE GESCHICHTE DES LIEDES
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/gipfelstammtisch" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
GIPFELSTAMMTISCH
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
</nav>
@ -285,7 +285,7 @@ export default function FolxStadlPage() {
size="sm"
onClick={() => setCurrentPage(pageNum)}
className={currentPage === pageNum
? "bg-[#e91e63] text-white border-none shadow-lg h-10 w-10 p-0 flex items-center justify-center"
? "bg-[#da234d] text-white border-none shadow-lg h-10 w-10 p-0 flex items-center justify-center"
: "border-white/20 text-white hover:bg-white/10 h-10 w-10 p-0 flex items-center justify-center"
}
>
@ -304,7 +304,7 @@ export default function FolxStadlPage() {
<div className="flex flex-col items-center justify-center space-y-4">
{/* Logo */}
<div className="flex items-center space-x-2">
<div className="w-8 h-8 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-8 h-8 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-1 drop-shadow-sm"></div>
</div>
<h3 className="text-xl font-bold text-white">video.folx.tv</h3>

16
client/src/pages/GeschichteLiedPage.tsx
View File

@ -82,7 +82,7 @@ export default function GeschichteLiedPage() {
return (
<div className="min-h-screen bg-bunny-dark flex items-center justify-center">
<div className="text-center">
<div className="w-16 h-16 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<div className="w-16 h-16 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<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>
@ -101,7 +101,7 @@ export default function GeschichteLiedPage() {
{/* Left side - Logo */}
<div className="flex items-center space-x-6 flex-1">
<Link href="/" className="flex items-center space-x-3 hover:opacity-80 transition-opacity py-4">
<div className="w-10 h-10 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-10 h-10 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[11px] border-l-white border-y-[8px] border-y-transparent ml-1"></div>
</div>
<h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>
@ -115,19 +115,19 @@ export default function GeschichteLiedPage() {
<nav className="flex space-x-6">
<Link href="/" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
Startseite
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/folx-stadl" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
FOLX STADL
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/geschichte-lied" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
DIE GESCHICHTE DES LIEDES
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/gipfelstammtisch" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
GIPFELSTAMMTISCH
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
</nav>
@ -287,7 +287,7 @@ export default function GeschichteLiedPage() {
size="sm"
onClick={() => setCurrentPage(pageNum)}
className={currentPage === pageNum
? "bg-[#e91e63] text-white border-none shadow-lg h-10 w-10 p-0 flex items-center justify-center"
? "bg-[#da234d] text-white border-none shadow-lg h-10 w-10 p-0 flex items-center justify-center"
: "border-white/20 text-white hover:bg-white/10 h-10 w-10 p-0 flex items-center justify-center"
}
>
@ -305,7 +305,7 @@ export default function GeschichteLiedPage() {
<div className="flex flex-col items-center justify-center space-y-4">
{/* Logo */}
<div className="flex items-center space-x-2">
<div className="w-8 h-8 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-8 h-8 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-1 drop-shadow-sm"></div>
</div>
<h3 className="text-xl font-bold text-white">video.folx.tv</h3>

16
client/src/pages/GipfelstammtischPage.tsx
View File

@ -82,7 +82,7 @@ export default function GipfelstammtischPage() {
return (
<div className="min-h-screen bg-bunny-dark flex items-center justify-center">
<div className="text-center">
<div className="w-16 h-16 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<div className="w-16 h-16 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<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>
@ -101,7 +101,7 @@ export default function GipfelstammtischPage() {
{/* Left side - Logo */}
<div className="flex items-center space-x-6 flex-1">
<Link href="/" className="flex items-center space-x-3 hover:opacity-80 transition-opacity py-4">
<div className="w-10 h-10 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-10 h-10 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[11px] border-l-white border-y-[8px] border-y-transparent ml-1"></div>
</div>
<h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>
@ -115,19 +115,19 @@ export default function GipfelstammtischPage() {
<nav className="flex space-x-6">
<Link href="/" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
Startseite
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/folx-stadl" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
FOLX STADL
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/geschichte-lied" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
DIE GESCHICHTE DES LIEDES
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/gipfelstammtisch" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
GIPFELSTAMMTISCH
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
</nav>
@ -287,7 +287,7 @@ export default function GipfelstammtischPage() {
size="sm"
onClick={() => setCurrentPage(pageNum)}
className={currentPage === pageNum
? "bg-[#e91e63] text-white border-none shadow-lg h-10 w-10 p-0 flex items-center justify-center"
? "bg-[#da234d] text-white border-none shadow-lg h-10 w-10 p-0 flex items-center justify-center"
: "border-white/20 text-white hover:bg-white/10 h-10 w-10 p-0 flex items-center justify-center"
}
>
@ -305,7 +305,7 @@ export default function GipfelstammtischPage() {
<div className="flex flex-col items-center justify-center space-y-4">
{/* Logo */}
<div className="flex items-center space-x-2">
<div className="w-8 h-8 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-8 h-8 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-1 drop-shadow-sm"></div>
</div>
<h3 className="text-xl font-bold text-white">video.folx.tv</h3>

16
client/src/pages/VideoPage.tsx
View File

@ -306,7 +306,7 @@ export default function VideoPage() {
return (
<div className="min-h-screen bg-bunny-dark flex items-center justify-center">
<div className="text-center">
<div className="w-16 h-16 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<div className="w-16 h-16 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
<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>
@ -320,7 +320,7 @@ export default function VideoPage() {
return (
<div className="min-h-screen bg-bunny-dark flex items-center justify-center">
<div className="text-center">
<div className="w-12 h-12 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg mb-4 mx-auto opacity-50">
<div className="w-12 h-12 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg mb-4 mx-auto opacity-50">
<div className="w-0 h-0 border-l-[9px] border-l-white border-y-[7px] border-y-transparent ml-1"></div>
</div>
<h3 className="text-white text-lg font-bold mb-2">video.folx.tv</h3>
@ -339,7 +339,7 @@ export default function VideoPage() {
{/* Left side - Logo */}
<div className="flex items-center space-x-6 flex-1">
<Link href="/" className="flex items-center space-x-3 hover:opacity-80 transition-opacity py-4">
<div className="w-10 h-10 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-10 h-10 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[11px] border-l-white border-y-[8px] border-y-transparent ml-1"></div>
</div>
<h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>
@ -353,19 +353,19 @@ export default function VideoPage() {
<nav className="flex space-x-6">
<Link href="/" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
Startseite
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/folx-stadl" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
FOLX STADL
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/geschichte-lied" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
DIE GESCHICHTE DES LIEDES
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
<Link href="/gipfelstammtisch" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
GIPFELSTAMMTISCH
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</Link>
</nav>
@ -804,7 +804,7 @@ export default function VideoPage() {
<div className="flex flex-col items-center justify-center space-y-4">
{/* Logo */}
<div className="flex items-center space-x-2">
<div className="w-8 h-8 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-md">
<div className="w-8 h-8 bg-[#da234d] rounded-lg flex items-center justify-center shadow-md">
<div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-0.5"></div>
</div>
<span className="text-lg font-semibold text-white">video.folx.tv</span>

2
client/src/pages/home.tsx
View File

@ -75,7 +75,7 @@ export default function Home() {
{/* Left side - Logo */}
<div className="flex items-center space-x-6 flex-1">
<Link href="/" className="flex items-center space-x-3 hover:opacity-80 transition-opacity py-4">
<div className="w-10 h-10 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-10 h-10 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[11px] border-l-white border-y-[8px] border-y-transparent ml-1"></div>
</div>
<h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>

14
client/src/pages/not-found.tsx
View File

@ -20,7 +20,7 @@ export default function NotFound() {
<div className="flex items-center justify-between h-20">
<div className="flex items-center space-x-4">
<a href="/" className="flex items-center space-x-2 hover:opacity-80 transition-opacity">
<div className="w-9 h-9 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-9 h-9 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
<div className="w-0 h-0 border-l-[10px] border-l-white border-y-[7px] border-y-transparent ml-1"></div>
</div>
<h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>
@ -31,19 +31,19 @@ export default function NotFound() {
<nav className="flex space-x-6">
<a href="/" className="relative text-bunny-light hover:text-bunny-blue transition-colors group" data-testid="link-home">
Home
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</a>
<a href="/folx-stadl" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
FOLX STADL
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</a>
<a href="/geschichte-lied" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
DIE GESCHICHTE DES LIEDES
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</a>
<a href="/gipfelstammtisch" className="relative text-bunny-light hover:text-bunny-blue transition-colors group">
GIPFELSTAMMTISCH
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#e91e63] to-[#e91e63] transition-all duration-300 group-hover:w-full"></span>
<span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-[#da234d] to-[#da234d] transition-all duration-300 group-hover:w-full"></span>
</a>
</nav>
</div>
@ -129,7 +129,7 @@ export default function NotFound() {
</p>
<Button
onClick={() => window.location.href = '/'}
className="bg-[#e91e63] hover:bg-[#e91e63] transition-colors text-white"
className="bg-[#da234d] hover:bg-[#da234d] transition-colors text-white"
>
Back to Home
</Button>
@ -147,7 +147,7 @@ export default function NotFound() {
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8 relative z-10">
<div className="flex flex-col md:flex-row items-center justify-between">
<div className="flex items-center space-x-2 mb-4 md:mb-0">
<div className="w-8 h-8 bg-[#e91e63] rounded-lg flex items-center justify-center shadow-md">
<div className="w-8 h-8 bg-[#da234d] rounded-lg flex items-center justify-center shadow-md">
<div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-0.5"></div>
</div>
<span className="text-lg font-semibold text-white">video.folx.tv</span>