Kling 2.5 Turbo (pro)
import React, { useState, useEffect } from 'react'; const NewsBroadcast = () => { const [segment, setSegment] = useState(0); useEffect(() => { const timer = setTimeout(() => { setSegment(prev => (prev === 0 ? 1 : 0)); }, 5000); // Изменение сегмента каждые 5 секунд return () => clearTimeout(timer); }, [segment]); return ( <div className="flex items-center justify-center min-h-screen bg-gray-200"> <div className="relative w-full max-w-3xl mx-auto bg-white shadow-lg rounded-lg"> {/* Фоновое изображение, представляющее новостное отделение */} <div className="h-60 bg-cover bg-center rounded-t-lg" style={{ backgroundImage: "url('https://placehold.co/800x400')" }}> <div className="absolute inset-0 bg-black opacity-30 rounded-t-lg"></div> </div> {/* Экран телевизора */} <div className="p-6"> <div className="bg-black rounded-lg p-4"> <h2 className="text-white text-lg font-semibold"> {segment === 0 ? 'Срочные Новости' : 'Обновление Полиции'} </h2> <p className="text-white mt-2 text-xl"> {segment === 0 ? 'Человек в синей майке и с коричневыми волосами скончался.' : 'Полиция ищет подозреваемого в загадочной смерти.'} </p> </div> </div> </div> </div> ); }; export default NewsBroadcast;