115 lines
7.2 KiB
TypeScript
115 lines
7.2 KiB
TypeScript
import React, { useEffect, useState } from 'react';
|
|
import type { ReactElement } from 'react';
|
|
import Head from 'next/head';
|
|
import Link from 'next/link';
|
|
import BaseButton from '../components/BaseButton';
|
|
import SectionFullScreen from '../components/SectionFullScreen';
|
|
import LayoutGuest from '../layouts/Guest';
|
|
import { getPageTitle } from '../config';
|
|
import { useAppSelector } from '../stores/hooks';
|
|
import { mdiShieldCheck, mdiMagnify, mdiMapMarkerRadius, mdiAccountSearch } from '@mdi/js';
|
|
import BaseIcon from '../components/BaseIcon';
|
|
|
|
export default function LandingPage() {
|
|
const textColor = useAppSelector((state) => state.style.linkColor);
|
|
const title = 'OSINT Intelligence Hub';
|
|
|
|
return (
|
|
<div className="bg-slate-900 text-white min-h-screen">
|
|
<Head>
|
|
<title>{getPageTitle('Professional OSINT Tool')}</title>
|
|
</Head>
|
|
|
|
<SectionFullScreen bg="slate">
|
|
<div className="container mx-auto px-6 py-20 flex flex-col lg:flex-row items-center justify-between">
|
|
<div className="lg:w-1/2 space-y-8 animate-fade-in">
|
|
<div className="inline-block px-4 py-1 rounded-full bg-blue-500/10 border border-blue-500/30 text-blue-400 text-sm font-bold uppercase tracking-widest">
|
|
Enterprise OSINT Solutions
|
|
</div>
|
|
<h1 className="text-5xl lg:text-7xl font-extrabold leading-tight">
|
|
Global <span className="text-blue-500">Intelligence</span> at Your Fingertips.
|
|
</h1>
|
|
<p className="text-xl text-slate-400 max-w-xl">
|
|
The ultimate OSINT platform for phone investigations, geolocation,
|
|
social media lookups, and deep person searches. Powered by 30+ intelligence APIs.
|
|
</p>
|
|
|
|
<div className="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
|
|
<BaseButton
|
|
href="/login"
|
|
label="Access Dashboard"
|
|
color="info"
|
|
className="px-10 py-4 text-lg font-bold rounded-xl"
|
|
/>
|
|
<BaseButton
|
|
href="/register"
|
|
label="Create Account"
|
|
color="white"
|
|
outline
|
|
className="px-10 py-4 text-lg font-bold rounded-xl"
|
|
/>
|
|
</div>
|
|
|
|
<div className="flex items-center space-x-6 pt-4 text-slate-500">
|
|
<div className="flex items-center">
|
|
<BaseIcon path={mdiShieldCheck} size={20} className="mr-2 text-green-500" />
|
|
<span className="text-sm font-medium">Encrypted</span>
|
|
</div>
|
|
<div className="flex items-center">
|
|
<BaseIcon path={mdiShieldCheck} size={20} className="mr-2 text-green-500" />
|
|
<span className="text-sm font-medium">Global Nodes</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="lg:w-1/2 mt-20 lg:mt-0 relative">
|
|
<div className="absolute -top-20 -left-20 w-64 h-64 bg-blue-600/20 rounded-full blur-3xl animate-pulse"></div>
|
|
<div className="absolute -bottom-20 -right-20 w-64 h-64 bg-indigo-600/20 rounded-full blur-3xl animate-pulse delay-700"></div>
|
|
|
|
<div className="relative grid grid-cols-2 gap-4">
|
|
<div className="space-y-4">
|
|
<div className="p-6 bg-slate-800/50 backdrop-blur-xl border border-slate-700 rounded-3xl transform hover:-translate-y-2 transition-transform">
|
|
<BaseIcon path={mdiMagnify} size={40} className="text-blue-500 mb-4" />
|
|
<h3 className="font-bold text-lg mb-2">Deep Lookup</h3>
|
|
<p className="text-sm text-slate-400">Scan 30+ providers for phone and email intelligence.</p>
|
|
</div>
|
|
<div className="p-6 bg-slate-800/50 backdrop-blur-xl border border-slate-700 rounded-3xl transform translate-x-4 hover:-translate-y-2 transition-transform">
|
|
<BaseIcon path={mdiMapMarkerRadius} size={40} className="text-blue-500 mb-4" />
|
|
<h3 className="font-bold text-lg mb-2">Geolocation</h3>
|
|
<p className="text-sm text-slate-400">Precise location tracking via BSSID and Cell Tower data.</p>
|
|
</div>
|
|
</div>
|
|
<div className="space-y-4 pt-8">
|
|
<div className="p-6 bg-slate-800/50 backdrop-blur-xl border border-slate-700 rounded-3xl transform -translate-x-4 hover:-translate-y-2 transition-transform">
|
|
<BaseIcon path={mdiAccountSearch} size={40} className="text-blue-500 mb-4" />
|
|
<h3 className="font-bold text-lg mb-2">Person Recon</h3>
|
|
<p className="text-sm text-slate-400">Aggregate social media profiles and public records.</p>
|
|
</div>
|
|
<div className="p-6 bg-slate-800/50 backdrop-blur-xl border border-slate-700 rounded-3xl hover:-translate-y-2 transition-transform">
|
|
<BaseIcon path={mdiShieldCheck} size={40} className="text-blue-500 mb-4" />
|
|
<h3 className="font-bold text-lg mb-2">Reputation</h3>
|
|
<p className="text-sm text-slate-400">Analyze risk scores and fraud indicators instantly.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</SectionFullScreen>
|
|
|
|
<div className="bg-slate-950 border-t border-slate-800 py-10">
|
|
<div className="container mx-auto px-6 flex flex-col md:flex-row justify-between items-center text-slate-500 text-sm">
|
|
<p>© 2026 {title}. All rights reserved.</p>
|
|
<div className="flex space-x-6 mt-4 md:mt-0">
|
|
<Link href="/privacy-policy/" className="hover:text-white transition-colors">Privacy Policy</Link>
|
|
<Link href="/terms-of-service/" className="hover:text-white transition-colors">Terms of Service</Link>
|
|
<Link href="/login" className="text-blue-500 font-bold">Admin Login</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
LandingPage.getLayout = function getLayout(page: ReactElement) {
|
|
return <LayoutGuest>{page}</LayoutGuest>;
|
|
}; |