function MainComponent() { const [services] = useState([ { name: "BO6/WZ4 Chair", status: "online", note: "Working as intended", version: "V2", icon: "fa-chair" }, { name: "MW3 Chair", status: "online", note: "Working as intended", version: "V1", icon: "fa-chair" }, { name: "BO6/WZ4 Unlock all", status: "online", note: "Working as intended", version: "V1", icon: "fa-unlock" }, { name: "BO6/WZ4 Forcesave", status: "maintenance", note: "Under Maintenance", version: "V1", icon: "fa-save" } ]); const getStatusColor = (status)=>{ switch(status){ case "online": return "text-green-400"; case "degraded": return "text-yellow-400"; case "maintenance": case "down": return "text-red-400"; default: return "text-gray-400"; } }; const getStatusDot = (status)=>{ switch(status){ case "online": return "bg-green-400"; case "degraded": return "bg-yellow-400"; case "maintenance": case "down": return "bg-red-400"; default: return "bg-gray-400"; } }; const getStatusText = (status)=>{ switch(status){ case "online": return "Online"; case "degraded": return "Degraded"; case "maintenance": return "Under Maintenance"; case "down": return "Down"; default: return "Unknown"; } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#0a0a0a] text-white", __source: { fileName: "", lineNumber: 77, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "bg-[#0a0a0a] border-b border-[#00f7ff]/20", __source: { fileName: "", lineNumber: 79, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-6", __source: { fileName: "", lineNumber: 80, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between h-16", __source: { fileName: "", lineNumber: 81, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-triangle text-[#00f7ff] text-xl", __source: { fileName: "", lineNumber: 83, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-[#00f7ff] text-xl font-bold", __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }, "ApartaBytes"), /*#__PURE__*/ React.createElement("span", { className: "text-gray-500 text-sm", __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this }, "zenith")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-8", __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "text-gray-400 hover:text-[#00f7ff] transition-colors duration-300", __source: { fileName: "", lineNumber: 90, columnNumber: 15 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("a", { href: "/status", className: "text-[#00f7ff] font-medium", __source: { fileName: "", lineNumber: 96, columnNumber: 15 }, __self: this }, "Status"), /*#__PURE__*/ React.createElement("a", { href: "/guides", className: "text-gray-400 hover:text-[#00f7ff] transition-colors duration-300", __source: { fileName: "", lineNumber: 99, columnNumber: 15 }, __self: this }, "Guides"))))), /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-6 py-16 text-center", __source: { fileName: "", lineNumber: 111, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-16", __source: { fileName: "", lineNumber: 112, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-5xl md:text-6xl font-bold mb-4 text-[#00f7ff]", __source: { fileName: "", lineNumber: 113, columnNumber: 11 }, __self: this }, "System Status"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-lg", __source: { fileName: "", lineNumber: 116, columnNumber: 11 }, __self: this }, "Real-time status of our services")), /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl mx-auto mb-12", __source: { fileName: "", lineNumber: 122, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#111111] border border-[#00f7ff]/20 rounded-lg p-6 hover:border-[#00f7ff]/40 transition-all duration-300", __source: { fileName: "", lineNumber: 123, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center space-x-4", __source: { fileName: "", lineNumber: 124, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-4 w-4 bg-green-400 rounded-full animate-pulse", __source: { fileName: "", lineNumber: 125, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-xl font-semibold text-green-400", __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this }, "All Systems Operational"), /*#__PURE__*/ React.createElement("div", { className: "text-gray-400", __source: { fileName: "", lineNumber: 129, columnNumber: 15 }, __self: this }, "|"), /*#__PURE__*/ React.createElement("span", { className: "text-gray-400", __source: { fileName: "", lineNumber: 130, columnNumber: 15 }, __self: this }, "Last updated: Just now")))), /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 136, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 137, columnNumber: 11 }, __self: this }, services.map((service, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-[#111111] border border-[#00f7ff]/20 rounded-lg p-6 hover:border-[#00f7ff]/40 hover:bg-[#111111]/80 transition-all duration-300 group", style: { animationDelay: `${index * 0.1}s` }, __source: { fileName: "", lineNumber: 139, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-6", __source: { fileName: "", lineNumber: 147, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-3", __source: { fileName: "", lineNumber: 148, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-2 bg-[#00f7ff]/10 rounded-lg group-hover:bg-[#00f7ff]/20 transition-colors duration-300", __source: { fileName: "", lineNumber: 149, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${service.icon} text-xl text-[#00f7ff]`, __source: { fileName: "", lineNumber: 150, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-white group-hover:text-[#00f7ff] transition-colors duration-300", __source: { fileName: "", lineNumber: 154, columnNumber: 21 }, __self: this }, service.name)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 158, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `h-3 w-3 rounded-full ${getStatusDot(service.status)} animate-pulse`, __source: { fileName: "", lineNumber: 159, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: `font-medium ${getStatusColor(service.status)}`, __source: { fileName: "", lineNumber: 162, columnNumber: 21 }, __self: this }, getStatusText(service.status)))), /*#__PURE__*/ React.createElement("div", { className: "space-y-3", __source: { fileName: "", lineNumber: 171, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center py-2 border-b border-gray-800", __source: { fileName: "", lineNumber: 172, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-400", __source: { fileName: "", lineNumber: 173, columnNumber: 21 }, __self: this }, "Status Note"), /*#__PURE__*/ React.createElement("span", { className: "text-gray-300 font-medium", __source: { fileName: "", lineNumber: 174, columnNumber: 21 }, __self: this }, service.note)), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center py-2 border-b border-gray-800", __source: { fileName: "", lineNumber: 178, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-400", __source: { fileName: "", lineNumber: 179, columnNumber: 21 }, __self: this }, "Version"), /*#__PURE__*/ React.createElement("span", { className: "text-[#00f7ff] font-mono font-bold", __source: { fileName: "", lineNumber: 180, columnNumber: 21 }, __self: this }, service.version)), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center py-2", __source: { fileName: "", lineNumber: 184, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-400", __source: { fileName: "", lineNumber: 185, columnNumber: 21 }, __self: this }, "Uptime"), /*#__PURE__*/ React.createElement("span", { className: "text-green-400 font-medium", __source: { fileName: "", lineNumber: 186, columnNumber: 21 }, __self: this }, "99.9%"))), /*#__PURE__*/ React.createElement("div", { className: "mt-4 pt-4 border-t border-gray-800", __source: { fileName: "", lineNumber: 191, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 192, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 bg-gray-800 rounded-full h-2", __source: { fileName: "", lineNumber: 193, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `h-2 rounded-full transition-all duration-1000 ${service.status === "online" ? "bg-green-400 w-full" : service.status === "maintenance" ? "bg-yellow-400 w-3/4" : "bg-red-400 w-1/2"}`, __source: { fileName: "", lineNumber: 194, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 204, columnNumber: 21 }, __self: this }, "Health"))))))), /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl mx-auto mt-16", __source: { fileName: "", lineNumber: 213, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 214, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#111111] border border-[#00f7ff]/20 rounded-lg p-6 text-center hover:border-[#00f7ff]/40 transition-all duration-300", __source: { fileName: "", lineNumber: 215, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-server text-2xl text-[#00f7ff] mb-3", __source: { fileName: "", lineNumber: 216, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold text-white mb-2", __source: { fileName: "", lineNumber: 217, columnNumber: 15 }, __self: this }, "Servers"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-green-400", __source: { fileName: "", lineNumber: 218, columnNumber: 15 }, __self: this }, "100%"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm", __source: { fileName: "", lineNumber: 219, columnNumber: 15 }, __self: this }, "Online")), /*#__PURE__*/ React.createElement("div", { className: "bg-[#111111] border border-[#00f7ff]/20 rounded-lg p-6 text-center hover:border-[#00f7ff]/40 transition-all duration-300", __source: { fileName: "", lineNumber: 221, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-shield-alt text-2xl text-[#00f7ff] mb-3", __source: { fileName: "", lineNumber: 222, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold text-white mb-2", __source: { fileName: "", lineNumber: 223, columnNumber: 15 }, __self: this }, "Security"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-green-400", __source: { fileName: "", lineNumber: 224, columnNumber: 15 }, __self: this }, "100%"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm", __source: { fileName: "", lineNumber: 225, columnNumber: 15 }, __self: this }, "Protected")), /*#__PURE__*/ React.createElement("div", { className: "bg-[#111111] border border-[#00f7ff]/20 rounded-lg p-6 text-center hover:border-[#00f7ff]/40 transition-all duration-300", __source: { fileName: "", lineNumber: 227, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-eye-slash text-2xl text-[#00f7ff] mb-3", __source: { fileName: "", lineNumber: 228, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold text-white mb-2", __source: { fileName: "", lineNumber: 229, columnNumber: 15 }, __self: this }, "UD"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-green-400", __source: { fileName: "", lineNumber: 230, columnNumber: 15 }, __self: this }, "100%"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 text-sm", __source: { fileName: "", lineNumber: 231, columnNumber: 15 }, __self: this }, "Undetected"))))), /*#__PURE__*/ React.createElement("footer", { className: "border-t border-[#00f7ff]/20 mt-20", __source: { fileName: "", lineNumber: 238, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-6 py-8", __source: { fileName: "", lineNumber: 239, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row justify-between items-center space-y-4 md:space-y-0", __source: { fileName: "", lineNumber: 240, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex space-x-6 text-sm", __source: { fileName: "", lineNumber: 241, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-gray-400 hover:text-[#00f7ff] transition-colors duration-300", __source: { fileName: "", lineNumber: 242, columnNumber: 15 }, __self: this }, "Privacy Policy"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-gray-400 hover:text-[#00f7ff] transition-colors duration-300", __source: { fileName: "", lineNumber: 248, columnNumber: 15 }, __self: this }, "Terms of Service"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-gray-400 hover:text-[#00f7ff] transition-colors duration-300", __source: { fileName: "", lineNumber: 254, columnNumber: 15 }, __self: this }, "Refund Policy"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-gray-400 hover:text-[#00f7ff] transition-colors duration-300", __source: { fileName: "", lineNumber: 260, columnNumber: 15 }, __self: this }, "Contact Us")), /*#__PURE__*/ React.createElement("div", { className: "text-gray-500 text-sm", __source: { fileName: "", lineNumber: 267, columnNumber: 13 }, __self: this }, "© 2024 ApartaBytes. All rights reserved.")))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 274, columnNumber: 7 }, __self: this }, ` @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .grid > div { animation: fadeInUp 0.6s ease-out forwards; opacity: 0; } `)); }