Add inline ads to all broadcast pages for consistent advertising

Integrate InlineAd component into FolxStadlPage, GeschichteLiedPage, and GipfelstammtischPage, replacing existing ad display logic and ensuring consistent ad placement across these pages.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 401e2ec0-e00d-4f10-9d0e-60f3d479f9a5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/60d372ff-2c10-46c7-b01b-10c3435136b0/401e2ec0-e00d-4f10-9d0e-60f3d479f9a5/qbWMa3T
This commit is contained in:
sebastjanartic
2025-09-28 20:10:00 +00:00
parent 3485e7cae2
commit a62f04b5ca
4 changed files with 118 additions and 88 deletions
+38 -28
View File
@@ -10,6 +10,7 @@ import { Input } from '@/components/ui/input';
import { Search } from 'lucide-react';
import AdSenseAd from '@/components/adsense-ad';
import HeaderAd from '@/components/HeaderAd';
import InlineAd from '@/components/InlineAd';
export default function FolxStadlPage() {
const [selectedVideo, setSelectedVideo] = useState<Video | null>(null);
@@ -247,37 +248,43 @@ export default function FolxStadlPage() {
{/* Video List with Descriptions */}
<div className="space-y-6">
{currentVideos.map((video, index) => (
<div key={video.id} className="bg-black/20 backdrop-blur-sm rounded-lg p-4">
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
{/* Video Card */}
<div className="md:col-span-1">
<VideoCard
video={video}
onClick={handleVideoClick}
className="w-full hover:scale-102 transition-all duration-300 rounded-lg overflow-hidden"
hideOverlay={true}
/>
</div>
{/* Video Description */}
<div className="md:col-span-2 space-y-3">
{/* Artist in UPPERCASE - first line */}
<h3 className="text-xl font-bold text-white uppercase">
{(video.title.split(' - ')[0] || 'video.folx.tv')}
</h3>
{/* Song title - second line */}
<h4 className="text-lg font-medium text-white/90 -mt-1">
{(video.title.split(' - ')[1] || video.title)}
</h4>
<p className="text-bunny-light text-sm leading-relaxed">
{video.description || "Keine Beschreibung für diese Sendung verfügbar."}
</p>
<div className="flex items-center gap-4 text-xs text-bunny-muted">
<span>{Math.floor(video.duration / 60)}:{(video.duration % 60).toString().padStart(2, '0')} min</span>
<span>{video.views} Aufrufe</span>
<div key={video.id}>
<div className="bg-black/20 backdrop-blur-sm rounded-lg p-4">
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
{/* Video Card */}
<div className="md:col-span-1">
<VideoCard
video={video}
onClick={handleVideoClick}
className="w-full hover:scale-102 transition-all duration-300 rounded-lg overflow-hidden"
hideOverlay={true}
/>
</div>
{/* Video Description */}
<div className="md:col-span-2 space-y-3">
{/* Artist in UPPERCASE - first line */}
<h3 className="text-xl font-bold text-white uppercase">
{(video.title.split(' - ')[0] || 'video.folx.tv')}
</h3>
{/* Song title - second line */}
<h4 className="text-lg font-medium text-white/90 -mt-1">
{(video.title.split(' - ')[1] || video.title)}
</h4>
<p className="text-bunny-light text-sm leading-relaxed">
{video.description || "Keine Beschreibung für diese Sendung verfügbar."}
</p>
<div className="flex items-center gap-4 text-xs text-bunny-muted">
<span>{Math.floor(video.duration / 60)}:{(video.duration % 60).toString().padStart(2, '0')} min</span>
<span>{video.views} Aufrufe</span>
</div>
</div>
</div>
</div>
{/* Add inline ad after every second video (index 1, 3, 5...) */}
{index > 0 && (index + 1) % 2 === 0 && (
<InlineAd />
)}
</div>
))}
@@ -323,6 +330,9 @@ export default function FolxStadlPage() {
</div>
{/* Final inline ad before footer */}
<InlineAd />
{/* Footer */}
<footer className="bg-bunny-dark/90 border-t border-white/10 py-8 mt-12">
<div className="container">