ni-link/app/page.tsx

109 lines
8.3 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import Image from "next/image"
import Link from "next/link"
import { BackgroundGradientAnimation } from "@/components/ui/background-gradient-animation"
import niLogo from "@/public/logo.svg"
import netinternet from "@/public/netinternet.svg"
import waf from "@/public/heimwall-logo.svg"
import { FaFacebook } from "react-icons/fa";
import { BsTwitterX } from "react-icons/bs";
import { FaLinkedin } from "react-icons/fa";
import { FaInstagram } from "react-icons/fa";
import { FaGithub } from "react-icons/fa";
import { BsRouter } from "react-icons/bs";
import { HiOutlineServerStack } from "react-icons/hi2";
import { IoMdCloudOutline } from "react-icons/io";
import { MdCampaign } from "react-icons/md";
import { TbWorldWww } from "react-icons/tb";
import { BsHddNetwork } from "react-icons/bs";
import { CgServer } from "react-icons/cg";
export default function Home() {
return (
<>
<BackgroundGradientAnimation>
<div className="absolute z-50 inset-0 h-screen w-screen bg-black bg-opacity-50 overflow-hidden">
<div className="absolute z-0 flex flex-col items-center justify-center justify-items-center h-screen w-screen">
<div className="flex justify-center text-center pt-4 sm:pt-8">
<button className="inline-flex h-16 w-16 px-4 animate-shimmer items-center justify-center rounded-full border border-slate-800 bg-[linear-gradient(110deg,#000103,45%,#1e2631,55%,#000103)] bg-[length:200%_100%] font-medium text-slate-400 transition-colors focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50">
<Link href={"https://netinternet.com.tr"} aria-label="Netinternet">
<Image src={niLogo} alt={""} width={48} height={48} />
</Link>
</button>
</div>
<div className="flex text-center p-4 sm:pt-8 justify-center justify-items-center">
<Link href={"https://netinternet.com.tr"} aria-label="Netinternet">
<Image
src={netinternet}
alt={""}
priority={false}
loading="lazy"
width={200}
/>
</Link>
</div>
<div className="items-center flex justify-center text-white pt-4 pb-2 sm:pt-8 gap-x-6">
<Link href={"https://www.facebook.com/netinternet"} aria-label="Facebook"><FaFacebook className="w-6 h-6 sm:w-8 sm:h-8" /></Link>
<Link href={"https://twitter.com/netinternet"} aria-label="Twitter"><BsTwitterX className="w-6 h-6 sm:w-8 sm:h-8" /></Link>
<Link href={"https://www.instagram.com/netinternet/"} aria-label="Instagram"><FaInstagram className="w-6 h-6 sm:w-8 sm:h-8" /></Link>
<Link href={"https://www.linkedin.com/company/netinternet"} aria-label="LinkedIn"><FaLinkedin className="w-6 h-6 sm:w-8 sm:h-8" width={8} height={8} /></Link>
<Link href={"https://github.com/netinternet"} aria-label="GitHub"><FaGithub className="w-6 h-6 sm:w-8 sm:h-8" /></Link>
</div>
<div className="flex flex-wrap w-full justify-center pt-4 sm:pt-8">
<button className="inline-flex h-12 w-2/3 md:h-16 mb-2 sm:mb-4 items-center justify-center backdrop-blur-lg border border-black rounded-2xl hover:shadow-[0px_0px_4px_4px_rgba(0,0,0,0.2)] hover:bg-white/[0.1] hover:bg-opacity-20 hover:backdrop-blur-lg focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50 bg-black/[0.5] text-slate-300 transition duration-200">
<BsRouter className="left-[5%] absolute w-6 h-6" />
<Link href={"https://www.netinternet.com.tr/altyapi-sorgula"}>
<h1>İnternet</h1>
</Link>
</button>
<button className="inline-flex h-12 w-2/3 md:h-16 mb-2 sm:mb-4 items-center justify-center backdrop-blur-lg border border-black rounded-2xl hover:shadow-[0px_0px_4px_4px_rgba(0,0,0,0.2)] hover:bg-white/[0.1] hover:bg-opacity-20 hover:backdrop-blur-lg focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50 bg-black/[0.5] text-slate-300 transition duration-200">
<BsHddNetwork className="left-[5%] absolute w-6 h-6" />
<Link href={"https://www.netinternet.com.tr/sunucu-barindirma"}>
Veri Merkezi
</Link>
</button>
<button className="inline-flex h-12 w-2/3 md:h-16 mb-2 sm:mb-4 items-center justify-center backdrop-blur-lg border border-black rounded-2xl hover:shadow-[0px_0px_4px_4px_rgba(0,0,0,0.2)] hover:bg-white/[0.1] hover:bg-opacity-20 hover:backdrop-blur-lg focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50 bg-black/[0.5] text-slate-300 transition duration-200">
<Link href={"https://www.netinternet.com.tr/waf-hizmeti"}>
<div className="absolute w-6 h-6 left-[5%]">
<Image src={waf} alt="" fill />
</div>
Heimwall
</Link>
</button>
<button className="inline-flex h-12 w-2/3 md:h-16 mb-2 sm:mb-4 items-center justify-center backdrop-blur-lg border border-black rounded-2xl hover:shadow-[0px_0px_4px_4px_rgba(0,0,0,0.2)] hover:bg-white/[0.1] hover:bg-opacity-20 hover:backdrop-blur-lg focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50 bg-black/[0.5] text-slate-300 transition duration-200">
<Link href={"https://www.ilkbyte.com"}>
<IoMdCloudOutline className="left-[5%] absolute w-6 h-6" />
İlkbyte
</Link>
</button>
<button className="inline-flex h-12 w-2/3 md:h-16 mb-2 sm:mb-4 items-center justify-center backdrop-blur-lg border border-black rounded-2xl hover:shadow-[0px_0px_4px_4px_rgba(0,0,0,0.2)] hover:bg-white/[0.1] hover:bg-opacity-20 hover:backdrop-blur-lg focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50 bg-black/[0.5] text-slate-300 transition duration-200">
<Link href={"https://www.netinternet.com.tr/hosting/cpanel"}>
<CgServer className="left-[5%] absolute w-6 h-6" />
Hosting
</Link>
</button>
<button className="inline-flex h-12 w-2/3 md:h-16 mb-2 sm:mb-4 items-center justify-center backdrop-blur-lg border border-black rounded-2xl hover:shadow-[0px_0px_4px_4px_rgba(0,0,0,0.2)] hover:bg-white/[0.1] hover:bg-opacity-20 hover:backdrop-blur-lg focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50 bg-black/[0.5] text-slate-300 transition duration-200">
<Link href={"https://www.netinternet.com.tr/domain"}>
<TbWorldWww className="left-[5%] absolute w-6 h-6" />
Alan Adı
</Link>
</button>
<button className="inline-flex h-12 w-2/3 md:h-16 mb-2 sm:mb-4 items-center justify-center backdrop-blur-lg border border-black rounded-2xl hover:shadow-[0px_0px_4px_4px_rgba(0,0,0,0.2)] hover:bg-white/[0.1] hover:bg-opacity-20 hover:backdrop-blur-lg focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50 bg-black/[0.5] text-slate-300 transition duration-200">
<Link href={"https://www.netinternet.com.tr/ssd-vds-sanal-sunucu"}>
<HiOutlineServerStack className="left-[5%] absolute w-6 h-6" />
SSD VDS Sunucu
</Link>
</button>
<button className="inline-flex h-12 w-2/3 md:h-16 mb-2 sm:mb-4 items-center justify-center backdrop-blur-lg border border-black rounded-2xl hover:shadow-[0px_0px_4px_4px_rgba(0,0,0,0.2)] hover:bg-white/[0.1] hover:bg-opacity-20 hover:backdrop-blur-lg focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50 bg-black/[0.5] text-slate-300 transition duration-200">
<Link href={"https://www.netinternet.com.tr/campaigns"}>
<MdCampaign className="left-[5%] absolute w-6 h-6" />
Kampanyalar
</Link>
</button>
</div>
</div>
</div >
</BackgroundGradientAnimation >
</>
);
}