42 lines
1.8 KiB
TypeScript
42 lines
1.8 KiB
TypeScript
import Image from "next/image";
|
||
import Link from "next/link";
|
||
import musicSvg from "@/app/music.svg";
|
||
|
||
export default function Home() {
|
||
return (
|
||
<section className="text-gray-600 body-font">
|
||
<div className="container mx-auto flex px-5 py-24 md:flex-row flex-col items-center">
|
||
<div className="lg:flex-grow md:w-1/2 lg:pr-24 md:pr-16 flex flex-col md:items-start md:text-left mb-16 md:mb-0 items-center text-center">
|
||
<h1 className="title-font sm:text-4xl text-3xl mb-4 font-medium text-gray-900">
|
||
搜索直播间
|
||
<br className="hidden lg:inline-block" />
|
||
同步发送歌曲歌词
|
||
</h1>
|
||
|
||
<p className="mb-8 leading-relaxed">
|
||
只需在搜索框中输入你感兴趣的歌曲名称或歌手，即可找到相关的歌词。然后，选择你喜欢的歌词段落，将其发送为弹幕，即可在视频播放时实现动态同步。这种互动方式不仅有助于分享感受，还能让观众更深入地了解你所喜爱的音乐。
|
||
</p>
|
||
<div className="flex justify-center">
|
||
<Link
|
||
href="/music"
|
||
className="inline-flex text-white bg-indigo-500 border-0 py-2 px-6 focus:outline-none hover:bg-indigo-600 rounded text-lg"
|
||
>
|
||
弹幕测试
|
||
</Link>
|
||
<button className="ml-4 inline-flex text-gray-700 bg-gray-100 border-0 py-2 px-6 focus:outline-none hover:bg-gray-200 rounded text-lg">
|
||
歌词曲库
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<div className="lg:max-w-lg lg:w-full md:w-1/2 w-5/6">
|
||
<Image
|
||
className="object-cover object-center rounded"
|
||
alt="hero"
|
||
src={musicSvg}
|
||
/>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
);
|
||
}
|