format everything in zed
This commit is contained in:
@@ -6,25 +6,28 @@ function TopArea() {
|
||||
<div className="bg-[#35786f] text-white w-full min-h-[75dvh] flex justify-center items-center">
|
||||
<div className="mb-16 mx-16 md:mx-0 md:max-w-[60dvw]">
|
||||
<h1 className="text-6xl md:text-9xl mb-8">Learn Languages</h1>
|
||||
<p className="text-2xl md:text-5xl">Here is a very useful website to help you learn almost every language in the world, including constructed ones.</p>
|
||||
<p className="text-2xl md:text-5xl">
|
||||
Here is a very useful website to help you learn almost every language
|
||||
in the world, including constructed ones.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
interface LinkAreaProps {
|
||||
href: string,
|
||||
name: string,
|
||||
description: string,
|
||||
color: string
|
||||
href: string;
|
||||
name: string;
|
||||
description: string;
|
||||
color: string;
|
||||
}
|
||||
function LinkArea(
|
||||
{ href, name, description, color }: LinkAreaProps
|
||||
) {
|
||||
function LinkArea({ href, name, description, color }: LinkAreaProps) {
|
||||
return (
|
||||
<Link href={href}
|
||||
<Link
|
||||
href={href}
|
||||
style={{ backgroundColor: color }}
|
||||
className={`h-32 md:h-64 flex justify-center items-center`}>
|
||||
className={`h-32 md:h-64 flex justify-center items-center`}
|
||||
>
|
||||
<div className="text-white m-8">
|
||||
<h1 className="text-4xl">{name}</h1>
|
||||
<p className="text-xl">{description}</p>
|
||||
@@ -36,17 +39,18 @@ function LinkArea(
|
||||
function LinkGrid() {
|
||||
return (
|
||||
<div className="w-full grid grid-cols-1 grid-rows-6 md:grid-cols-3">
|
||||
|
||||
<LinkArea
|
||||
href="/translator"
|
||||
name="翻译器"
|
||||
description="翻译到任何语言,并标注国际音标(IPA)"
|
||||
color="#a56068"></LinkArea>
|
||||
color="#a56068"
|
||||
></LinkArea>
|
||||
<LinkArea
|
||||
href="/text-speaker"
|
||||
name="朗读器"
|
||||
description="识别并朗读文本,支持循环朗读、朗读速度调节"
|
||||
color="#578aad"></LinkArea>
|
||||
color="#578aad"
|
||||
></LinkArea>
|
||||
{/* <LinkArea
|
||||
href="/word-board"
|
||||
name="词墙"
|
||||
@@ -56,19 +60,22 @@ function LinkGrid() {
|
||||
href="/srt-player"
|
||||
name="逐句视频播放器"
|
||||
description="基于SRT字幕文件,逐句播放视频以模仿母语者的发音"
|
||||
color="#3c988d"></LinkArea>
|
||||
<LinkArea
|
||||
color="#3c988d"
|
||||
></LinkArea>
|
||||
<LinkArea
|
||||
href="/alphabet"
|
||||
name="记忆字母表"
|
||||
description="从字母表开始新语言的学习"
|
||||
color="#dd7486"></LinkArea>
|
||||
color="#dd7486"
|
||||
></LinkArea>
|
||||
<LinkArea
|
||||
href="#"
|
||||
name="更多功能"
|
||||
description="开发中,敬请期待"
|
||||
color="#cab48a"></LinkArea>
|
||||
color="#cab48a"
|
||||
></LinkArea>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
function Fortune() {
|
||||
@@ -97,5 +104,6 @@ export default function Home() {
|
||||
<Fortune></Fortune>
|
||||
<Explore></Explore>
|
||||
<LinkGrid></LinkGrid>
|
||||
</>);
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user