diff --git a/package-lock.json b/package-lock.json index ba52684..e021a68 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,8 @@ "name": "moj-hosting", "version": "0.1.0", "dependencies": { + "framer-motion": "^12.29.2", + "lucide-react": "^0.563.0", "next": "16.1.6", "react": "19.2.3", "react-dom": "19.2.3" @@ -3217,6 +3219,7 @@ "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "@rtsao/scc": "^1.1.0", "array-includes": "^3.1.9", @@ -3591,6 +3594,33 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/framer-motion": { + "version": "12.29.2", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-12.29.2.tgz", + "integrity": "sha512-lSNRzBJk4wuIy0emYQ/nfZ7eWhqud2umPKw2QAQki6uKhZPKm2hRQHeQoHTG9MIvfobb+A/LbEWPJU794ZUKrg==", + "license": "MIT", + "dependencies": { + "motion-dom": "^12.29.2", + "motion-utils": "^12.29.2", + "tslib": "^2.4.0" + }, + "peerDependencies": { + "@emotion/is-prop-valid": "*", + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/is-prop-valid": { + "optional": true + }, + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/function-bind": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", @@ -4839,6 +4869,15 @@ "yallist": "^3.0.2" } }, + "node_modules/lucide-react": { + "version": "0.563.0", + "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.563.0.tgz", + "integrity": "sha512-8dXPB2GI4dI8jV4MgUDGBeLdGk8ekfqVZ0BdLcrRzocGgG75ltNEmWS+gE7uokKF/0oSUuczNDT+g9hFJ23FkA==", + "license": "ISC", + "peerDependencies": { + "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0" + } + }, "node_modules/magic-string": { "version": "0.30.21", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz", @@ -4906,6 +4945,21 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/motion-dom": { + "version": "12.29.2", + "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-12.29.2.tgz", + "integrity": "sha512-/k+NuycVV8pykxyiTCoFzIVLA95Nb1BFIVvfSu9L50/6K6qNeAYtkxXILy/LRutt7AzaYDc2myj0wkCVVYAPPA==", + "license": "MIT", + "dependencies": { + "motion-utils": "^12.29.2" + } + }, + "node_modules/motion-utils": { + "version": "12.29.2", + "resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-12.29.2.tgz", + "integrity": "sha512-G3kc34H2cX2gI63RqU+cZq+zWRRPSsNIOjpdl9TN4AQwC4sgwYPl/Q/Obf/d53nOm569T0fYK+tcoSV50BWx8A==", + "license": "MIT" + }, "node_modules/ms": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", diff --git a/package.json b/package.json index a543d21..f657a58 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,8 @@ "lint": "eslint" }, "dependencies": { + "framer-motion": "^12.29.2", + "lucide-react": "^0.563.0", "next": "16.1.6", "react": "19.2.3", "react-dom": "19.2.3" diff --git a/public/image/banner.png b/public/image/banner.png new file mode 100644 index 0000000..7afc984 Binary files /dev/null and b/public/image/banner.png differ diff --git a/public/image/character_bg.jpg b/public/image/character_bg.jpg new file mode 100644 index 0000000..e83aed5 Binary files /dev/null and b/public/image/character_bg.jpg differ diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx new file mode 100644 index 0000000..1023026 --- /dev/null +++ b/src/app/contact/page.tsx @@ -0,0 +1,91 @@ +"use client"; + +import Navbar from "@/components/Navbar"; +import Footer from "@/components/Footer"; + +export default function ContactPage() { + return ( +
+ + + {/* HEADER */} +
+
+ 💬 Get in Touch +
+

+ Contact Support +

+

+ Have a question or need technical assistance? Our team is ready to help you 24/7. +

+
+ + {/* CONTACT OPTIONS GRID */} +
+
+ + {/* Ticket System Card - PRIMARY ACTION */} +
+
+
+ +
+

Open a Ticket

+

+ This is the fastest way to get help. Log in to our client portal to manage your services and track your inquiries. +

+
    +
  • Average response time: 30m
  • +
  • Technical & Billing support
  • +
  • 24/7/365 availability
  • +
+
+ + Go to Tickets + +
+ + {/* Email / Social Card */} +
+
+
+ +
+

Direct Email

+

+ For partnerships, business inquiries, or if you can't access your account, feel free to send us an email. +

+ +
+
+ General Inquiry + + info@hothost.org + +
+ +
+ + + +
+
+
+

+ Slovak & English support available +

+
+ +
+
+ +
+ ); +} \ No newline at end of file diff --git a/src/app/discord/page.tsx b/src/app/discord/page.tsx new file mode 100644 index 0000000..4ef6218 --- /dev/null +++ b/src/app/discord/page.tsx @@ -0,0 +1,85 @@ +"use client"; + +import Navbar from "@/components/Navbar"; +import Footer from "@/components/Footer"; +import discordData from "@/components/jsons/discord.json"; + +export default function DiscordPage() { + return ( +
+ + + {/* HEADER SECTION */} +
+
+ 🤖 Bot Infrastructure +
+

+ Discord Hosting +

+

+ {discordData.description} +

+
+ + {/* LANGUAGES & PACKAGES */} +
+ {discordData.languages.map((lang) => ( +
+
+

{lang.name} Plans

+
+
+ +
+ {lang.packages.map((pkg) => ( +
+
+
+

{pkg.name}

+
+
+ {pkg.price}{pkg.price !== "Custom" ? "€" : ""} +
+ {pkg.price !== "Custom" && ( +
/ Month
+ )} +
+
+ +
    +
  • + RAM: {pkg.memory} +
  • +
  • + Storage: {pkg.disk} +
  • +
  • + DBs: {pkg.databases} +
  • +
  • + Ryzen 7 Performance +
  • +
+
+ + + {pkg.price === "Custom" ? "Contact Support" : `Order ${lang.name} ${pkg.name}`} + +
+ ))} +
+
+ ))} +
+
+ ); +} \ No newline at end of file diff --git a/src/app/globals.css b/src/app/globals.css index a2dc41e..c22d105 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -1,26 +1,47 @@ @import "tailwindcss"; -:root { - --background: #ffffff; - --foreground: #171717; +@theme { + --color-primary: #6c63ff; + --color-primary-dark: #5a52d5; + --color-accent: #f3ba2f; /* Yellow from Hexado */ + --color-bg-light: #060606; + --color-card-bg: #0e0e0e; + --color-border: #222; } -@theme inline { - --color-background: var(--background); - --color-foreground: var(--foreground); - --font-sans: var(--font-geist-sans); - --font-mono: var(--font-geist-mono); -} +@layer base { + body { + @apply bg-[#060606] text-white antialiased; + /* Custom Scrollbar pre Chrome, Edge, Safari */ + &::-webkit-scrollbar { + width: 8px; + } + &::-webkit-scrollbar-track { + background: #060606; + } + &::-webkit-scrollbar-thumb { + background: #1a1a1a; + border-radius: 20px; + border: 2px solid #060606; + } + &::-webkit-scrollbar-thumb:hover { + background: #6c63ff; + } + } -@media (prefers-color-scheme: dark) { - :root { - --background: #0a0a0a; - --foreground: #ededed; + /* Firefox support pre scrollbar */ + * { + scrollbar-width: thin; + scrollbar-color: #1a1a1a #060606; } } -body { - background: var(--background); - color: var(--foreground); - font-family: Arial, Helvetica, sans-serif; +/* Specific styling for the rounded bento-style stats */ +.rounded-sidebar-stats div { + @apply rounded-3xl border border-white/5 bg-[#0e0e0e] transition-all duration-300; } + +/* Zaoblený pricing bento card z tvojho Redesignu */ +.pricing-card { + @apply bg-[#0e0e0e] border border-white/5 rounded-[3.5rem] p-12 transition-all duration-500 hover:border-[#6c63ff]/50; +} \ No newline at end of file diff --git a/src/app/hytale-beta/page.tsx b/src/app/hytale-beta/page.tsx new file mode 100644 index 0000000..fa12eb6 --- /dev/null +++ b/src/app/hytale-beta/page.tsx @@ -0,0 +1,77 @@ +"use client"; + +import Navbar from "@/components/Navbar"; +import Footer from "@/components/Footer"; +import hytaleData from "@/components/jsons/hytale.json"; + +export default function HytalePricing() { + return ( +
+ + + {/* HEADER */} +
+
+ ⚔️ High Performance Nodes +
+

+ Hytale Pricing +

+

+ {hytaleData.description} +

+
+ + {/* PACKAGES GRID */} +
+
+ {hytaleData.packages.map((pkg) => ( +
+
+
+

{pkg.name}

+
+
+ {pkg.price}{pkg.price !== "Negotiable" ? "€" : ""} +
+ {pkg.price !== "Negotiable" && ( +
/ Month
+ )} +
+
+ +
    +
  • + RAM: {pkg.memory} +
  • +
  • + Disk: {pkg.disk} NVMe +
  • +
  • + Databases: {pkg.databases} +
  • +
  • + Enterprise DDoS Shield +
  • +
+
+ + {/* DYNAMICKÝ REDIRECT Z JSONU */} + + {pkg.name === "CUSTOM" ? "Contact Support" : `Order ${pkg.name}`} + +
+ ))} +
+
+
+ ); +} \ No newline at end of file diff --git a/src/app/hytale/page.tsx b/src/app/hytale/page.tsx new file mode 100644 index 0000000..a5c1367 --- /dev/null +++ b/src/app/hytale/page.tsx @@ -0,0 +1,82 @@ +"use client"; + +import Navbar from "@/components/Navbar"; +import Footer from "@/components/Footer"; +import hytaleData from "@/components/jsons/hytale.json"; + +export default function HytalePricing() { + return ( +
+ + + {/* HEADER */} +
+
+ ⚔️ High Performance Nodes +
+

+ Hytale Pricing +

+

+ {hytaleData.description} +

+
+ + {/* PACKAGES GRID */} +
+
+ {hytaleData.packages.map((pkg) => ( +
+ {/* Coming Soon Overlay Effect (Optional) */} +
+ + Coming Soon + +
+ +
+
+

{pkg.name}

+
+
+ {pkg.price}{pkg.price !== "Negotiable" ? "€" : ""} +
+ {pkg.price !== "Negotiable" && ( +
/ Month
+ )} +
+
+ +
    +
  • + RAM: {pkg.memory} +
  • +
  • + Disk: {pkg.disk} NVMe +
  • +
  • + Databases: {pkg.databases} +
  • +
  • + Enterprise DDoS Shield +
  • +
+
+ + {/* DISABLED BUTTON WITH COMING SOON TEXT */} + +
+ ))} +
+
+
+ ); +} \ No newline at end of file diff --git a/src/app/layout.tsx b/src/app/layout.tsx index f7fa87e..e8195ec 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,34 +1,39 @@ import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; import "./globals.css"; - -const geistSans = Geist({ - variable: "--font-geist-sans", - subsets: ["latin"], -}); - -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", - subsets: ["latin"], -}); +import Navbar from "@/components/Navbar"; +import Footer from "@/components/Footer"; export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "HotHost.org – Best Minecraft & Discord Hosting | Cheap & Fast SK/CZ", + description: "Premium hosting for Minecraft, Discord Bots, and Hytale. Powered by Ryzen 7 CPUs and elite DDoS protection.", + keywords: "hothost, minecraft hosting, discord hosting, ryzen 7, hytale hosting", + openGraph: { + title: "HotHost.org – Best Hosting (SK/CZ)", + images: ["https://hothost.org/image/banner.png"], + type: "website", + }, }; export default function RootLayout({ children, -}: Readonly<{ +}: { children: React.ReactNode; -}>) { +}) { return ( - - - {children} + + + + + + + {/* Navbar is global and floating */} + + +
{children}
+ + {/* Footer is global */} +