47 lines
1.7 KiB
TypeScript
47 lines
1.7 KiB
TypeScript
'use client';
|
||
|
||
interface LiveStreamSectionProps {
|
||
show: boolean;
|
||
onClose: () => void;
|
||
}
|
||
|
||
export default function LiveStreamSection({ show, onClose }: LiveStreamSectionProps) {
|
||
if (!show) return null;
|
||
|
||
return (
|
||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pt-8 md:pt-32 pb-8">
|
||
<div className="bg-white rounded-2xl shadow-2xl p-6 lg:p-8">
|
||
<div className="flex items-center justify-between mb-6">
|
||
<div className="flex items-center space-x-3">
|
||
<div className="w-3 h-3 bg-red-500 rounded-full animate-pulse"></div>
|
||
<h2 className="text-2xl font-bold text-[#004B87]">Canlı Yayın</h2>
|
||
</div>
|
||
<button
|
||
onClick={onClose}
|
||
className="text-gray-500 hover:text-red-500 transition-colors"
|
||
>
|
||
<svg className="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
|
||
{/* YouTube Video Embed */}
|
||
<div className="relative w-full" style={{paddingBottom: '56.25%'}}>
|
||
<iframe
|
||
className="absolute top-0 left-0 w-full h-full rounded-lg"
|
||
src="https://www.youtube.com/embed/b9q88QDEcKg?autoplay=1"
|
||
title="Canlı Yayın"
|
||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||
allowFullScreen
|
||
></iframe>
|
||
</div>
|
||
|
||
<p className="mt-4 text-gray-600 text-sm">
|
||
A2 Metro Hattı İnşaat Çalışmaları - Canlı Yayın
|
||
</p>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|