33 lines
1.5 KiB
TypeScript
33 lines
1.5 KiB
TypeScript
import Image from "next/image";
|
|
import { websites } from "../data/urls";
|
|
import Header from "@/components/header";
|
|
import Footer from "@/components/footer";
|
|
|
|
export default function Home() {
|
|
return (
|
|
<div className="min-h-screen flex flex-col bg-gray-100">
|
|
<Header />
|
|
<main className="container mx-auto p-4 flex-grow">
|
|
<section className="text-center mb-12">
|
|
<h2 className="text-4xl font-extrabold text-gray-900">智能计算实验室简介</h2>
|
|
<p className="text-xl text-gray-600 mt-4">这里是实验室的基本信息简介，阿巴阿巴阿巴。</p>
|
|
</section>
|
|
<section className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-8">
|
|
{websites.map((website, index) => (
|
|
<a key={index} href={website.link} rel="noopener noreferrer" target="_blank">
|
|
<div className="list-item bg-gray-50 p-3 shadow hover:shadow-lg transition-shadow duration-300">
|
|
<Image src={website.icon} alt={website.title} width={80} height={80} className="list-icon rounded-lg overflow-hidden flex-shrink-0" />
|
|
<div className="list-info flex-shrink pl-3 pt-2 my-1 truncate">
|
|
<h3 className="list-name text-xl font-bold my-1 truncate">{website.title}</h3>
|
|
<div className="text-sm text-gray-500 truncate">{website.description}</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
))}
|
|
</section>
|
|
</main>
|
|
<Footer />
|
|
</div>
|
|
);
|
|
}
|