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
parent
3485e7cae2
commit
a62f04b5ca
8
.replit
8
.replit
@ -24,12 +24,12 @@ localPort = 34033
|
||||
externalPort = 3001
|
||||
|
||||
[[ports]]
|
||||
localPort = 35637
|
||||
externalPort = 3000
|
||||
localPort = 35473
|
||||
externalPort = 3003
|
||||
|
||||
[[ports]]
|
||||
localPort = 39735
|
||||
externalPort = 4200
|
||||
localPort = 35637
|
||||
externalPort = 3000
|
||||
|
||||
[env]
|
||||
PORT = "5000"
|
||||
|
||||
@ -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">
|
||||
|
||||
@ -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 GeschichteLiedPage() {
|
||||
const [selectedVideo, setSelectedVideo] = useState<Video | null>(null);
|
||||
@ -249,37 +250,43 @@ export default function GeschichteLiedPage() {
|
||||
{/* 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>
|
||||
))}
|
||||
|
||||
@ -324,6 +331,9 @@ export default function GeschichteLiedPage() {
|
||||
)}
|
||||
</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">
|
||||
|
||||
@ -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 GipfelstammtischPage() {
|
||||
const [selectedVideo, setSelectedVideo] = useState<Video | null>(null);
|
||||
@ -249,37 +250,43 @@ export default function GipfelstammtischPage() {
|
||||
{/* 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>
|
||||
))}
|
||||
|
||||
@ -324,6 +331,9 @@ export default function GipfelstammtischPage() {
|
||||
)}
|
||||
</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">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user