129 lines
4.4 KiB
JavaScript
129 lines
4.4 KiB
JavaScript
"use client";
|
||
|
||
import React, { useState, useEffect } from "react";
|
||
import InOtherApp from "@/components/InOtherApp";
|
||
import Image from "next/image";
|
||
import download_lefttop from "@/public/images/download_lefttop.png";
|
||
import download_righttop from "@/public/images/download_righttop.png";
|
||
import download_rightmedium from "@/public/images/download_rightmedium.png";
|
||
import download_leftbottom from "@/public/images/download_leftbottom.png";
|
||
import download_rightbottom from "@/public/images/download_rightbottom.png";
|
||
import slogan from "@/public/images/slogan.png";
|
||
import qrcode from "@/public/images/qrcode.png";
|
||
import Footer from "@/components/Footer";
|
||
import Link from "next/link";
|
||
|
||
export default function Home() {
|
||
const [deviceType, setDeviceType] = useState("");
|
||
useEffect(() => {
|
||
const userAgent = navigator.userAgent;
|
||
//区分设备类型
|
||
if (/Android/i.test(userAgent)) {
|
||
setDeviceType("Android");
|
||
} else if (/iPhone|iPad|iPod/i.test(userAgent)) {
|
||
setDeviceType("ios");
|
||
} else {
|
||
setDeviceType("pc");
|
||
}
|
||
}, []);
|
||
return (
|
||
<section className="flex flex-col container">
|
||
<InOtherApp />
|
||
<div className="absolute top-0 left-0 w-full h-full z-0">
|
||
<Image
|
||
className="absolute top-0 left-0 w-36"
|
||
src={download_lefttop}
|
||
alt=""
|
||
/>
|
||
<Image
|
||
className="absolute top-10 right-0 w-28"
|
||
src={download_righttop}
|
||
alt=""
|
||
/>
|
||
<Image
|
||
className="absolute top-64 right-0 w-24"
|
||
src={download_rightmedium}
|
||
alt=""
|
||
/>
|
||
<Image
|
||
className="absolute bottom-[17rem] left-0 w-32"
|
||
src={download_leftbottom}
|
||
alt=""
|
||
/>
|
||
<Image
|
||
className="absolute bottom-0 right-0 w-[21rem]"
|
||
src={download_rightbottom}
|
||
alt=""
|
||
/>
|
||
</div>
|
||
<div className="flex flex-col flex-1 py-16 items-center justify-center gap-10 z-10">
|
||
<h1 className="text-center text-white font-medium text-2xl px-10">
|
||
多塔传媒
|
||
<br />
|
||
网红达人助力产品营销，定制广告方案
|
||
</h1>
|
||
<div>
|
||
<p className="text-white text-center mb-4 font-medium text-2xl">
|
||
推荐KOL
|
||
</p>
|
||
<div className="flex flex-row flex-wrap justify-center gap-2">
|
||
<Link
|
||
href="/253020"
|
||
className="flex flex-col w-32 rounded-lg overflow-hidden"
|
||
>
|
||
<img
|
||
className="w-full aspect-square object-cover"
|
||
src="https://file.wishpaldev.tech/imgprod/dd/e8/bf6d-f643-4853-86ab-9df91ad4e191"
|
||
alt=""
|
||
/>
|
||
<p className="text-white bg-[#FFFFFF1A] text-center font-medium py-1">
|
||
震震昊看世界
|
||
</p>
|
||
</Link>
|
||
<Link
|
||
href="/724471"
|
||
className="flex flex-col w-32 rounded-lg overflow-hidden"
|
||
>
|
||
<img
|
||
className="w-full aspect-square object-cover"
|
||
src="https://file.wishpaldev.tech/imgprod/64/81/4605-2c65-4be9-8688-7ad4d9a0092d"
|
||
alt=""
|
||
/>
|
||
<p className="text-white bg-[#FFFFFF1A] text-center font-medium py-1">
|
||
白仔游世界🌸
|
||
</p>
|
||
</Link>
|
||
<Link
|
||
href="/898644"
|
||
className="flex flex-col w-32 rounded-lg overflow-hidden"
|
||
>
|
||
<img
|
||
className="w-full aspect-square object-cover"
|
||
src="https://file.wishpaldev.tech/imgprod/88/db/370c-a850-4d2c-a7b4-950c9a722d86"
|
||
alt=""
|
||
/>
|
||
<p className="text-white bg-[#FFFFFF1A] text-center font-medium py-1">
|
||
Quyen
|
||
</p>
|
||
</Link>
|
||
<Link
|
||
href="/442668"
|
||
className="flex flex-col w-32 rounded-lg overflow-hidden"
|
||
>
|
||
<img
|
||
className="w-full aspect-square object-cover"
|
||
src="https://file.wishpaldev.tech/imgprod/f7/b8/fc3c-0279-407a-828c-8b1b92a0b9a4"
|
||
alt=""
|
||
/>
|
||
<p className="text-white bg-[#FFFFFF1A] text-center font-medium py-1">
|
||
Kasia
|
||
</p>
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<Footer />
|
||
</section>
|
||
);
|
||
}
|