Refactor marketing pages to use GlossyPageShell component system #4694
32 changed files+2252−1352
Modified.github/workflows/d8-deploy.yml+1−1View fileUnifiedSplit
@@ -24,7 +24,7 @@ jobs:
2424 run: npm ci
2525
2626 - name: Build gate
27 continue-on-error: true
27 continue-on-error: true
2828 run: npm run build
2929
3030 - name: Install Vercel CLI
Added.github/workflows/d8-staging.yml+60−0View fileUnifiedSplit
@@ -0,0 +1,60 @@
1name: D8 Staging (branch -> Vercel Preview)
2
3on:
4 push:
5 branches-ignore:
6 - main
7 - master
8 workflow_dispatch: {}
9
10concurrency:
11 group: d8-staging-${{ github.ref_name }}
12 cancel-in-progress: true
13
14jobs:
15 preview_deploy:
16 runs-on: ubuntu-latest
17 steps:
18 - uses: actions/checkout@v4
19
20 - uses: actions/setup-node@v4
21 with:
22 node-version: "20"
23 cache: "npm"
24
25 - name: Install
26 run: npm ci
27
28 - name: Build gate
29 continue-on-error: true
30 run: npm run build
31
32 - name: Install Vercel CLI
33 run: npm i -g vercel@latest
34
35 - name: Pull Vercel env (preview)
36 run: vercel pull --yes --environment=preview --token=${{ secrets.VERCEL_TOKEN }}
37 env:
38 VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
39 VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}
40
41 - name: Deploy (preview / staging)
42 id: deploy
43 run: |
44 URL=$(vercel deploy --yes --token=${{ secrets.VERCEL_TOKEN }})
45 echo "preview_url=$URL" >> "$GITHUB_OUTPUT"
46 echo "## Staging Preview" >> "$GITHUB_STEP_SUMMARY"
47 echo "" >> "$GITHUB_STEP_SUMMARY"
48 echo "Branch: \`${{ github.ref_name }}\`" >> "$GITHUB_STEP_SUMMARY"
49 echo "" >> "$GITHUB_STEP_SUMMARY"
50 echo "Preview URL: $URL" >> "$GITHUB_STEP_SUMMARY"
51 env:
52 VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
53 VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}
54
55 - name: Print preview URL
56 run: |
57 echo "=========================================="
58 echo " STAGING PREVIEW URL:"
59 echo " ${{ steps.deploy.outputs.preview_url }}"
60 echo "=========================================="
Deletedapp/api/__where__/dxl-auth-check/route.ts+0−77View fileUnifiedSplit
@@ -1,77 +0,0 @@
1import { NextResponse } from "next/server";
2
3export const dynamic = "force-dynamic";
4
5function pick(obj: Record<string, any>, keys: string[]) {
6 const out: Record<string, any> = {};
7 for (const k of keys) {
8 if (obj[k] !== undefined && obj[k] !== "") out[k] = obj[k];
9 }
10 return out;
11}
12
13export async function GET(req: Request) {
14 const url = new URL(req.url);
15 const env = process.env as Record<string, string | undefined>;
16
17 const vercel = pick(env as any, [
18 "VERCEL",
19 "VERCEL_ENV",
20 "VERCEL_REGION",
21 "VERCEL_URL",
22 "VERCEL_BRANCH_URL",
23 "VERCEL_PROJECT_ID",
24 "VERCEL_DEPLOYMENT_ID",
25 ]);
26
27 const git = pick(env as any, [
28 "VERCEL_GIT_PROVIDER",
29 "VERCEL_GIT_REPO_SLUG",
30 "VERCEL_GIT_REPO_OWNER",
31 "VERCEL_GIT_REPO_ID",
32 "VERCEL_GIT_COMMIT_SHA",
33 "VERCEL_GIT_COMMIT_REF",
34 "VERCEL_GIT_COMMIT_MESSAGE",
35 ]);
36
37 const runtime = pick(env as any, [
38 "NODE_VERSION",
39 "NODE_ENV",
40 ]);
41
42 const headersObj: Record<string, string> = {};
43 const wantHeaders = [
44 "x-vercel-id",
45 "x-matched-path",
46 "x-vercel-cache",
47 "x-forwarded-for",
48 "x-forwarded-proto",
49 "host",
50 "user-agent",
51 ];
52 for (const h of wantHeaders) {
53 const v = req.headers.get(h);
54 if (v) headersObj[h] = v;
55 }
56
57 return NextResponse.json(
58 {
59 ok: true,
60 stamp: "DXL_WHERE_PROOF_ENRICH_20260129",
61 builtAt: "20260129_103347",
62 at: new Date().toISOString(),
63 path: url.pathname,
64 qs: Object.fromEntries(url.searchParams.entries()),
65 vercel,
66 git,
67 runtime,
68 headers: headersObj,
69 note: "Where-proof endpoint. Use this to confirm LIVE deploy + git SHA.",
70 },
71 {
72 headers: {
73 "cache-control": "no-store, max-age=0",
74 },
75 }
76 );
77}
\ No newline at end of file
Modifiedmiddleware.ts+40−13View fileUnifiedSplit
@@ -2,23 +2,50 @@ import { NextResponse } from "next/server";
22import type { NextRequest } from "next/server";
33
44export function middleware(req: NextRequest) {
5
6 // DXL_MIDDLEWARE_ALLOW_AUTHCHECK_20260129
7 // Allow DXL admin auth-check endpoints to bypass middleware gating.
8 // This does NOT leak secrets; it only enables routing.
9 const __dxlPath = (req as any)?.nextUrl?.pathname ?? "";
10 if (__dxlPath === "/api/dxl/auth-check" || __dxlPath === "/api/__where__/dxl-auth-check") {
5 const pathname = req.nextUrl.pathname;
6
7 // DXL admin auth-check bypass
8 if (pathname === "/api/dxl/auth-check" || pathname === "/api/__where__/dxl-auth-check") {
119 return NextResponse.next();
12 }const p = req.nextUrl.pathname;
13 const res = NextResponse.next();
10 }
11
12 // Legacy probe redirect
13 if (pathname === "/api/__probe__" || pathname === "/api/__probe__/") {
14 const u = req.nextUrl.clone();
15 u.pathname = "/api/probe";
16 const res = NextResponse.redirect(u, 307);
17 res.headers.set("x-dominat8-mw-legacy", "redirect307");
18 return res;
19 }
20
21 // Legacy ping redirect
22 if (pathname === "/api/__ping__" || pathname === "/api/__ping__/") {
23 const u = req.nextUrl.clone();
24 u.pathname = "/api/ping";
25 const res = NextResponse.redirect(u, 307);
26 res.headers.set("x-dominat8-mw-legacy", "redirect307");
27 return res;
28 }
1429
15 if (p === "/__probe__" || p === "/api/__probe__") {
16 res.headers.set("Cache-Control", "no-store, max-age=0");
17 res.headers.set("Pragma", "no-cache");
18 res.headers.set("Expires", "0");
30 // API routes: pass through with marker header
31 if (pathname.startsWith("/api/")) {
32 const res = NextResponse.next();
33 res.headers.set("x-dominat8-mw", "1");
34 return res;
1935 }
2036
37 // All other routes: anti-cache headers
38 const res = NextResponse.next();
39 res.headers.set("Cache-Control", "no-store, no-cache, must-revalidate, max-age=0");
40 res.headers.set("Pragma", "no-cache");
41 res.headers.set("Expires", "0");
42 res.headers.set("Surrogate-Control", "no-store");
2143 return res;
2244}
2345
24export const config = { matcher: ["/__probe__", "/api/__probe__"] };
46export const config = {
47 matcher: [
48 "/api/:path*",
49 "/((?!_next/static|_next/image|favicon.ico).*)",
50 ],
51};
Modifiedpackage-lock.json+0−11View fileUnifiedSplit
@@ -1460,7 +1460,6 @@
14601460 "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
14611461 "dev": true,
14621462 "license": "MIT",
1463 "peer": true,
14641463 "bin": {
14651464 "acorn": "bin/acorn"
14661465 },
@@ -1895,7 +1894,6 @@
18951894 }
18961895 ],
18971896 "license": "MIT",
1898 "peer": true,
18991897 "dependencies": {
19001898 "baseline-browser-mapping": "^2.9.0",
19011899 "caniuse-lite": "^1.0.30001759",
@@ -2535,7 +2533,6 @@
25352533 "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
25362534 "dev": true,
25372535 "license": "MIT",
2538 "peer": true,
25392536 "dependencies": {
25402537 "@eslint-community/eslint-utils": "^4.2.0",
25412538 "@eslint-community/regexpp": "^4.6.1",
@@ -2704,7 +2701,6 @@
27042701 "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
27052702 "dev": true,
27062703 "license": "MIT",
2707 "peer": true,
27082704 "dependencies": {
27092705 "@rtsao/scc": "^1.1.0",
27102706 "array-includes": "^3.1.9",
@@ -4745,7 +4741,6 @@
47454741 "integrity": "sha512-0f8aRfBVL+mpzfBjYfQuLWh2WyAwtJXCRfkPF4UJ5qd2YwrHczsrSzXU4tRMV0OAxR8ZJZWPFn6uhSC56UTsLA==",
47464742 "deprecated": "This version has a security vulnerability. Please upgrade to a patched version. See https://nextjs.org/blog/security-update-2025-12-11 for more details.",
47474743 "license": "MIT",
4748 "peer": true,
47494744 "dependencies": {
47504745 "@next/env": "14.2.5",
47514746 "@swc/helpers": "0.5.5",
@@ -5247,7 +5242,6 @@
52475242 }
52485243 ],
52495244 "license": "MIT",
5250 "peer": true,
52515245 "dependencies": {
52525246 "nanoid": "^3.3.11",
52535247 "picocolors": "^1.1.1",
@@ -5337,7 +5331,6 @@
53375331 "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
53385332 "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==",
53395333 "license": "MIT",
5340 "peer": true,
53415334 "dependencies": {
53425335 "loose-envify": "^1.1.0"
53435336 },
@@ -5350,7 +5343,6 @@
53505343 "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz",
53515344 "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==",
53525345 "license": "MIT",
5353 "peer": true,
53545346 "dependencies": {
53555347 "loose-envify": "^1.1.0",
53565348 "scheduler": "^0.23.0"
@@ -6253,7 +6245,6 @@
62536245 "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
62546246 "dev": true,
62556247 "license": "MIT",
6256 "peer": true,
62576248 "engines": {
62586249 "node": ">=12"
62596250 },
@@ -6422,7 +6413,6 @@
64226413 "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
64236414 "dev": true,
64246415 "license": "Apache-2.0",
6425 "peer": true,
64266416 "bin": {
64276417 "tsc": "bin/tsc",
64286418 "tsserver": "bin/tsserver"
@@ -6822,7 +6812,6 @@
68226812 "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.76.tgz",
68236813 "integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==",
68246814 "license": "MIT",
6825 "peer": true,
68266815 "funding": {
68276816 "url": "https://github.com/sponsors/colinhacks"
68286817 }
Deletedpages/api/__where__/dxl-auth-check.ts+0−14View fileUnifiedSplit
@@ -1,14 +0,0 @@
1import type { NextApiRequest, NextApiResponse } from "next";
2
3export default function handler(req: NextApiRequest, res: NextApiResponse) {
4 res.setHeader("cache-control", "no-store, max-age=0");
5 res.setHeader("x-dxl-where", "DXL_WHERE_LOCATOR_ALLROOTS_20260129");
6 res.setHeader("x-dxl-route", "pages-router");
7 res.status(200).json({
8 ok: true,
9 stamp: "DXL_WHERE_LOCATOR_ALLROOTS_20260129",
10 at: new Date().toISOString(),
11 path: "/api/__where__/dxl-auth-check",
12 note: "Locator endpoint. If you see this JSON, the API route exists on this deploy."
13 });
14}
\ No newline at end of file
Modifiedsrc/app/(marketing)/about/page.tsx+77−39View fileUnifiedSplit
@@ -1,6 +1,6 @@
1import GlossyPageShell, { GlossyPageHeader, GlossyCard } from "@/components/ui/GlossyPageShell";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
13import Link from "next/link";
2import MarketingCTA from "@/src/components/marketing/MarketingCTA";
3import SeoJsonLd from "@/src/components/marketing/SeoJsonLd";
44
55export const metadata = {
66 title: "About — Dominat8",
@@ -9,50 +9,88 @@ export const metadata = {
99};
1010
1111export default function AboutPage() {
12 const orgJsonLd = {
13 "@context": "https://schema.org",
14 "@type": "Organization",
15 name: "Dominat8",
16 url: "https://www.dominat8.com",
17 description:
18 "AI website automation builder for generating, optimizing, and publishing high-converting websites.",
19 };
20
2112 return (
22 <main className="mx-auto w-full max-w-3xl px-6 py-10">
23 <SeoJsonLd data={orgJsonLd} />
13 <GlossyPageShell>
14 <GlossyPageHeader
15 icon="star"
16 eyebrow="About Us"
17 title="About Dominat8"
18 subtitle="We build the tools that let you ship premium, conversion-first websites faster than ever — powered by AI agents that handle the hard parts."
19 />
2420
25 <div className="mb-6">
26 <Link href="/" className="text-sm opacity-70 hover:opacity-100">
27 ← Back home
28 </Link>
21 <div style={{ display: "grid", gridTemplateColumns: "repeat(2, 1fr)", gap: 14 }}>
22 <GlossyCard icon="bolt" title="Speed">
23 Get from idea to published site fast. Our AI generates complete site specs, pages, and copy from a simple brief.
24 </GlossyCard>
25 <GlossyCard icon="chart" title="Growth">
26 SEO structure, metadata, and conversion-first pages built into every site by default.
27 </GlossyCard>
28 <GlossyCard icon="cpu" title="Automation">
29 Repeatable agent-driven workflows handle generation, optimization, and publishing without manual effort.
30 </GlossyCard>
31 <GlossyCard icon="star" title="Quality">
32 Clean output with premium framing. Every site looks expensive and ships with confidence.
33 </GlossyCard>
2934 </div>
3035
31 <h1 className="text-3xl font-semibold tracking-tight">About Dominat8</h1>
32 <p className="mt-3 text-base opacity-80">
33 Dominat8 helps you build and ship websites faster using AI agents. Generate a complete site
34 foundation, run SEO + conversion passes, then publish to your custom domain.
35 </p>
36
37 <section className="mt-8 rounded-2xl border border-black/10 bg-white p-6 shadow-sm">
38 <h2 className="text-xl font-semibold">What we focus on</h2>
39 <ul className="mt-4 list-disc space-y-2 pl-6 text-sm opacity-80">
40 <li>Speed: get from idea to published site fast</li>
41 <li>Growth: SEO structure, metadata, and conversion-first pages</li>
42 <li>Automation: repeatable agent-driven workflows</li>
43 <li>Quality: clean output that’s easy to refine and publish</li>
44 </ul>
36 <section
37 style={{
38 marginTop: 32,
39 borderRadius: 20,
40 padding: 28,
41 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
42 border: "1px solid rgba(255,255,255,0.10)",
43 boxShadow: "0 20px 60px rgba(0,0,0,0.35)",
44 }}
45 >
46 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
47 <GlossyIcon name="rocket" size={38} />
48 <div style={{ fontSize: 16, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>Our Mission</div>
49 </div>
50 <p style={{ marginTop: 12, fontSize: 14, lineHeight: 1.6, color: "rgba(237,234,247,0.72)" }}>
51 Dominat8 exists to eliminate the gap between “I need a website” and “I have a premium, conversion-optimized
52 site live on my domain.” We combine AI generation with battle-tested design patterns so every site ships
53 polished, fast, and ready to convert.
54 </p>
4555 </section>
4656
47 <section className="mt-10 rounded-2xl border border-black/10 bg-black/[0.02] p-6">
48 <div className="text-sm font-semibold">Next step</div>
49 <p className="mt-2 text-sm opacity-80">
57 <section
58 style={{
59 marginTop: 24,
60 borderRadius: 20,
61 padding: 28,
62 background: "linear-gradient(135deg, rgba(168,85,247,0.10), rgba(59,130,246,0.06))",
63 border: "1px solid rgba(255,255,255,0.10)",
64 boxShadow: "0 20px 60px rgba(0,0,0,0.3)",
65 textAlign: "center",
66 }}
67 >
68 <GlossyIcon name="sparkle" size={44} style={{ margin: "0 auto" }} />
69 <div style={{ marginTop: 12, fontSize: 16, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>Ready to get started?</div>
70 <p style={{ marginTop: 8, fontSize: 14, color: "rgba(237,234,247,0.68)" }}>
5071 Start free and generate your first website.
5172 </p>
52 <div className="mt-4">
53 <MarketingCTA />
54 </div>
73 <Link
74 href="/templates"
75 style={{
76 display: "inline-flex",
77 alignItems: "center",
78 gap: 8,
79 marginTop: 16,
80 padding: "12px 20px",
81 borderRadius: 14,
82 textDecoration: "none",
83 fontWeight: 800,
84 fontSize: 14,
85 color: "#07070B",
86 background: "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))",
87 boxShadow: "0 18px 55px rgba(168,85,247,0.26), 0 10px 24px rgba(59,130,246,0.16)",
88 border: "1px solid rgba(255,255,255,0.10)",
89 }}
90 >
91 <GlossyIconInline name="rocket" size={16} /> Start Building
92 </Link>
5593 </section>
56 </main>
94 </GlossyPageShell>
5795 );
58}
\ No newline at end of file
96}
Modifiedsrc/app/(marketing)/contact/page.jsx+99−27View fileUnifiedSplit
@@ -1,42 +1,114 @@
1import { PageHeader, LogoCloud } from "../../../components/marketing/MarketingShell";
1import GlossyPageShell, { GlossyPageHeader, GlossyCard } from "@/components/ui/GlossyPageShell";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
3import Link from "next/link";
24
35export default function ContactPage() {
46 return (
5 <main>
6 <PageHeader
7 <GlossyPageShell>
8 <GlossyPageHeader
9 icon="mail"
710 eyebrow="Contact"
811 title="Talk to the team"
9 subtitle="Tell us what you’re building and we’ll point you to the fastest path to a premium launch."
10 rightSlot={
11 <a className="rounded-2xl bg-slate-900 px-5 py-3 text-sm font-semibold text-white hover:bg-slate-800 shadow-sm" href="/p/new">
12 Generate my site
13 </a>
14 }
12 subtitle="Tell us what you're building and we'll point you to the fastest path to a premium launch."
13 ctaHref="/templates"
14 ctaLabel="Generate my site"
15 ctaIcon="rocket"
1516 />
1617
17 <LogoCloud label="Premium support experience" />
18
19 <div className="mx-auto max-w-6xl px-6 pb-14">
20 <div className="grid gap-5 md:grid-cols-2">
21 <div className="rounded-3xl bg-white/85 p-6 ring-1 ring-slate-200 shadow-sm">
22 <div className="text-sm font-semibold text-slate-950">Email</div>
23 <div className="mt-2 text-sm text-slate-700">support@dominat8.com (placeholder)</div>
18 <div style={{ display: "grid", gridTemplateColumns: "repeat(2, 1fr)", gap: 14 }}>
19 <div
20 style={{
21 borderRadius: 20,
22 padding: 24,
23 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
24 border: "1px solid rgba(255,255,255,0.10)",
25 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
26 }}
27 >
28 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
29 <GlossyIcon name="mail" size={38} />
30 <div style={{ fontSize: 15, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>Email</div>
31 </div>
32 <div style={{ marginTop: 12, fontSize: 14, color: "rgba(237,234,247,0.72)" }}>support@dominat8.com</div>
2433
25 <div className="mt-6 text-sm font-semibold text-slate-950">Response time</div>
26 <div className="mt-2 text-sm text-slate-700">We aim to reply within 24 hours.</div>
34 <div style={{ marginTop: 20, display: "flex", alignItems: "center", gap: 10 }}>
35 <GlossyIcon name="clock" size={38} />
36 <div style={{ fontSize: 15, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>Response time</div>
2737 </div>
38 <div style={{ marginTop: 12, fontSize: 14, color: "rgba(237,234,247,0.72)" }}>We aim to reply within 24 hours.</div>
39 </div>
2840
29 <div className="rounded-3xl bg-white/85 p-6 ring-1 ring-slate-200 shadow-sm">
30 <div className="text-sm font-semibold text-slate-950">Quick note</div>
31 <p className="mt-2 text-sm leading-relaxed text-slate-700">
32 This is a marketing placeholder. Next upgrade can wire a contact form endpoint if you want.
33 </p>
34 <a className="mt-6 inline-flex rounded-2xl bg-slate-900 px-5 py-3 text-sm font-semibold text-white hover:bg-slate-800 shadow-sm" href="/pricing">
35 View pricing
36 </a>
41 <div
42 style={{
43 borderRadius: 20,
44 padding: 24,
45 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
46 border: "1px solid rgba(255,255,255,0.10)",
47 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
48 }}
49 >
50 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
51 <GlossyIcon name="sparkle" size={38} />
52 <div style={{ fontSize: 15, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>Quick note</div>
53 </div>
54 <p style={{ marginTop: 12, fontSize: 14, lineHeight: 1.6, color: "rgba(237,234,247,0.72)" }}>
55 Whether you need help choosing a template, setting up your domain, or understanding the pipeline — we're here to help.
56 </p>
57 <div style={{ display: "flex", gap: 10, flexWrap: "wrap", marginTop: 18 }}>
58 <Link
59 href="/pricing"
60 style={{
61 display: "inline-flex",
62 alignItems: "center",
63 gap: 8,
64 padding: "10px 16px",
65 borderRadius: 14,
66 textDecoration: "none",
67 fontWeight: 800,
68 fontSize: 13,
69 color: "#07070B",
70 background: "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))",
71 boxShadow: "0 18px 55px rgba(168,85,247,0.20)",
72 border: "1px solid rgba(255,255,255,0.10)",
73 }}
74 >
75 <GlossyIconInline name="credit-card" size={14} /> View pricing
76 </Link>
77 <Link
78 href="/faq"
79 style={{
80 display: "inline-flex",
81 alignItems: "center",
82 gap: 8,
83 padding: "10px 16px",
84 borderRadius: 14,
85 textDecoration: "none",
86 fontWeight: 800,
87 fontSize: 13,
88 color: "rgba(237,234,247,0.88)",
89 background: "rgba(255,255,255,0.04)",
90 border: "1px solid rgba(255,255,255,0.12)",
91 }}
92 >
93 <GlossyIconInline name="question" size={14} /> Read FAQ
94 </Link>
3795 </div>
3896 </div>
3997 </div>
40 </main>
98
99 <section style={{ marginTop: 24 }}>
100 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
101 <GlossyCard icon="bolt" title="Fast responses">
102 We prioritize getting you unblocked quickly so you can ship.
103 </GlossyCard>
104 <GlossyCard icon="users" title="Dedicated support">
105 Pro and Business plans get priority support access.
106 </GlossyCard>
107 <GlossyCard icon="globe" title="Domain help">
108 Need help with DNS, SSL, or domain verification? We walk you through it.
109 </GlossyCard>
110 </div>
111 </section>
112 </GlossyPageShell>
41113 );
42114}
Deletedsrc/app/(marketing)/faq/page.jsx+0−45View fileUnifiedSplit
@@ -1,45 +0,0 @@
1import { PageHeader, FAQAccordion, LogoCloud } from "../../../components/marketing/MarketingShell";
2
3export default function FaqPage() {
4 const items = [
5 {
6 q: "Why did changes not show earlier?",
7 a: "Because builds were failing. Vercel correctly pins the last green deployment. Now we only push when builds are green."
8 },
9 {
10 q: "Why are we using .jsx instead of .tsx?",
11 a: "To avoid TSX/JSX parsing landmines and keep the system reliably deployable. We can reintroduce TypeScript later."
12 },
13 {
14 q: "What does Dominat8 actually do?",
15 a: "It turns a brief into a full website spec, then runs agents to generate pages, apply SEO, produce sitemap/robots, and publish artifacts."
16 },
17 {
18 q: "How do I know production updated?",
19 a: "Open /__status and compare the marker. If it changed, production changed."
20 }
21 ];
22
23 return (
24 <main>
25 <PageHeader
26 eyebrow="FAQ"
27 title="Clear answers, no guesswork"
28 subtitle="The fastest way to stay sane: markers + build-gated shipping."
29 rightSlot={
30 <a className="rounded-2xl bg-slate-900 px-5 py-3 text-sm font-semibold text-white hover:bg-slate-800 shadow-sm" href="/__status">
31 Check status
32 </a>
33 }
34 />
35
36 <LogoCloud label="Designed for calm shipping" />
37
38 <div className="mx-auto max-w-6xl px-6 pb-16">
39 <div className="rounded-3xl bg-white/85 p-8 ring-1 ring-slate-200 shadow-sm">
40 <FAQAccordion items={items} />
41 </div>
42 </div>
43 </main>
44 );
45}
Modifiedsrc/app/(marketing)/faq/page.tsx+112−37View fileUnifiedSplit
@@ -1,52 +1,127 @@
1import Link from "next/link";
2import MarketingCTA from "@/src/components/marketing/MarketingCTA";
3import MarketingFAQ from "@/components/marketing/MarketingFAQ";
4import SeoJsonLd from "@/src/components/marketing/SeoJsonLd";
5import { marketingFaq } from "@/src/lib/marketing/faq";
1import GlossyPageShell, { GlossyPageHeader } from "@/components/ui/GlossyPageShell";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
3import Link from "next/link";
64
75export const metadata = {
8 title: "FAQ — Dominat8",
6 title: "FAQ — Dominat8",
97 description:
108 "Answers to common questions about Dominat8: AI website generation, SEO, publishing, and domains.",
119};
1210
13export default function FaqPage() {
14 const faqJsonLd = {
15 "@context": "https://schema.org",
16 "@type": "FAQPage",
17 mainEntity: marketingFaq.map((it) => ({
18 "@type": "Question",
19 name: it.q,
20 acceptedAnswer: { "@type": "Answer", text: it.a },
21 })),
22 };
11const faqItems = [
12 {
13 icon: "cpu" as const,
14 q: "What does Dominat8 actually do?",
15 a: "It turns a brief into a full website spec, then runs AI agents to generate pages, apply SEO, produce sitemap/robots, and publish artifacts — all automatically.",
16 },
17 {
18 icon: "palette" as const,
19 q: "Do I need to be a designer?",
20 a: "No. The system uses proven layout rhythm, spacing, and conversion patterns so your site looks premium by default. Just describe your business.",
21 },
22 {
23 icon: "bolt" as const,
24 q: "How fast can I get a site?",
25 a: "Minutes, not weeks. Enter a brief, review the generated spec, refine if needed, and publish. The AI handles all the heavy lifting.",
26 },
27 {
28 icon: "globe" as const,
29 q: "Can I use my own domain?",
30 a: "Yes. The platform is designed to publish and map to your custom domain. SSL is provisioned and DNS verification is built into the flow.",
31 },
32 {
33 icon: "shield" as const,
34 q: "How do I know my site deployed correctly?",
35 a: "Build-gated deploys ensure nothing ships unless the build is green. Check the status page or build marker to verify production is current.",
36 },
37 {
38 icon: "chart" as const,
39 q: "Is SEO included?",
40 a: "Every generated site includes titles, meta descriptions, schema markup, canonical URLs, sitemap, and robots.txt — all built into the generation flow.",
41 },
42 {
43 icon: "layers" as const,
44 q: "Can I customize the templates?",
45 a: "Absolutely. Start with a proven template structure, then swap sections, edit copy, reorder blocks, and redeploy with confidence.",
46 },
47 {
48 icon: "credit-card" as const,
49 q: "Is there a free plan?",
50 a: "Yes. Start free and generate your first site spec. Upgrade to Pro or Business when you want full automation, SEO plans, and priority pipeline access.",
51 },
52];
2353
54export default function FaqPage() {
2455 return (
25 <main className="mx-auto w-full max-w-3xl px-6 py-10">
26 <SeoJsonLd data={faqJsonLd} />
56 <GlossyPageShell>
57 <GlossyPageHeader
58 icon="question"
59 eyebrow="FAQ"
60 title="Clear answers, no guesswork"
61 subtitle="Quick answers about how Dominat8 works — from generation to publishing."
62 ctaHref="/templates"
63 ctaLabel="Try it free"
64 ctaIcon="rocket"
65 />
2766
28 <div className="mb-6">
29 <Link href="/" className="text-sm opacity-70 hover:opacity-100">
30 ↠Back home
31 </Link>
67 <div style={{ display: "grid", gridTemplateColumns: "repeat(2, 1fr)", gap: 14 }}>
68 {faqItems.map((item) => (
69 <div
70 key={item.q}
71 style={{
72 borderRadius: 18,
73 padding: 20,
74 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
75 border: "1px solid rgba(255,255,255,0.10)",
76 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
77 }}
78 >
79 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
80 <GlossyIcon name={item.icon} size={34} />
81 <div style={{ fontSize: 14, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{item.q}</div>
82 </div>
83 <div style={{ marginTop: 10, fontSize: 13, lineHeight: 1.6, color: "rgba(237,234,247,0.68)" }}>{item.a}</div>
84 </div>
85 ))}
3286 </div>
3387
34 <h1 className="text-3xl font-semibold tracking-tight">FAQ</h1>
35 <p className="mt-3 text-base opacity-80">
36 Quick answers about how Dominat8 works.
37 </p>
38
39 <MarketingFAQ items={marketingFaq} />
40
41 <section className="mt-10 rounded-2xl border border-black/10 bg-black/[0.02] p-6">
42 <div className="text-sm font-semibold">Still have questions?</div>
43 <p className="mt-2 text-sm opacity-80">
44 Start free and explore the workflow — you’ll see how the agents generate and refine your site.
88 <section
89 style={{
90 marginTop: 32,
91 borderRadius: 20,
92 padding: 28,
93 background: "linear-gradient(135deg, rgba(168,85,247,0.10), rgba(59,130,246,0.06))",
94 border: "1px solid rgba(255,255,255,0.10)",
95 boxShadow: "0 20px 60px rgba(0,0,0,0.3)",
96 textAlign: "center",
97 }}
98 >
99 <GlossyIcon name="mail" size={44} style={{ margin: "0 auto" }} />
100 <div style={{ marginTop: 12, fontSize: 16, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>Still have questions?</div>
101 <p style={{ marginTop: 8, fontSize: 14, color: "rgba(237,234,247,0.68)" }}>
102 Reach out and we'll point you to the fastest path forward.
45103 </p>
46 <div className="mt-4">
47 <MarketingCTA />
48 </div>
104 <Link
105 href="/contact"
106 style={{
107 display: "inline-flex",
108 alignItems: "center",
109 gap: 8,
110 marginTop: 16,
111 padding: "12px 20px",
112 borderRadius: 14,
113 textDecoration: "none",
114 fontWeight: 800,
115 fontSize: 14,
116 color: "#07070B",
117 background: "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))",
118 boxShadow: "0 18px 55px rgba(168,85,247,0.26), 0 10px 24px rgba(59,130,246,0.16)",
119 border: "1px solid rgba(255,255,255,0.10)",
120 }}
121 >
122 <GlossyIconInline name="mail" size={16} /> Contact Us
123 </Link>
49124 </section>
50 </main>
125 </GlossyPageShell>
51126 );
52127}
Renamedsrc/app/gallery/[slug]/page.tsxsrc/app/(marketing)/gallery/[slug]/page.tsx+0−0View fileUnifiedSplit
No textual changes.
Modifiedsrc/app/(marketing)/gallery/page.jsx+130−78View fileUnifiedSplit
@@ -1,14 +1,19 @@
1export const dynamic = "force-dynamic";
1export const dynamic = "force-dynamic";
22
3import { MONSTER_MARKER } from "../../../lib/buildMarker";
4import { TopBar, HeaderNav, Footer } from "../../../components/marketing/MarketingShell";
3import GlossyPageShell, { GlossyPageHeader } from "@/components/ui/GlossyPageShell";
4import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
5import Link from "next/link";
56
67async function getGallery() {
78 const base = process.env.VERCEL_URL ? "https://" + process.env.VERCEL_URL : "";
89 const url = (base ? base : "") + "/api/gallery/list";
9 const res = await fetch(url, { cache: "no-store" });
10 if (!res.ok) return { ok: false, cards: [] };
11 return await res.json();
10 try {
11 const res = await fetch(url, { cache: "no-store" });
12 if (!res.ok) return { ok: false, cards: [] };
13 return await res.json();
14 } catch {
15 return { ok: false, cards: [] };
16 }
1217}
1318
1419export default async function GalleryPage() {
@@ -16,85 +21,132 @@ export default async function GalleryPage() {
1621 const cards = data && Array.isArray(data.cards) ? data.cards : [];
1722
1823 return (
19 <main className="min-h-screen bg-white text-slate-900">
20 <div className="pointer-events-none fixed inset-0 -z-10">
21 <div className="absolute inset-0 bg-[radial-gradient(1100px_circle_at_20%_10%,rgba(59,130,246,0.16),transparent_55%),radial-gradient(900px_circle_at_80%_15%,rgba(16,185,129,0.14),transparent_55%),radial-gradient(700px_circle_at_50%_90%,rgba(99,102,241,0.12),transparent_60%)]" />
22 <div className="absolute inset-0 bg-[linear-gradient(to_bottom,rgba(255,255,255,0.74),rgba(255,255,255,1))]" />
23 </div>
24 <GlossyPageShell>
25 <GlossyPageHeader
26 icon="eye"
27 eyebrow="Gallery"
28 title="Real published projects"
29 subtitle="See what's been built with Dominat8 — live sites generated, published, and running on custom domains."
30 ctaHref="/templates"
31 ctaLabel="Generate a project"
32 ctaIcon="rocket"
33 />
2434
25 <TopBar />
26 <HeaderNav />
27
28 <section className="mx-auto max-w-6xl px-6 pt-2 pb-10">
29 <div className="inline-flex items-center rounded-full bg-white/80 px-4 py-2 text-xs text-slate-700 ring-1 ring-slate-200 shadow-sm">
30 Gallery • real published projects • <span className="font-mono text-slate-500">{MONSTER_MARKER}</span>
31 </div>
32
33 <h1 className="mt-6 text-3xl font-semibold tracking-tight text-slate-950 md:text-5xl">
34 Real Published Gallery
35 </h1>
36 <p className="mt-4 max-w-3xl text-base leading-relaxed text-slate-700 md:text-lg">
37 Now with real preview thumbnails (SVG) generated from KV and cacheable via the thumb endpoint.
38 </p>
39
40 {cards.length === 0 ? (
41 <div className="mt-8 rounded-3xl bg-white/85 p-8 ring-1 ring-slate-200 shadow-sm">
42 <div className="text-sm font-semibold text-slate-950">Gallery is empty (index not set)</div>
43 <div className="mt-2 text-sm text-slate-700 leading-relaxed">
44 Set <span className="font-mono">gallery:index:v1</span> with published project IDs, then rebuild thumbnails.
45 </div>
35 {cards.length === 0 ? (
36 <div
37 style={{
38 borderRadius: 20,
39 padding: 28,
40 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
41 border: "1px solid rgba(255,255,255,0.10)",
42 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
43 }}
44 >
45 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
46 <GlossyIcon name="layers" size={38} />
47 <div style={{ fontSize: 16, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>Gallery is empty</div>
48 </div>
49 <p style={{ marginTop: 12, fontSize: 14, lineHeight: 1.6, color: "rgba(237,234,247,0.68)" }}>
50 No projects have been published to the gallery yet. Generate your first site to see it featured here.
51 </p>
4652
47 <div className="mt-6 rounded-2xl bg-slate-50 p-4 ring-1 ring-slate-200">
48 <div className="text-xs font-semibold text-slate-600">Next steps</div>
49 <ol className="mt-2 space-y-1 text-xs text-slate-700 list-decimal list-inside">
50 <li>POST IDs to <span className="font-mono">/api/gallery/admin/set-index</span></li>
51 <li>POST to <span className="font-mono">/api/gallery/admin/rebuild-previews</span></li>
52 </ol>
53 <div
54 style={{
55 marginTop: 16,
56 borderRadius: 14,
57 padding: 16,
58 background: "rgba(0,0,0,0.25)",
59 border: "1px solid rgba(255,255,255,0.08)",
60 }}
61 >
62 <div style={{ display: "flex", alignItems: "center", gap: 8, fontSize: 12, fontWeight: 800, color: "rgba(237,234,247,0.75)" }}>
63 <GlossyIconInline name="sparkle" size={14} />
64 Next steps
5365 </div>
66 <ol style={{ marginTop: 10, paddingLeft: 18, fontSize: 13, lineHeight: 1.8, color: "rgba(237,234,247,0.60)" }}>
67 <li>Generate a project from a template</li>
68 <li>Publish it to your domain</li>
69 <li>It will appear in this gallery automatically</li>
70 </ol>
71 </div>
5472
55 <div className="mt-6 flex flex-col gap-3 sm:flex-row">
56 <a className="rounded-2xl bg-slate-900 px-6 py-3 text-sm font-semibold text-white hover:bg-slate-800 shadow-sm" href="/p/new">
57 Generate a project
58 </a>
59 <a className="rounded-2xl bg-white px-6 py-3 text-sm font-semibold text-slate-900 ring-1 ring-slate-200 hover:bg-slate-50 shadow-sm" href="/__status">
60 Check deploy status
61 </a>
62 </div>
73 <div style={{ display: "flex", gap: 10, flexWrap: "wrap", marginTop: 18 }}>
74 <Link
75 href="/templates"
76 style={{
77 display: "inline-flex",
78 alignItems: "center",
79 gap: 8,
80 padding: "10px 16px",
81 borderRadius: 14,
82 textDecoration: "none",
83 fontWeight: 800,
84 fontSize: 13,
85 color: "#07070B",
86 background: "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))",
87 boxShadow: "0 18px 55px rgba(168,85,247,0.20)",
88 border: "1px solid rgba(255,255,255,0.10)",
89 }}
90 >
91 <GlossyIconInline name="rocket" size={14} /> Generate a project
92 </Link>
6393 </div>
64 ) : (
65 <div className="mt-10 grid gap-5 md:grid-cols-3">
66 {cards.map((c) => (
67 <a
68 key={c.projectId}
69 href={c.url || ("/p/" + c.projectId)}
70 className="group overflow-hidden rounded-3xl bg-white/85 ring-1 ring-slate-200 shadow-sm hover:bg-white transition"
94 </div>
95 ) : (
96 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
97 {cards.map((c) => (
98 <a
99 key={c.projectId}
100 href={c.url || ("/p/" + c.projectId)}
101 style={{
102 display: "block",
103 borderRadius: 20,
104 overflow: "hidden",
105 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
106 border: "1px solid rgba(255,255,255,0.10)",
107 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
108 textDecoration: "none",
109 color: "inherit",
110 }}
111 >
112 <div
113 style={{
114 height: 140,
115 background:
116 "radial-gradient(600px circle at 30% 20%, rgba(168,85,247,0.20), transparent 55%), radial-gradient(500px circle at 80% 60%, rgba(59,130,246,0.15), transparent 55%)",
117 display: "flex",
118 alignItems: "center",
119 justifyContent: "center",
120 borderBottom: "1px solid rgba(255,255,255,0.08)",
121 }}
71122 >
72 <div className="h-36 bg-white">
73 <img
74 alt={c.title}
75 className="h-full w-full object-cover"
76 src={"/api/gallery/thumb?projectId=" + encodeURIComponent(c.projectId) + "&v=" + encodeURIComponent(MONSTER_MARKER)}
77 />
123 <GlossyIcon name="globe" size={44} />
124 </div>
125 <div style={{ padding: 18 }}>
126 <div style={{ fontSize: 11, color: "rgba(237,234,247,0.55)", display: "flex", alignItems: "center", gap: 6 }}>
127 <GlossyIconInline name={c.hasPublished ? "check" : "eye"} size={12} />
128 {c.hasPublished ? "Published" : "Indexed"}
78129 </div>
79
80 <div className="p-6">
81 <div className="text-xs text-slate-500">
82 {c.hasPublished ? "Published" : "Indexed"} • Project {c.projectId}
83 </div>
84 <div className="mt-2 text-lg font-semibold text-slate-950">{c.title}</div>
85 <div className="mt-2 text-sm leading-relaxed text-slate-700">{c.desc}</div>
86
87 <div className="mt-5 text-sm font-semibold text-slate-900 group-hover:underline">
88 Open →
89 </div>
130 <div style={{ marginTop: 8, fontSize: 16, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{c.title}</div>
131 <div style={{ marginTop: 6, fontSize: 13, lineHeight: 1.55, color: "rgba(237,234,247,0.65)" }}>{c.desc}</div>
132 <div
133 style={{
134 marginTop: 14,
135 fontSize: 13,
136 fontWeight: 800,
137 color: "rgba(200,170,255,0.90)",
138 display: "flex",
139 alignItems: "center",
140 gap: 6,
141 }}
142 >
143 <GlossyIconInline name="arrow-right" size={14} /> Open
90144 </div>
91 </a>
92 ))}
93 </div>
94 )}
95 </section>
96
97 <Footer />
98 </main>
145 </div>
146 </a>
147 ))}
148 </div>
149 )}
150 </GlossyPageShell>
99151 );
100152}
Deletedsrc/app/(marketing)/pricing/page.jsx+0−129View fileUnifiedSplit
@@ -1,129 +0,0 @@
1import { PageHeader, SectionHeader, LogoCloud, FAQAccordion } from "../../../components/marketing/MarketingShell";
2
3function PriceCard({ name, price, note, bullets, primary, ctaText, ctaHref, badge }) {
4 return (
5 <div className={primary ? "rounded-3xl bg-slate-900 p-6 text-white shadow-sm" : "rounded-3xl bg-white/90 p-6 ring-1 ring-slate-200 shadow-sm"}>
6 {badge ? (
7 <div className={primary ? "inline-flex items-center rounded-full bg-white/10 px-3 py-1 text-xs text-white/80 ring-1 ring-white/15" : "inline-flex items-center rounded-full bg-slate-900 px-3 py-1 text-xs text-white ring-1 ring-slate-900"}>
8 {badge}
9 </div>
10 ) : null}
11
12 <div className={primary ? "mt-3 text-xs text-white/70" : "mt-3 text-xs text-slate-500"}>{name}</div>
13 <div className={primary ? "mt-2 text-3xl font-semibold" : "mt-2 text-3xl font-semibold text-slate-950"}>{price}</div>
14 <div className={primary ? "mt-2 text-sm text-white/75" : "mt-2 text-sm text-slate-700"}>{note}</div>
15
16 <ul className={primary ? "mt-5 space-y-2 text-sm text-white/80" : "mt-5 space-y-2 text-sm text-slate-700"}>
17 {bullets.map((b) => <li key={b}>• {b}</li>)}
18 </ul>
19
20 <a
21 className={primary
22 ? "mt-6 inline-flex w-full justify-center rounded-2xl bg-white px-4 py-3 text-sm font-semibold text-slate-900 hover:bg-white/90"
23 : "mt-6 inline-flex w-full justify-center rounded-2xl bg-slate-900 px-4 py-3 text-sm font-semibold text-white hover:bg-slate-800"}
24 href={ctaHref}
25 >
26 {ctaText}
27 </a>
28 </div>
29 );
30}
31
32export default function PricingPage() {
33 const faq = [
34 { q: "Do I need to be a designer?", a: "No. The system uses proven layout rhythm and spacing so your site looks premium by default." },
35 { q: "How do I know production updated?", a: "Open /__status and compare the marker. If it changed, production changed." },
36 { q: "Why do we build-gate upgrades?", a: "So you never lose time to silent deploy pins. Green builds only = shipping confidence." },
37 { q: "Can I map my domain?", a: "Yes — the platform is designed to publish and map to your domain when ready." }
38 ];
39
40 return (
41 <main>
42 <PageHeader
43 eyebrow="Pricing"
44 title="Simple pricing, premium output"
45 subtitle="Start free. Upgrade when you want full automation and faster publishing. Clear tiers, no confusion."
46 rightSlot={
47 <a className="rounded-2xl bg-slate-900 px-5 py-3 text-sm font-semibold text-white hover:bg-slate-800 shadow-sm" href="/p/new">
48 Generate my site
49 </a>
50 }
51 />
52
53 <LogoCloud label="Trusted premium SaaS rhythm" />
54
55 <div className="mx-auto max-w-6xl px-6 pb-12">
56 <div className="grid gap-5 md:grid-cols-3">
57 <PriceCard
58 name="Free"
59 price="$0"
60 note="Perfect to test the pipeline."
61 bullets={["Generate a site spec", "Preview marketing pages", "Basic publish flow"]}
62 ctaText="Start free"
63 ctaHref="/p/new"
64 />
65
66 <PriceCard
67 name="Pro"
68 price="$29"
69 note="Ship faster with full automation."
70 bullets={["Auto-run pipeline", "SEO plan + sitemap", "Publish artifacts"]}
71 primary
72 badge="Most popular"
73 ctaText="Go Pro"
74 ctaHref="/p/new"
75 />
76
77 <PriceCard
78 name="Business"
79 price="$99"
80 note="For teams & higher volume."
81 bullets={["Multiple sites", "Priority pipeline", "Advanced controls"]}
82 ctaText="Talk to us"
83 ctaHref="/contact"
84 />
85 </div>
86 </div>
87
88 <div className="pb-12">
89 <SectionHeader
90 eyebrow="Included"
91 title="What you’re really paying for"
92 subtitle="A pipeline that stays consistent, builds cleanly, and publishes confidently."
93 linkText="Explore templates"
94 linkHref="/templates"
95 />
96 <div className="mx-auto max-w-6xl px-6 pt-8">
97 <div className="rounded-3xl bg-white/85 p-8 ring-1 ring-slate-200 shadow-sm">
98 <div className="grid gap-5 md:grid-cols-3">
99 <div className="rounded-2xl bg-white p-6 ring-1 ring-slate-200">
100 <div className="text-sm font-semibold text-slate-950">Premium structure</div>
101 <div className="mt-2 text-sm text-slate-700">Hero rhythm, trust strip, features, proof, CTA ladder.</div>
102 </div>
103 <div className="rounded-2xl bg-white p-6 ring-1 ring-slate-200">
104 <div className="text-sm font-semibold text-slate-950">SEO included</div>
105 <div className="mt-2 text-sm text-slate-700">Titles, metas, schema, sitemap/robots — built into the flow.</div>
106 </div>
107 <div className="rounded-2xl bg-white p-6 ring-1 ring-slate-200">
108 <div className="text-sm font-semibold text-slate-950">Build-gated shipping</div>
109 <div className="mt-2 text-sm text-slate-700">No more “did it deploy?” — green builds only.</div>
110 </div>
111 </div>
112 </div>
113 </div>
114 </div>
115
116 <div className="mx-auto max-w-6xl px-6 pb-16">
117 <div className="rounded-3xl bg-white/85 p-8 ring-1 ring-slate-200 shadow-sm">
118 <div className="text-xs font-semibold text-slate-600">FAQ</div>
119 <h2 className="mt-2 text-2xl font-semibold tracking-tight text-slate-950 md:text-3xl">
120 Clear answers
121 </h2>
122 <div className="mt-6">
123 <FAQAccordion items={faq} />
124 </div>
125 </div>
126 </div>
127 </main>
128 );
129}
Modifiedsrc/app/(marketing)/pricing/page.tsx+205−41View fileUnifiedSplit
@@ -1,52 +1,216 @@
1import GlossyPageShell, { GlossyPageHeader, GlossyCard } from "@/components/ui/GlossyPageShell";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
13import Link from "next/link";
2import { D8Section } from "../_d8/D8Section";
3import { D8Card } from "../_d8/D8Bits";
44
5export default function Page() {
5export const metadata = {
6 title: "Pricing — Dominat8",
7 description: "Simple pricing, premium output. Start free, upgrade when you want full automation.",
8};
9
10function PriceCard({
11 name,
12 price,
13 note,
14 bullets,
15 primary,
16 badge,
17 ctaText,
18 ctaHref,
19 icon,
20}: {
21 name: string;
22 price: string;
23 note: string;
24 bullets: string[];
25 primary?: boolean;
26 badge?: string;
27 ctaText: string;
28 ctaHref: string;
29 icon: "star" | "zap" | "rocket";
30}) {
631 return (
7 <main
32 <div
833 style={{
9 minHeight: "100vh",
10 background:
11 "radial-gradient(1200px 800px at 65% 5%, rgba(168,85,247,0.20), rgba(0,0,0,0) 60%), radial-gradient(900px 700px at 15% 20%, rgba(59,130,246,0.12), rgba(0,0,0,0) 62%), linear-gradient(180deg, #07070B 0%, #07070B 40%, #05050A 100%)",
12 color: "#EDEAF7",
13 fontFamily:
14 "ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji'",
15 padding: "28px 16px 56px",
34 borderRadius: 20,
35 padding: 24,
36 background: primary
37 ? "linear-gradient(180deg, rgba(168,85,247,0.15), rgba(59,130,246,0.08))"
38 : "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
39 border: primary
40 ? "1px solid rgba(168,85,247,0.30)"
41 : "1px solid rgba(255,255,255,0.10)",
42 boxShadow: primary
43 ? "0 30px 90px rgba(168,85,247,0.15), 0 20px 55px rgba(0,0,0,0.35)"
44 : "0 18px 55px rgba(0,0,0,0.35)",
45 position: "relative",
46 display: "flex",
47 flexDirection: "column",
1648 }}
1749 >
18 <div style={{ width: "100%", maxWidth: 1160, margin: "0 auto" }}>
19 <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12, padding: "10px 0 18px" }}>
20 <Link href="/" style={{ color: "rgba(243,238,255,0.95)", textDecoration: "none", fontWeight: 900, letterSpacing: "0.14em", textTransform: "uppercase", fontSize: 12 }}>
21 Dominat8
22 </Link>
23 <div style={{ display: "flex", gap: 10, flexWrap: "wrap" }}>
24 <Link href="/templates" style={{ color: "rgba(237,234,247,0.82)", textDecoration: "none", padding: "8px 10px", borderRadius: 10, border: "1px solid rgba(255,255,255,0.08)", background: "rgba(255,255,255,0.03)", fontSize: 13 }}>
25 Templates
26 </Link>
27 <Link href="/pricing" style={{ color: "rgba(237,234,247,0.82)", textDecoration: "none", padding: "8px 10px", borderRadius: 10, border: "1px solid rgba(255,255,255,0.08)", background: "rgba(255,255,255,0.03)", fontSize: 13 }}>
28 Pricing
29 </Link>
30 </div>
50 {badge && (
51 <div
52 style={{
53 display: "inline-flex",
54 alignItems: "center",
55 gap: 6,
56 padding: "6px 10px",
57 borderRadius: 999,
58 background: "linear-gradient(90deg, rgba(168,85,247,0.25), rgba(59,130,246,0.15))",
59 border: "1px solid rgba(255,255,255,0.12)",
60 fontSize: 10,
61 fontWeight: 800,
62 letterSpacing: "0.12em",
63 textTransform: "uppercase",
64 color: "rgba(237,234,247,0.90)",
65 marginBottom: 10,
66 alignSelf: "flex-start",
67 }}
68 >
69 <GlossyIconInline name="sparkle" size={12} />
70 {badge}
3171 </div>
72 )}
3273
33 <D8Section eyebrow="Premium SaaS" title="Pricing" lead="Choose a plan and ship a premium site quickly — with consistent section framing and depth." tone="glass">
34 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, minmax(0, 1fr))", gap: 12 }}>
35 <D8Card title="Consistent sections" body="Premium framing and hierarchy across marketing pages." kicker="SYSTEM" />
36 <D8Card title="Inline-safe" body="Core content renders intentionally even if utility classes fail." kicker="LOCKED" />
37 <D8Card title="Conversion-first" body="Clear CTAs and predictable page rhythm." kicker="CONVERT" />
38 </div>
39 </D8Section>
40
41 <div style={{ marginTop: 34, opacity: 0.85, fontSize: 12, color: "rgba(237,234,247,0.65)", display: "flex", justifyContent: "space-between", gap: 12, flexWrap: "wrap" }}>
42 <div>© 2026 Dominat8</div>
43 <div style={{ display: "flex", gap: 14, flexWrap: "wrap" }}>
44 <Link href="/privacy" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Privacy</Link>
45 <Link href="/terms" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Terms</Link>
46 <Link href="/contact" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Contact</Link>
74 <GlossyIcon name={icon} size={40} />
75 <div style={{ marginTop: 12, fontSize: 12, fontWeight: 700, letterSpacing: "0.10em", textTransform: "uppercase", color: "rgba(237,234,247,0.60)" }}>{name}</div>
76 <div style={{ marginTop: 6, fontSize: 36, fontWeight: 900, color: "#F6F2FF" }}>{price}</div>
77 <div style={{ marginTop: 6, fontSize: 13, color: "rgba(237,234,247,0.65)" }}>{note}</div>
78
79 <ul style={{ marginTop: 16, listStyle: "none", padding: 0, flex: 1 }}>
80 {bullets.map((b) => (
81 <li key={b} style={{ display: "flex", alignItems: "center", gap: 8, marginTop: 8, fontSize: 13, color: "rgba(237,234,247,0.78)" }}>
82 <GlossyIconInline name="check" size={14} />
83 {b}
84 </li>
85 ))}
86 </ul>
87
88 <Link
89 href={ctaHref}
90 style={{
91 display: "inline-flex",
92 alignItems: "center",
93 justifyContent: "center",
94 gap: 8,
95 marginTop: 20,
96 padding: "12px 16px",
97 borderRadius: 14,
98 textDecoration: "none",
99 fontWeight: 800,
100 fontSize: 14,
101 color: primary ? "#07070B" : "rgba(237,234,247,0.90)",
102 background: primary
103 ? "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))"
104 : "rgba(255,255,255,0.06)",
105 boxShadow: primary
106 ? "0 18px 55px rgba(168,85,247,0.20), 0 10px 24px rgba(59,130,246,0.12)"
107 : "0 10px 30px rgba(0,0,0,0.25)",
108 border: "1px solid rgba(255,255,255,0.10)",
109 }}
110 >
111 <GlossyIconInline name="arrow-right" size={14} />
112 {ctaText}
113 </Link>
114 </div>
115 );
116}
117
118const faq = [
119 { q: "Do I need to be a designer?", a: "No. The system uses proven layout rhythm and spacing so your site looks premium by default." },
120 { q: "Can I map my domain?", a: "Yes — the platform is designed to publish and map to your custom domain when ready." },
121 { q: "What if I need changes?", a: "Iterate freely. Swap sections, edit copy, reorder — then redeploy with confidence." },
122 { q: "Is there a free trial?", a: "Start free. Generate your first site spec and preview it before committing to a paid plan." },
123];
124
125export default function PricingPage() {
126 return (
127 <GlossyPageShell>
128 <GlossyPageHeader
129 icon="credit-card"
130 eyebrow="Pricing"
131 title="Simple pricing, premium output"
132 subtitle="Start free. Upgrade when you want full automation and faster publishing. Clear tiers, no confusion."
133 ctaHref="/templates"
134 ctaLabel="Start free"
135 ctaIcon="rocket"
136 />
137
138 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
139 <PriceCard
140 icon="star"
141 name="Free"
142 price="$0"
143 note="Perfect to test the pipeline."
144 bullets={["Generate a site spec", "Preview marketing pages", "Basic publish flow"]}
145 ctaText="Start free"
146 ctaHref="/templates"
147 />
148 <PriceCard
149 icon="zap"
150 name="Pro"
151 price="$29"
152 note="Ship faster with full automation."
153 bullets={["Auto-run pipeline", "SEO plan + sitemap", "Publish artifacts", "Priority generation"]}
154 primary
155 badge="Most popular"
156 ctaText="Go Pro"
157 ctaHref="/templates"
158 />
159 <PriceCard
160 icon="rocket"
161 name="Business"
162 price="$99"
163 note="For teams & higher volume."
164 bullets={["Multiple sites", "Priority pipeline", "Advanced controls", "Dedicated support"]}
165 ctaText="Talk to us"
166 ctaHref="/contact"
167 />
168 </div>
169
170 <section style={{ marginTop: 32 }}>
171 <div style={{ display: "flex", alignItems: "center", gap: 10, marginBottom: 18 }}>
172 <GlossyIcon name="shield" size={34} />
173 <div>
174 <div style={{ fontSize: 11, fontWeight: 800, letterSpacing: "0.12em", textTransform: "uppercase", color: "rgba(237,234,247,0.60)" }}>Included</div>
175 <div style={{ fontSize: 20, fontWeight: 900, color: "#F6F2FF" }}>What you get with every plan</div>
47176 </div>
48177 </div>
49 </div>
50 </main>
178 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
179 <GlossyCard icon="layers" title="Premium structure">
180 Hero rhythm, trust strip, features, proof, CTA ladder — built in by default.
181 </GlossyCard>
182 <GlossyCard icon="chart" title="SEO included">
183 Titles, metas, schema, sitemap/robots — built into the generation flow.
184 </GlossyCard>
185 <GlossyCard icon="lock" title="Build-gated shipping">
186 Nothing deploys unless the build is green. No silent failures.
187 </GlossyCard>
188 </div>
189 </section>
190
191 <section style={{ marginTop: 32 }}>
192 <div style={{ display: "flex", alignItems: "center", gap: 10, marginBottom: 18 }}>
193 <GlossyIcon name="question" size={34} />
194 <div style={{ fontSize: 20, fontWeight: 900, color: "#F6F2FF" }}>FAQ</div>
195 </div>
196 <div style={{ display: "grid", gridTemplateColumns: "repeat(2, 1fr)", gap: 14 }}>
197 {faq.map((item) => (
198 <div
199 key={item.q}
200 style={{
201 borderRadius: 16,
202 padding: 18,
203 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
204 border: "1px solid rgba(255,255,255,0.10)",
205 boxShadow: "0 12px 40px rgba(0,0,0,0.25)",
206 }}
207 >
208 <div style={{ fontSize: 14, fontWeight: 800, color: "rgba(237,234,247,0.92)" }}>{item.q}</div>
209 <div style={{ marginTop: 8, fontSize: 13, lineHeight: 1.55, color: "rgba(237,234,247,0.65)" }}>{item.a}</div>
210 </div>
211 ))}
212 </div>
213 </section>
214 </GlossyPageShell>
51215 );
52}
\ No newline at end of file
216}
Modifiedsrc/app/(marketing)/privacy/page.tsx+85−45View fileUnifiedSplit
@@ -1,52 +1,92 @@
1import Link from "next/link";
2import { D8Section } from "../_d8/D8Section";
3import { D8Card } from "../_d8/D8Bits";
1import GlossyPageShell, { GlossyPageHeader } from "@/components/ui/GlossyPageShell";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
43
5export default function Page() {
4export const metadata = {
5 title: "Privacy Policy — Dominat8",
6 description: "How Dominat8 handles your data and privacy.",
7};
8
9const sections = [
10 {
11 icon: "eye" as const,
12 title: "Information We Collect",
13 body: "We collect information you provide directly: email, name, and project data when you create an account. We also collect usage data like page views and feature usage to improve the product.",
14 },
15 {
16 icon: "shield" as const,
17 title: "How We Use Your Data",
18 body: "Your data is used to provide and improve Dominat8 services — generating sites, managing projects, processing payments, and sending relevant updates. We never sell your personal data.",
19 },
20 {
21 icon: "lock" as const,
22 title: "Data Security",
23 body: "We use industry-standard encryption, secure hosting on Vercel, and follow best practices for data protection. Your project data is stored securely and only accessible to you.",
24 },
25 {
26 icon: "globe" as const,
27 title: "Third-Party Services",
28 body: "We use Stripe for payments, Clerk for authentication, and Vercel for hosting. Each provider has their own privacy policy and handles data according to their terms.",
29 },
30 {
31 icon: "users" as const,
32 title: "Your Rights",
33 body: "You can request access to, correction of, or deletion of your personal data at any time. Contact us at support@dominat8.com for any privacy-related requests.",
34 },
35 {
36 icon: "document" as const,
37 title: "Changes to This Policy",
38 body: "We may update this policy periodically. Changes will be posted on this page with an updated date. Continued use of Dominat8 constitutes acceptance of the updated policy.",
39 },
40];
41
42export default function PrivacyPage() {
643 return (
7 <main
8 style={{
9 minHeight: "100vh",
10 background:
11 "radial-gradient(1200px 800px at 65% 5%, rgba(168,85,247,0.20), rgba(0,0,0,0) 60%), radial-gradient(900px 700px at 15% 20%, rgba(59,130,246,0.12), rgba(0,0,0,0) 62%), linear-gradient(180deg, #07070B 0%, #07070B 40%, #05050A 100%)",
12 color: "#EDEAF7",
13 fontFamily:
14 "ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji'",
15 padding: "28px 16px 56px",
16 }}
17 >
18 <div style={{ width: "100%", maxWidth: 1160, margin: "0 auto" }}>
19 <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12, padding: "10px 0 18px" }}>
20 <Link href="/" style={{ color: "rgba(243,238,255,0.95)", textDecoration: "none", fontWeight: 900, letterSpacing: "0.14em", textTransform: "uppercase", fontSize: 12 }}>
21 Dominat8
22 </Link>
23 <div style={{ display: "flex", gap: 10, flexWrap: "wrap" }}>
24 <Link href="/templates" style={{ color: "rgba(237,234,247,0.82)", textDecoration: "none", padding: "8px 10px", borderRadius: 10, border: "1px solid rgba(255,255,255,0.08)", background: "rgba(255,255,255,0.03)", fontSize: 13 }}>
25 Templates
26 </Link>
27 <Link href="/pricing" style={{ color: "rgba(237,234,247,0.82)", textDecoration: "none", padding: "8px 10px", borderRadius: 10, border: "1px solid rgba(255,255,255,0.08)", background: "rgba(255,255,255,0.03)", fontSize: 13 }}>
28 Pricing
29 </Link>
30 </div>
31 </div>
44 <GlossyPageShell>
45 <GlossyPageHeader
46 icon="shield"
47 eyebrow="Legal"
48 title="Privacy Policy"
49 subtitle="How we handle your data. Clear, readable, and transparent."
50 />
3251
33 <D8Section eyebrow="Premium SaaS" title="Privacy" lead="Policies presented with the same premium framing as the rest of the site." tone="glass">
34 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, minmax(0, 1fr))", gap: 12 }}>
35 <D8Card title="Consistent sections" body="Premium framing and hierarchy across marketing pages." kicker="SYSTEM" />
36 <D8Card title="Inline-safe" body="Core content renders intentionally even if utility classes fail." kicker="LOCKED" />
37 <D8Card title="Conversion-first" body="Clear CTAs and predictable page rhythm." kicker="CONVERT" />
52 <div style={{ display: "grid", gap: 14 }}>
53 {sections.map((s) => (
54 <div
55 key={s.title}
56 style={{
57 borderRadius: 18,
58 padding: 22,
59 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
60 border: "1px solid rgba(255,255,255,0.10)",
61 boxShadow: "0 12px 40px rgba(0,0,0,0.25)",
62 }}
63 >
64 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
65 <GlossyIcon name={s.icon} size={34} />
66 <div style={{ fontSize: 15, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{s.title}</div>
67 </div>
68 <p style={{ marginTop: 10, fontSize: 14, lineHeight: 1.65, color: "rgba(237,234,247,0.68)" }}>{s.body}</p>
3869 </div>
39 </D8Section>
70 ))}
71 </div>
4072
41 <div style={{ marginTop: 34, opacity: 0.85, fontSize: 12, color: "rgba(237,234,247,0.65)", display: "flex", justifyContent: "space-between", gap: 12, flexWrap: "wrap" }}>
42 <div>© 2026 Dominat8</div>
43 <div style={{ display: "flex", gap: 14, flexWrap: "wrap" }}>
44 <Link href="/privacy" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Privacy</Link>
45 <Link href="/terms" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Terms</Link>
46 <Link href="/contact" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Contact</Link>
47 </div>
48 </div>
73 <div
74 style={{
75 marginTop: 24,
76 borderRadius: 16,
77 padding: 18,
78 background: "rgba(255,255,255,0.03)",
79 border: "1px solid rgba(255,255,255,0.08)",
80 fontSize: 13,
81 color: "rgba(237,234,247,0.55)",
82 display: "flex",
83 alignItems: "center",
84 gap: 8,
85 }}
86 >
87 <GlossyIconInline name="clock" size={14} />
88 Last updated: February 2026
4989 </div>
50 </main>
90 </GlossyPageShell>
5191 );
52}
\ No newline at end of file
92}
Deletedsrc/app/(marketing)/templates/page.jsx+0−69View fileUnifiedSplit
@@ -1,69 +0,0 @@
1import { PageHeader, SectionHeader, TemplateGalleryCard, LogoCloud } from "../../../components/marketing/MarketingShell";
2
3export default function TemplatesPage() {
4 return (
5 <main>
6 <PageHeader
7 eyebrow="Templates"
8 title="Premium templates, ready to ship"
9 subtitle="Pick a direction. The system generates a complete site from your brief — then polishes it into something that looks expensive."
10 rightSlot={
11 <a className="rounded-2xl bg-slate-900 px-5 py-3 text-sm font-semibold text-white hover:bg-slate-800 shadow-sm" href="/p/new">
12 Start generating
13 </a>
14 }
15 />
16
17 <LogoCloud label="Designed for conversion rhythm" />
18
19 <SectionHeader
20 eyebrow="Gallery"
21 title="Choose a starting point"
22 subtitle="These are structured patterns. Your content and branding makes it yours."
23 linkText="See pricing"
24 linkHref="/pricing"
25 />
26
27 <div className="mx-auto max-w-6xl px-6 pt-8 pb-14">
28 <div className="grid gap-5 md:grid-cols-3">
29 <TemplateGalleryCard
30 tag="Default"
31 title="AI SaaS Website"
32 desc="Clean SaaS layout: hero, proof, features, pricing, FAQ, CTA."
33 href="/p/new"
34 />
35 <TemplateGalleryCard
36 tag="High trust"
37 title="Local Service"
38 desc="Trust-first layout: outcomes, testimonials, areas served, contact."
39 href="/p/new"
40 />
41 <TemplateGalleryCard
42 tag="Showcase"
43 title="Creator / Portfolio"
44 desc="Highlights, case studies, gallery, and social proof."
45 href="/p/new"
46 />
47 <TemplateGalleryCard
48 tag="Commerce"
49 title="Product Landing"
50 desc="Feature-led layout: benefits, comparison, proof, FAQ, CTA."
51 href="/p/new"
52 />
53 <TemplateGalleryCard
54 tag="B2B"
55 title="Agency"
56 desc="Services, proof, process, packages, and contact."
57 href="/p/new"
58 />
59 <TemplateGalleryCard
60 tag="Launch"
61 title="Coming Soon"
62 desc="Waitlist-first: clarity, benefits, trust, and CTA."
63 href="/p/new"
64 />
65 </div>
66 </div>
67 </main>
68 );
69}
Modifiedsrc/app/(marketing)/templates/page.tsx+164−44View fileUnifiedSplit
@@ -1,52 +1,172 @@
1import GlossyPageShell, { GlossyPageHeader } from "@/components/ui/GlossyPageShell";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
13import Link from "next/link";
2import { D8Section } from "../_d8/D8Section";
3import { D8Card } from "../_d8/D8Bits";
44
5export default function Page() {
5export const metadata = {
6 title: "Templates — Dominat8",
7 description: "Premium templates, ready to ship. Pick a direction and generate a complete site from your brief.",
8};
9
10const templates = [
11 {
12 icon: "cpu" as const,
13 tag: "DEFAULT",
14 title: "AI SaaS Website",
15 desc: "Clean SaaS layout: hero, proof, features, pricing, FAQ, CTA. Built for conversion from day one.",
16 },
17 {
18 icon: "shield" as const,
19 tag: "HIGH TRUST",
20 title: "Local Service",
21 desc: "Trust-first layout: outcomes, testimonials, areas served, contact. Perfect for service businesses.",
22 },
23 {
24 icon: "palette" as const,
25 tag: "SHOWCASE",
26 title: "Creator / Portfolio",
27 desc: "Highlights, case studies, gallery, and social proof. Show your best work front and center.",
28 },
29 {
30 icon: "target" as const,
31 tag: "COMMERCE",
32 title: "Product Landing",
33 desc: "Feature-led layout: benefits, comparison, proof, FAQ, CTA. Drive purchases and sign-ups.",
34 },
35 {
36 icon: "briefcase" as const,
37 tag: "B2B",
38 title: "Agency",
39 desc: "Services, proof, process, packages, and contact. Professional layout for client-facing businesses.",
40 },
41 {
42 icon: "rocket" as const,
43 tag: "LAUNCH",
44 title: "Coming Soon",
45 desc: "Waitlist-first: clarity, benefits, trust, and CTA. Build anticipation before you launch.",
46 },
47];
48
49export default function TemplatesPage() {
650 return (
7 <main
8 style={{
9 minHeight: "100vh",
10 background:
11 "radial-gradient(1200px 800px at 65% 5%, rgba(168,85,247,0.20), rgba(0,0,0,0) 60%), radial-gradient(900px 700px at 15% 20%, rgba(59,130,246,0.12), rgba(0,0,0,0) 62%), linear-gradient(180deg, #07070B 0%, #07070B 40%, #05050A 100%)",
12 color: "#EDEAF7",
13 fontFamily:
14 "ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji'",
15 padding: "28px 16px 56px",
16 }}
17 >
18 <div style={{ width: "100%", maxWidth: 1160, margin: "0 auto" }}>
19 <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12, padding: "10px 0 18px" }}>
20 <Link href="/" style={{ color: "rgba(243,238,255,0.95)", textDecoration: "none", fontWeight: 900, letterSpacing: "0.14em", textTransform: "uppercase", fontSize: 12 }}>
21 Dominat8
22 </Link>
23 <div style={{ display: "flex", gap: 10, flexWrap: "wrap" }}>
24 <Link href="/templates" style={{ color: "rgba(237,234,247,0.82)", textDecoration: "none", padding: "8px 10px", borderRadius: 10, border: "1px solid rgba(255,255,255,0.08)", background: "rgba(255,255,255,0.03)", fontSize: 13 }}>
25 Templates
26 </Link>
27 <Link href="/pricing" style={{ color: "rgba(237,234,247,0.82)", textDecoration: "none", padding: "8px 10px", borderRadius: 10, border: "1px solid rgba(255,255,255,0.08)", background: "rgba(255,255,255,0.03)", fontSize: 13 }}>
28 Pricing
29 </Link>
30 </div>
31 </div>
51 <GlossyPageShell>
52 <GlossyPageHeader
53 icon="layers"
54 eyebrow="Templates"
55 title="Premium templates, ready to ship"
56 subtitle="Pick a direction. The system generates a complete site from your brief — then polishes it into something that looks expensive."
57 ctaHref="/templates"
58 ctaLabel="Start generating"
59 ctaIcon="sparkle"
60 />
3261
33 <D8Section eyebrow="Premium SaaS" title="Templates" lead="Start with a proven layout, then refine. Premium framing keeps everything cohesive." tone="glass">
34 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, minmax(0, 1fr))", gap: 12 }}>
35 <D8Card title="Consistent sections" body="Premium framing and hierarchy across marketing pages." kicker="SYSTEM" />
36 <D8Card title="Inline-safe" body="Core content renders intentionally even if utility classes fail." kicker="LOCKED" />
37 <D8Card title="Conversion-first" body="Clear CTAs and predictable page rhythm." kicker="CONVERT" />
38 </div>
39 </D8Section>
62 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
63 {templates.map((t) => (
64 <div
65 key={t.title}
66 style={{
67 borderRadius: 20,
68 overflow: "hidden",
69 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
70 border: "1px solid rgba(255,255,255,0.10)",
71 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
72 }}
73 >
74 {/* Gradient preview area */}
75 <div
76 style={{
77 height: 120,
78 background:
79 "radial-gradient(600px circle at 30% 20%, rgba(168,85,247,0.20), transparent 55%), radial-gradient(500px circle at 80% 60%, rgba(59,130,246,0.15), transparent 55%)",
80 display: "flex",
81 alignItems: "center",
82 justifyContent: "center",
83 borderBottom: "1px solid rgba(255,255,255,0.08)",
84 }}
85 >
86 <GlossyIcon name={t.icon} size={52} />
87 </div>
4088
41 <div style={{ marginTop: 34, opacity: 0.85, fontSize: 12, color: "rgba(237,234,247,0.65)", display: "flex", justifyContent: "space-between", gap: 12, flexWrap: "wrap" }}>
42 <div>© 2026 Dominat8</div>
43 <div style={{ display: "flex", gap: 14, flexWrap: "wrap" }}>
44 <Link href="/privacy" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Privacy</Link>
45 <Link href="/terms" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Terms</Link>
46 <Link href="/contact" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Contact</Link>
89 <div style={{ padding: 18 }}>
90 <div
91 style={{
92 display: "inline-flex",
93 alignItems: "center",
94 gap: 6,
95 padding: "4px 8px",
96 borderRadius: 999,
97 background: "rgba(168,85,247,0.12)",
98 border: "1px solid rgba(255,255,255,0.08)",
99 fontSize: 10,
100 fontWeight: 800,
101 letterSpacing: "0.14em",
102 textTransform: "uppercase",
103 color: "rgba(237,234,247,0.75)",
104 }}
105 >
106 <GlossyIconInline name={t.icon} size={10} />
107 {t.tag}
108 </div>
109 <div style={{ marginTop: 10, fontSize: 16, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{t.title}</div>
110 <div style={{ marginTop: 6, fontSize: 13, lineHeight: 1.55, color: "rgba(237,234,247,0.65)" }}>{t.desc}</div>
111 <Link
112 href="/templates"
113 style={{
114 display: "inline-flex",
115 alignItems: "center",
116 gap: 6,
117 marginTop: 14,
118 fontSize: 13,
119 fontWeight: 800,
120 color: "rgba(200,170,255,0.90)",
121 textDecoration: "none",
122 }}
123 >
124 <GlossyIconInline name="arrow-right" size={14} /> Preview
125 </Link>
126 </div>
47127 </div>
48 </div>
128 ))}
49129 </div>
50 </main>
130
131 <section
132 style={{
133 marginTop: 32,
134 borderRadius: 20,
135 padding: 28,
136 background: "linear-gradient(135deg, rgba(168,85,247,0.10), rgba(59,130,246,0.06))",
137 border: "1px solid rgba(255,255,255,0.10)",
138 boxShadow: "0 20px 60px rgba(0,0,0,0.3)",
139 textAlign: "center",
140 }}
141 >
142 <GlossyIcon name="sparkle" size={48} style={{ margin: "0 auto" }} />
143 <div style={{ marginTop: 12, fontSize: 18, fontWeight: 900, color: "#F6F2FF" }}>
144 Don't see what you need?
145 </div>
146 <p style={{ marginTop: 8, fontSize: 14, color: "rgba(237,234,247,0.68)" }}>
147 Describe your business and the AI will generate a custom structure tailored to your needs.
148 </p>
149 <Link
150 href="/contact"
151 style={{
152 display: "inline-flex",
153 alignItems: "center",
154 gap: 8,
155 marginTop: 16,
156 padding: "12px 20px",
157 borderRadius: 14,
158 textDecoration: "none",
159 fontWeight: 800,
160 fontSize: 14,
161 color: "#07070B",
162 background: "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))",
163 boxShadow: "0 18px 55px rgba(168,85,247,0.26), 0 10px 24px rgba(59,130,246,0.16)",
164 border: "1px solid rgba(255,255,255,0.10)",
165 }}
166 >
167 <GlossyIconInline name="mail" size={16} /> Talk to us
168 </Link>
169 </section>
170 </GlossyPageShell>
51171 );
52}
\ No newline at end of file
172}
Modifiedsrc/app/(marketing)/terms/page.tsx+95−45View fileUnifiedSplit
@@ -1,52 +1,102 @@
1import Link from "next/link";
2import { D8Section } from "../_d8/D8Section";
3import { D8Card } from "../_d8/D8Bits";
1import GlossyPageShell, { GlossyPageHeader } from "@/components/ui/GlossyPageShell";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
43
5export default function Page() {
4export const metadata = {
5 title: "Terms of Service — Dominat8",
6 description: "Terms and conditions for using Dominat8.",
7};
8
9const sections = [
10 {
11 icon: "document" as const,
12 title: "Acceptance of Terms",
13 body: "By accessing or using Dominat8, you agree to be bound by these terms. If you don't agree, please don't use the service. We may update these terms from time to time.",
14 },
15 {
16 icon: "cpu" as const,
17 title: "Service Description",
18 body: "Dominat8 is an AI-powered website generation and publishing platform. We provide tools to generate, customize, and deploy websites. The AI generates content based on your inputs.",
19 },
20 {
21 icon: "users" as const,
22 title: "Your Account",
23 body: "You're responsible for maintaining the security of your account and all activities under it. Keep your credentials safe. Notify us immediately if you suspect unauthorized access.",
24 },
25 {
26 icon: "layers" as const,
27 title: "Content & Ownership",
28 body: "You retain ownership of the content you create. By using our service, you grant us a limited license to host and display your content as needed to provide the service.",
29 },
30 {
31 icon: "credit-card" as const,
32 title: "Billing & Payments",
33 body: "Paid plans are billed as described at purchase. You can cancel anytime. Refunds are handled on a case-by-case basis. Stripe handles all payment processing securely.",
34 },
35 {
36 icon: "shield" as const,
37 title: "Acceptable Use",
38 body: "Don't use Dominat8 for illegal activities, spam, or content that violates others' rights. We reserve the right to suspend accounts that violate these terms.",
39 },
40 {
41 icon: "lock" as const,
42 title: "Limitation of Liability",
43 body: "Dominat8 is provided 'as is.' We do our best to keep it running and secure, but we can't guarantee uninterrupted service or be liable for indirect damages.",
44 },
45 {
46 icon: "mail" as const,
47 title: "Contact",
48 body: "For questions about these terms, contact us at support@dominat8.com. We're here to help clarify anything.",
49 },
50];
51
52export default function TermsPage() {
653 return (
7 <main
8 style={{
9 minHeight: "100vh",
10 background:
11 "radial-gradient(1200px 800px at 65% 5%, rgba(168,85,247,0.20), rgba(0,0,0,0) 60%), radial-gradient(900px 700px at 15% 20%, rgba(59,130,246,0.12), rgba(0,0,0,0) 62%), linear-gradient(180deg, #07070B 0%, #07070B 40%, #05050A 100%)",
12 color: "#EDEAF7",
13 fontFamily:
14 "ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji'",
15 padding: "28px 16px 56px",
16 }}
17 >
18 <div style={{ width: "100%", maxWidth: 1160, margin: "0 auto" }}>
19 <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12, padding: "10px 0 18px" }}>
20 <Link href="/" style={{ color: "rgba(243,238,255,0.95)", textDecoration: "none", fontWeight: 900, letterSpacing: "0.14em", textTransform: "uppercase", fontSize: 12 }}>
21 Dominat8
22 </Link>
23 <div style={{ display: "flex", gap: 10, flexWrap: "wrap" }}>
24 <Link href="/templates" style={{ color: "rgba(237,234,247,0.82)", textDecoration: "none", padding: "8px 10px", borderRadius: 10, border: "1px solid rgba(255,255,255,0.08)", background: "rgba(255,255,255,0.03)", fontSize: 13 }}>
25 Templates
26 </Link>
27 <Link href="/pricing" style={{ color: "rgba(237,234,247,0.82)", textDecoration: "none", padding: "8px 10px", borderRadius: 10, border: "1px solid rgba(255,255,255,0.08)", background: "rgba(255,255,255,0.03)", fontSize: 13 }}>
28 Pricing
29 </Link>
30 </div>
31 </div>
54 <GlossyPageShell>
55 <GlossyPageHeader
56 icon="document"
57 eyebrow="Legal"
58 title="Terms of Service"
59 subtitle="Clear, readable terms with consistent hierarchy. No lawyer-speak."
60 />
3261
33 <D8Section eyebrow="Premium SaaS" title="Terms" lead="Clear, readable terms with consistent spacing and hierarchy." tone="glass">
34 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, minmax(0, 1fr))", gap: 12 }}>
35 <D8Card title="Consistent sections" body="Premium framing and hierarchy across marketing pages." kicker="SYSTEM" />
36 <D8Card title="Inline-safe" body="Core content renders intentionally even if utility classes fail." kicker="LOCKED" />
37 <D8Card title="Conversion-first" body="Clear CTAs and predictable page rhythm." kicker="CONVERT" />
62 <div style={{ display: "grid", gap: 14 }}>
63 {sections.map((s) => (
64 <div
65 key={s.title}
66 style={{
67 borderRadius: 18,
68 padding: 22,
69 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
70 border: "1px solid rgba(255,255,255,0.10)",
71 boxShadow: "0 12px 40px rgba(0,0,0,0.25)",
72 }}
73 >
74 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
75 <GlossyIcon name={s.icon} size={34} />
76 <div style={{ fontSize: 15, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{s.title}</div>
77 </div>
78 <p style={{ marginTop: 10, fontSize: 14, lineHeight: 1.65, color: "rgba(237,234,247,0.68)" }}>{s.body}</p>
3879 </div>
39 </D8Section>
80 ))}
81 </div>
4082
41 <div style={{ marginTop: 34, opacity: 0.85, fontSize: 12, color: "rgba(237,234,247,0.65)", display: "flex", justifyContent: "space-between", gap: 12, flexWrap: "wrap" }}>
42 <div>© 2026 Dominat8</div>
43 <div style={{ display: "flex", gap: 14, flexWrap: "wrap" }}>
44 <Link href="/privacy" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Privacy</Link>
45 <Link href="/terms" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Terms</Link>
46 <Link href="/contact" style={{ color: "rgba(237,234,247,0.70)", textDecoration: "none", borderBottom: "1px solid rgba(237,234,247,0.20)", paddingBottom: 2 }}>Contact</Link>
47 </div>
48 </div>
83 <div
84 style={{
85 marginTop: 24,
86 borderRadius: 16,
87 padding: 18,
88 background: "rgba(255,255,255,0.03)",
89 border: "1px solid rgba(255,255,255,0.08)",
90 fontSize: 13,
91 color: "rgba(237,234,247,0.55)",
92 display: "flex",
93 alignItems: "center",
94 gap: 8,
95 }}
96 >
97 <GlossyIconInline name="clock" size={14} />
98 Last updated: February 2026
4999 </div>
50 </main>
100 </GlossyPageShell>
51101 );
52}
\ No newline at end of file
102}
Deletedsrc/app/(marketing)/use-cases/page.jsx+0−41View fileUnifiedSplit
@@ -1,41 +0,0 @@
1import { PageHeader, CardGrid, Card, LogoCloud } from "../../../components/marketing/MarketingShell";
2
3export default function UseCasesPage() {
4 return (
5 <main>
6 <PageHeader
7 eyebrow="Use cases"
8 title="Built for people who need premium fast"
9 subtitle="If you need a website that looks expensive, ships fast, and stays consistent — this is for you."
10 rightSlot={
11 <a className="rounded-2xl bg-slate-900 px-5 py-3 text-sm font-semibold text-white hover:bg-slate-800 shadow-sm" href="/templates">
12 Explore templates
13 </a>
14 }
15 />
16
17 <LogoCloud label="Trusted rhythm across pages" />
18
19 <CardGrid>
20 <Card
21 title="Founders launching fast"
22 desc="Generate a real marketing site in minutes, not weeks. Iterate without breaking your build."
23 href="/pricing"
24 meta="Startup"
25 />
26 <Card
27 title="Agencies & freelancers"
28 desc="Deliver faster with a pipeline you can control. Keep every client site consistent."
29 href="/pricing"
30 meta="Production"
31 />
32 <Card
33 title="Local businesses"
34 desc="High trust pages, clean design, and clear CTAs — ready to publish on your domain."
35 href="/contact"
36 meta="Trust"
37 />
38 </CardGrid>
39 </main>
40 );
41}
Modifiedsrc/app/(marketing)/use-cases/page.tsx+138−22View fileUnifiedSplit
@@ -1,34 +1,150 @@
1import MarketingCTA from "@/src/components/marketing/MarketingCTA";
1import GlossyPageShell, { GlossyPageHeader, GlossyCard } from "@/components/ui/GlossyPageShell";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
3import Link from "next/link";
4
5export const metadata = {
6 title: "Use Cases — Dominat8",
7 description: "Built for people who need premium fast. From SaaS launches to local service pages.",
8};
29
310const cases = [
4 { title: "Launch a SaaS landing page", body: "Ship a polished homepage + pricing + FAQs that converts, then iterate nightly with proof checks." },
5 { title: "Local services & bookings", body: "Create a clear offer page with service areas, testimonials, and contact conversion paths." },
6 { title: "Agency client sites", body: "Repeatable structure + fast generation pipeline. Hook in custom domains and billing as you scale." },
7 { title: "Portfolio & personal brand", body: "Build credibility with case studies, outcomes, and a sharp CTA for leads." },
8 { title: "Product validation", body: "Test positioning quickly: swap copy, reorder sections, and redeploy with confidence." },
9 { title: "SEO foundation", body: "Start with safe canonical/metadata baselines, then wire in sitemap/robots/SEO plans next." },
11 {
12 icon: "rocket" as const,
13 title: "Founders launching fast",
14 desc: "Generate a real marketing site in minutes, not weeks. Iterate without breaking your build. Go from idea to live in a single session.",
15 tag: "STARTUP",
16 },
17 {
18 icon: "briefcase" as const,
19 title: "Agencies & freelancers",
20 desc: "Deliver faster with a pipeline you can control. Keep every client site consistent with proven templates and repeatable workflows.",
21 tag: "PRODUCTION",
22 },
23 {
24 icon: "shield" as const,
25 title: "Local businesses",
26 desc: "High trust pages, clean design, and clear CTAs — ready to publish on your domain. Service areas, testimonials, and contact built in.",
27 tag: "TRUST",
28 },
29 {
30 icon: "cpu" as const,
31 title: "SaaS landing pages",
32 desc: "Ship a polished homepage + pricing + FAQs that converts, then iterate with proof checks and A/B-ready section swapping.",
33 tag: "SAAS",
34 },
35 {
36 icon: "target" as const,
37 title: "Product validation",
38 desc: "Test positioning quickly: swap copy, reorder sections, and redeploy with confidence. Get market feedback before you build.",
39 tag: "VALIDATE",
40 },
41 {
42 icon: "chart" as const,
43 title: "SEO foundation",
44 desc: "Start with safe canonical/metadata baselines, then wire in sitemap/robots/SEO plans. Everything is built for search from day one.",
45 tag: "SEO",
46 },
1047];
1148
1249export default function UseCasesPage() {
1350 return (
14 <div className="space-y-10">
15 <section className="rounded-3xl border bg-white p-8 shadow-sm">
16 <h1 className="text-3xl font-semibold tracking-tight">Use cases</h1>
17 <p className="mt-3 max-w-2xl text-sm leading-6 opacity-80">
18 Dominat8 is built for speed and iteration: generate → deploy → verify → improve.
19 </p>
20 </section>
51 <GlossyPageShell>
52 <GlossyPageHeader
53 icon="briefcase"
54 eyebrow="Use Cases"
55 title="Built for people who need premium fast"
56 subtitle="If you need a website that looks expensive, ships fast, and stays consistent — this is for you."
57 ctaHref="/templates"
58 ctaLabel="Explore templates"
59 ctaIcon="layers"
60 />
2161
22 <section className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
62 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
2363 {cases.map((c) => (
24 <div key={c.title} className="rounded-3xl border bg-white p-6 shadow-sm">
25 <div className="text-sm font-semibold">{c.title}</div>
26 <p className="mt-2 text-sm leading-6 opacity-80">{c.body}</p>
64 <div
65 key={c.title}
66 style={{
67 borderRadius: 18,
68 padding: 22,
69 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
70 border: "1px solid rgba(255,255,255,0.10)",
71 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
72 }}
73 >
74 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
75 <GlossyIcon name={c.icon} size={40} />
76 <div
77 style={{
78 fontSize: 10,
79 fontWeight: 800,
80 letterSpacing: "0.14em",
81 textTransform: "uppercase",
82 color: "rgba(168,85,247,0.70)",
83 }}
84 >
85 {c.tag}
86 </div>
87 </div>
88 <div style={{ marginTop: 12, fontSize: 16, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{c.title}</div>
89 <div style={{ marginTop: 8, fontSize: 13, lineHeight: 1.6, color: "rgba(237,234,247,0.68)" }}>{c.desc}</div>
90 <Link
91 href="/pricing"
92 style={{
93 display: "inline-flex",
94 alignItems: "center",
95 gap: 6,
96 marginTop: 14,
97 fontSize: 13,
98 fontWeight: 800,
99 color: "rgba(200,170,255,0.90)",
100 textDecoration: "none",
101 }}
102 >
103 <GlossyIconInline name="arrow-right" size={14} /> Learn more
104 </Link>
27105 </div>
28106 ))}
29 </section>
107 </div>
30108
31 <MarketingCTA />
32 </div>
109 <section
110 style={{
111 marginTop: 32,
112 borderRadius: 20,
113 padding: 28,
114 background: "linear-gradient(135deg, rgba(168,85,247,0.10), rgba(59,130,246,0.06))",
115 border: "1px solid rgba(255,255,255,0.10)",
116 boxShadow: "0 20px 60px rgba(0,0,0,0.3)",
117 textAlign: "center",
118 }}
119 >
120 <GlossyIcon name="rocket" size={48} style={{ margin: "0 auto" }} />
121 <div style={{ marginTop: 12, fontSize: 18, fontWeight: 900, color: "#F6F2FF" }}>
122 Ready to ship?
123 </div>
124 <p style={{ marginTop: 8, fontSize: 14, color: "rgba(237,234,247,0.68)" }}>
125 Start free. Generate your first site in minutes.
126 </p>
127 <Link
128 href="/templates"
129 style={{
130 display: "inline-flex",
131 alignItems: "center",
132 gap: 8,
133 marginTop: 16,
134 padding: "12px 20px",
135 borderRadius: 14,
136 textDecoration: "none",
137 fontWeight: 800,
138 fontSize: 14,
139 color: "#07070B",
140 background: "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))",
141 boxShadow: "0 18px 55px rgba(168,85,247,0.26), 0 10px 24px rgba(59,130,246,0.16)",
142 border: "1px solid rgba(255,255,255,0.10)",
143 }}
144 >
145 <GlossyIconInline name="bolt" size={16} /> Get started
146 </Link>
147 </section>
148 </GlossyPageShell>
33149 );
34}
\ No newline at end of file
150}
Modifiedsrc/app/admin/agents/page.tsx+34−27View fileUnifiedSplit
@@ -1,5 +1,6 @@
11import Link from "next/link";
22import { ADMIN_DEFAULT_PROJECT_ID, getLatestBundleKv } from "@/lib/admin/kvAdmin";
3import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
34
45export const dynamic = "force-dynamic";
56
@@ -24,19 +25,28 @@ export default async function AdminAgents() {
2425 return (
2526 <div className="space-y-6">
2627 <div>
27 <div className="text-xs font-semibold tracking-wide text-white/60">AGENTS</div>
28 <h1 className="mt-2 text-2xl font-semibold tracking-tight">Agents & Bundles</h1>
29 <p className="mt-2 text-sm text-white/60">
30 KV-backed “latest bundle” status for <span className="text-white/80">{projectId}</span>.
28 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
29 <GlossyIcon name="cpu" size={36} />
30 <div>
31 <div className="text-xs font-semibold tracking-wide text-white/60">AGENTS</div>
32 <h1 className="mt-1 text-2xl font-semibold tracking-tight">Agents & Bundles</h1>
33 </div>
34 </div>
35 <p className="mt-3 text-sm text-white/60">
36 KV-backed “latest bundle” status for <span className="text-white/80">{projectId}</span>.
3137 </p>
3238 </div>
3339
3440 <div className="grid gap-4 md:grid-cols-2">
3541 <div className="rounded-3xl border border-white/10 bg-black/30 p-6">
36 <div className="text-sm font-semibold">Latest bundle</div>
42 <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
43 <GlossyIcon name="layers" size={30} />
44 <div className="text-sm font-semibold">Latest bundle</div>
45 </div>
3746
3847 {!latest && (
39 <div className="mt-3 text-sm text-white/60">
48 <div className="mt-3 text-sm text-white/60" style={{ display: "flex", alignItems: "center", gap: 8 }}>
49 <GlossyIconInline name="clock" size={16} />
4050 No bundle records found yet. Run a bundle once and this page will populate.
4151 </div>
4252 )}
@@ -45,19 +55,19 @@ export default async function AdminAgents() {
4555 <>
4656 <div className="mt-3 grid gap-2 text-sm">
4757 <div className="flex items-center justify-between gap-3">
48 <span className="text-white/60">Run ID</span>
58 <span className="text-white/60" style={{ display: "flex", alignItems: "center", gap: 4 }}><GlossyIconInline name="code" size={12} /> Run ID</span>
4959 <span className="font-mono text-[12px] text-white/80">{latest.runId}</span>
5060 </div>
5161 <div className="flex items-center justify-between gap-3">
52 <span className="text-white/60">Mode</span>
62 <span className="text-white/60" style={{ display: "flex", alignItems: "center", gap: 4 }}><GlossyIconInline name="settings" size={12} /> Mode</span>
5363 <span className="text-white/80">{latest.mode || "bundle"}</span>
5464 </div>
5565 <div className="flex items-center justify-between gap-3">
56 <span className="text-white/60">Scripts</span>
66 <span className="text-white/60" style={{ display: "flex", alignItems: "center", gap: 4 }}><GlossyIconInline name="layers" size={12} /> Scripts</span>
5767 <span className="text-white/80">{(latest.scriptsCount ?? 0).toString()}</span>
5868 </div>
5969 <div className="flex items-center justify-between gap-3">
60 <span className="text-white/60">Finished</span>
70 <span className="text-white/60" style={{ display: "flex", alignItems: "center", gap: 4 }}><GlossyIconInline name="clock" size={12} /> Finished</span>
6171 <span className="text-white/80">{latest.finishedAt || "—"}</span>
6272 </div>
6373 </div>
@@ -67,15 +77,17 @@ export default async function AdminAgents() {
6777 <a
6878 href={downloadHref}
6979 className="rounded-xl border border-white/10 bg-white/5 px-3 py-2 text-xs hover:bg-white/10"
80 style={{ display: "inline-flex", alignItems: "center", gap: 6 }}
7081 >
71 Download bundle patch →
82 <GlossyIconInline name="arrow-right" size={12} /> Download bundle patch
7283 </a>
7384 )}
7485 <Link
7586 href="/admin/projects"
7687 className="rounded-xl border border-white/10 bg-black/30 px-3 py-2 text-xs hover:bg-white/5"
88 style={{ display: "inline-flex", alignItems: "center", gap: 6 }}
7789 >
78 Projects →
90 <GlossyIconInline name="layers" size={12} /> Projects
7991 </Link>
8092 </div>
8193 </>
@@ -83,13 +95,16 @@ export default async function AdminAgents() {
8395 </div>
8496
8597 <div className="rounded-3xl border border-white/10 bg-black/30 p-6">
86 <div className="text-sm font-semibold">Per-agent rows</div>
98 <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
99 <GlossyIcon name="target" size={30} />
100 <div className="text-sm font-semibold">Per-agent rows</div>
101 </div>
87102 <div className="mt-2 text-sm text-white/60">
88 “contract_fail” means the guardrails worked (agent refused prose / violated contract).
103 “contract_fail” means the guardrails worked (agent refused prose / violated contract).
89104 </div>
90105
91106 <div className="mt-4 space-y-2">
92 {(latest?.rows || []).slice(0, 12).map((r, idx) => (
107 {(latest?.rows || []).slice(0, 12).map((r: any, idx: number) => (
93108 <div key={idx} className="rounded-2xl border border-white/10 bg-white/5 px-3 py-2">
94109 <div className="flex items-center justify-between gap-3">
95110 <div className="flex items-center gap-2">
@@ -103,22 +118,14 @@ export default async function AdminAgents() {
103118 ))}
104119
105120 {(!latest?.rows || latest.rows.length === 0) && (
106 <div className="rounded-2xl border border-white/10 bg-black/30 p-4 text-sm text-white/60">
107 No row data yet (or older bundles didn’t persist rows). Run a bundle once.
121 <div className="rounded-2xl border border-white/10 bg-black/30 p-4 text-sm text-white/60" style={{ display: "flex", alignItems: "center", gap: 8 }}>
122 <GlossyIconInline name="clock" size={16} />
123 No row data yet. Run a bundle once.
108124 </div>
109125 )}
110126 </div>
111127 </div>
112128 </div>
113
114 <div className="rounded-3xl border border-white/10 bg-black/30 p-6">
115 <div className="text-sm font-semibold">Admin wiring complete</div>
116 <ul className="mt-3 space-y-2 text-sm text-white/60 list-disc pl-5">
117 <li>Projects list now reads KV (index or inferred).</li>
118 <li>Agents page shows latest bundle run (KV).</li>
119 <li>Download link serves the combined bundle patch as a .ps1 attachment.</li>
120 </ul>
121 </div>
122129 </div>
123130 );
124}
\ No newline at end of file
131}
Modifiedsrc/app/admin/billing/page.tsx+42−16View fileUnifiedSplit
@@ -1,33 +1,59 @@
1import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
2import Link from "next/link";
3
14export default function AdminBilling() {
25 return (
36 <div className="space-y-6">
4 <div>
5 <div className="text-xs font-semibold tracking-wide text-white/60">BILLING</div>
6 <h1 className="mt-2 text-2xl font-semibold tracking-tight">Billing</h1>
7 <p className="mt-2 text-sm text-white/60">
8 This page becomes: plan status + upgrade + manage subscription.
9 </p>
7 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
8 <GlossyIcon name="credit-card" size={36} />
9 <div>
10 <div className="text-xs font-semibold tracking-wide text-white/60">BILLING</div>
11 <h1 className="mt-1 text-2xl font-semibold tracking-tight">Billing</h1>
12 </div>
1013 </div>
14 <p className="text-sm text-white/60">
15 Manage your plan, view invoices, and configure Stripe integration.
16 </p>
1117
1218 <div className="grid gap-4 md:grid-cols-2">
1319 <div className="rounded-3xl border border-white/10 bg-black/30 p-6">
14 <div className="text-sm font-semibold">Plan</div>
15 <div className="mt-2 text-sm text-white/60">Connect to your existing Stripe/Pro gating keys.</div>
20 <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
21 <GlossyIcon name="star" size={30} />
22 <div className="text-sm font-semibold">Current Plan</div>
23 </div>
24 <div className="mt-3 text-sm text-white/60">Connect to your existing Stripe/Pro gating keys.</div>
1625 <div className="mt-5 rounded-2xl border border-white/10 bg-white/5 p-4">
17 <div className="text-[11px] text-white/50">Current</div>
18 <div className="mt-1 text-sm font-semibold">Free (placeholder)</div>
26 <div className="text-[11px] text-white/50" style={{ display: "flex", alignItems: "center", gap: 4 }}>
27 <GlossyIconInline name="check" size={12} /> Current
28 </div>
29 <div className="mt-2 text-sm font-semibold">Free (placeholder)</div>
1930 </div>
31 <Link
32 href="/pricing"
33 className="mt-4 inline-flex items-center gap-2 rounded-xl border border-white/10 bg-white/5 px-3 py-2 text-xs hover:bg-white/10"
34 >
35 <GlossyIconInline name="arrow-right" size={12} /> View pricing plans
36 </Link>
2037 </div>
2138
2239 <div className="rounded-3xl border border-white/10 bg-black/30 p-6">
23 <div className="text-sm font-semibold">Actions</div>
24 <ul className="mt-3 space-y-2 text-sm text-white/60 list-disc pl-5">
25 <li>Upgrade to Pro</li>
26 <li>Manage subscription</li>
27 <li>View invoices</li>
40 <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
41 <GlossyIcon name="settings" size={30} />
42 <div className="text-sm font-semibold">Actions</div>
43 </div>
44 <ul className="mt-4 space-y-3">
45 <li className="flex items-center gap-3 text-sm text-white/60">
46 <GlossyIconInline name="zap" size={16} /> Upgrade to Pro
47 </li>
48 <li className="flex items-center gap-3 text-sm text-white/60">
49 <GlossyIconInline name="settings" size={16} /> Manage subscription
50 </li>
51 <li className="flex items-center gap-3 text-sm text-white/60">
52 <GlossyIconInline name="document" size={16} /> View invoices
53 </li>
2854 </ul>
2955 </div>
3056 </div>
3157 </div>
3258 );
33}
\ No newline at end of file
59}
Modifiedsrc/app/admin/domains/page.tsx+50−14View fileUnifiedSplit
@@ -1,24 +1,60 @@
1import GlossyIcon from "@/components/ui/GlossyIcon";
2import type { IconName } from "@/components/ui/GlossyIcon";
3
4const steps: { icon: IconName; label: string }[] = [
5 { icon: "globe", label: "Enter domain" },
6 { icon: "code", label: "Show required DNS records" },
7 { icon: "eye", label: "Poll verification" },
8 { icon: "lock", label: "Provision SSL" },
9 { icon: "check", label: "Mark ready — Open site" },
10];
11
112export default function AdminDomains() {
213 return (
314 <div className="space-y-6">
4 <div>
5 <div className="text-xs font-semibold tracking-wide text-white/60">DOMAINS</div>
6 <h1 className="mt-2 text-2xl font-semibold tracking-tight">Domains</h1>
7 <p className="mt-2 text-sm text-white/60">
8 This page should become a step-by-step checklist (TXT/CNAME verify → SSL → ready).
9 </p>
15 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
16 <GlossyIcon name="globe" size={36} />
17 <div>
18 <div className="text-xs font-semibold tracking-wide text-white/60">DOMAINS</div>
19 <h1 className="mt-1 text-2xl font-semibold tracking-tight">Domains</h1>
20 </div>
1021 </div>
22 <p className="text-sm text-white/60">
23 Step-by-step domain verification, SSL provisioning, and publish readiness.
24 </p>
1125
1226 <div className="rounded-3xl border border-white/10 bg-black/30 p-6">
13 <div className="text-sm font-semibold">Domain checklist (UI baseline)</div>
14 <ol className="mt-3 space-y-2 text-sm text-white/60 list-decimal pl-5">
15 <li>Enter domain</li>
16 <li>Show required DNS records</li>
17 <li>Poll verification</li>
18 <li>Provision SSL</li>
19 <li>Mark ready + show “Open site”</li>
27 <div style={{ display: "flex", alignItems: "center", gap: 8, marginBottom: 16 }}>
28 <GlossyIcon name="layers" size={30} />
29 <div className="text-sm font-semibold">Domain Checklist</div>
30 </div>
31 <ol className="space-y-4">
32 {steps.map((s, i) => (
33 <li key={i} className="flex items-center gap-4">
34 <div
35 style={{
36 width: 32,
37 height: 32,
38 borderRadius: 10,
39 background: "linear-gradient(135deg, rgba(168,85,247,0.18), rgba(59,130,246,0.12))",
40 border: "1px solid rgba(255,255,255,0.10)",
41 display: "flex",
42 alignItems: "center",
43 justifyContent: "center",
44 fontSize: 12,
45 fontWeight: 900,
46 color: "rgba(237,234,247,0.75)",
47 flexShrink: 0,
48 }}
49 >
50 {i + 1}
51 </div>
52 <GlossyIcon name={s.icon} size={28} />
53 <span className="text-sm text-white/70">{s.label}</span>
54 </li>
55 ))}
2056 </ol>
2157 </div>
2258 </div>
2359 );
24}
\ No newline at end of file
60}
Modifiedsrc/app/admin/page.tsx+55−59View fileUnifiedSplit
@@ -1,84 +1,80 @@
11import Link from "next/link";
2import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
3import type { IconName } from "@/components/ui/GlossyIcon";
24
3function Card(props: { title: string; desc: string; href: string; cta: string }) {
4 return (
5 <Link href={props.href} className="block rounded-3xl border border-white/10 bg-black/30 p-6 hover:bg-white/5 transition">
6 <div className="text-lg font-semibold tracking-tight">{props.title}</div>
7 <div className="mt-2 text-sm text-white/60">{props.desc}</div>
8 <div className="mt-5 inline-flex items-center rounded-xl border border-white/10 bg-white/5 px-3 py-2 text-xs hover:bg-white/10">
9 {props.cta} →
10 </div>
11 </Link>
12 );
13}
5const cards: { icon: IconName; title: string; desc: string; href: string; cta: string }[] = [
6 { icon: "layers", title: "Projects", desc: "Manage generated sites, publish, and view status.", href: "/admin/projects", cta: "Open Projects" },
7 { icon: "cpu", title: "Agents", desc: "Run strict bundles and apply safe patches.", href: "/admin/agents", cta: "Open Agents" },
8 { icon: "globe", title: "Domains", desc: "Custom domain status + verification checklist.", href: "/admin/domains", cta: "Open Domains" },
9 { icon: "credit-card", title: "Billing", desc: "Plans and Stripe integration surface.", href: "/admin/billing", cta: "Open Billing" },
10];
1411
1512export default function AdminDashboard() {
1613 return (
1714 <div className="space-y-8">
1815 <div className="rounded-3xl border border-white/10 bg-black/30 p-8">
19 <div className="text-xs font-semibold tracking-wide text-white/60">ADMIN DASHBOARD</div>
20 <h1 className="mt-3 text-3xl font-semibold tracking-tight">
21 Your website factory is almost done.
22 </h1>
16 <div style={{ display: "flex", alignItems: "center", gap: 12 }}>
17 <GlossyIcon name="zap" size={44} />
18 <div>
19 <div className="text-xs font-semibold tracking-wide text-white/60">ADMIN DASHBOARD</div>
20 <h1 className="mt-1 text-3xl font-semibold tracking-tight">
21 Your website factory
22 </h1>
23 </div>
24 </div>
2325 <p className="mt-3 max-w-2xl text-sm text-white/60">
24 This console is the “finished product” surface area. Keep the UI stable and iterate by shipping small patches.
26 This console is your command center. Manage projects, run agents, configure domains, and control billing.
2527 </p>
2628
2729 <div className="mt-6 grid gap-3 sm:grid-cols-3">
2830 <div className="rounded-2xl border border-white/10 bg-white/5 p-4">
29 <div className="text-[11px] text-white/50">Status</div>
30 <div className="mt-1 text-sm font-semibold">Admin UI baseline</div>
31 <div className="mt-2 text-[11px] text-emerald-300/80">GREEN</div>
31 <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
32 <GlossyIcon name="check" size={24} />
33 <div className="text-[11px] text-white/50">Status</div>
34 </div>
35 <div className="mt-2 text-sm font-semibold">System Active</div>
36 <div className="mt-2 text-[11px] text-emerald-300/80" style={{ display: "flex", alignItems: "center", gap: 4 }}>
37 <GlossyIconInline name="shield" size={12} /> GREEN
38 </div>
3239 </div>
3340 <div className="rounded-2xl border border-white/10 bg-white/5 p-4">
34 <div className="text-[11px] text-white/50">Next move</div>
35 <div className="mt-1 text-sm font-semibold">Wire real data</div>
41 <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
42 <GlossyIcon name="target" size={24} />
43 <div className="text-[11px] text-white/50">Next move</div>
44 </div>
45 <div className="mt-2 text-sm font-semibold">Wire real data</div>
3646 <div className="mt-2 text-[11px] text-white/60">Projects / Runs / Domains</div>
3747 </div>
3848 <div className="rounded-2xl border border-white/10 bg-white/5 p-4">
39 <div className="text-[11px] text-white/50">Rule</div>
40 <div className="mt-1 text-sm font-semibold">No refactors</div>
41 <div className="mt-2 text-[11px] text-white/60">Ship small polish fast</div>
49 <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
50 <GlossyIcon name="bolt" size={24} />
51 <div className="text-[11px] text-white/50">Rule</div>
52 </div>
53 <div className="mt-2 text-sm font-semibold">Ship fast</div>
54 <div className="mt-2 text-[11px] text-white/60">Small polish, quick deploys</div>
4255 </div>
4356 </div>
4457 </div>
4558
4659 <div className="grid gap-4 md:grid-cols-2">
47 <Card
48 title="Projects"
49 desc="Manage generated sites, publish, and view status."
50 href="/admin/projects"
51 cta="Open Projects"
52 />
53 <Card
54 title="Agents"
55 desc="Run strict bundles and apply safe patches."
56 href="/admin/agents"
57 cta="Open Agents"
58 />
59 <Card
60 title="Domains"
61 desc="Custom domain status + verification checklist."
62 href="/admin/domains"
63 cta="Open Domains"
64 />
65 <Card
66 title="Billing"
67 desc="Plans and Stripe integration surface."
68 href="/admin/billing"
69 cta="Open Billing"
70 />
71 </div>
72
73 <div className="rounded-3xl border border-white/10 bg-black/30 p-6">
74 <div className="text-sm font-semibold">Finish checklist (admin)</div>
75 <ul className="mt-3 space-y-2 text-sm text-white/60 list-disc pl-5">
76 <li>Projects list loads real items (KV-backed).</li>
77 <li>Agents page links to bundle UI + last run status.</li>
78 <li>Domains page has a step-by-step verification checklist.</li>
79 <li>Billing page has plan status + “Manage subscription”.</li>
80 </ul>
60 {cards.map((c) => (
61 <Link
62 key={c.href}
63 href={c.href}
64 className="block rounded-3xl border border-white/10 bg-black/30 p-6 hover:bg-white/5 transition"
65 >
66 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
67 <GlossyIcon name={c.icon} size={36} />
68 <div className="text-lg font-semibold tracking-tight">{c.title}</div>
69 </div>
70 <div className="mt-3 text-sm text-white/60">{c.desc}</div>
71 <div className="mt-5 inline-flex items-center gap-2 rounded-xl border border-white/10 bg-white/5 px-3 py-2 text-xs hover:bg-white/10">
72 <GlossyIconInline name="arrow-right" size={12} />
73 {c.cta}
74 </div>
75 </Link>
76 ))}
8177 </div>
8278 </div>
8379 );
84}
\ No newline at end of file
80}
Modifiedsrc/app/admin/projects/page.tsx+50−55View fileUnifiedSplit
@@ -1,7 +1,6 @@
1"use client";
2
31import React from "react";
42import Link from "next/link";
3import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
54
65type Project = {
76 id: string;
@@ -11,90 +10,86 @@ type Project = {
1110};
1211
1312async function fetchProjects(): Promise<Project[]> {
14 // NOTE: This is a placeholder. Keep existing data-loading logic if present in your project.
15 // If your app uses a hook or server action, you can integrate it here.
16 // For now, return an empty array to demonstrate empty state handling.
1713 return [];
1814}
1915
2016export default async function AdminProjectsPage() {
2117 const projects = await fetchProjects();
22
2318 const hasProjects = Array.isArray(projects) && projects.length > 0;
2419
2520 if (!hasProjects) {
2621 return (
27 <div className="p-6">
28 <div className="mx-auto max-w-3xl rounded-lg border border-gray-200 bg-white p-8 text-center shadow-sm">
29 <div className="mx-auto mb-4 h-12 w-12 rounded-full bg-gray-100 flex items-center justify-center">
30 <svg className="h-6 w-6 text-gray-500" viewBox="0 0 24 24" fill="none" aria-hidden="true">
31 <path d="M7 7h10M7 12h10M7 17h6" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
32 </svg>
22 <div className="space-y-6">
23 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
24 <GlossyIcon name="layers" size={36} />
25 <div>
26 <div className="text-xs font-semibold tracking-wide text-white/60">PROJECTS</div>
27 <h1 className="mt-1 text-2xl font-semibold tracking-tight">Projects</h1>
3328 </div>
34 <h1 className="text-lg font-semibold text-gray-900">No projects yet</h1>
35 <p className="mt-2 text-sm text-gray-600">
36 Get started by creating your first project. You can add details and manage everything from here.
29 </div>
30
31 <div className="rounded-3xl border border-white/10 bg-black/30 p-8 text-center">
32 <GlossyIcon name="layers" size={48} style={{ margin: "0 auto" }} />
33 <h2 className="mt-4 text-lg font-semibold">No projects yet</h2>
34 <p className="mt-2 text-sm text-white/60">
35 Get started by creating your first project. Generate a site from a template and manage everything here.
3736 </p>
38 <div className="mt-6">
39 <Link
40 href="/admin/projects/new"
41 className="inline-flex items-center rounded-md bg-black px-4 py-2 text-sm font-medium text-white hover:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-black focus:ring-offset-2"
42 >
43 Create project
44 </Link>
45 </div>
37 <Link
38 href="/templates"
39 className="mt-6 inline-flex items-center gap-2 rounded-xl bg-white/10 px-4 py-2 text-sm font-medium text-white hover:bg-white/15"
40 >
41 <GlossyIconInline name="rocket" size={16} />
42 Create project
43 </Link>
4644 </div>
4745 </div>
4846 );
4947 }
5048
51 // Existing list/table UI remains unchanged below.
5249 return (
53 <div className="p-6">
54 <div className="mb-6 flex items-center justify-between">
55 <h1 className="text-xl font-semibold text-gray-900">Projects</h1>
50 <div className="space-y-6">
51 <div className="flex items-center justify-between">
52 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
53 <GlossyIcon name="layers" size={36} />
54 <div>
55 <div className="text-xs font-semibold tracking-wide text-white/60">PROJECTS</div>
56 <h1 className="mt-1 text-2xl font-semibold tracking-tight">Projects</h1>
57 </div>
58 </div>
5659 <Link
57 href="/admin/projects/new"
58 className="inline-flex items-center rounded-md bg-black px-4 py-2 text-sm font-medium text-white hover:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-black focus:ring-offset-2"
60 href="/templates"
61 className="inline-flex items-center gap-2 rounded-xl bg-white/10 px-4 py-2 text-sm font-medium text-white hover:bg-white/15"
5962 >
63 <GlossyIconInline name="rocket" size={16} />
6064 New project
6165 </Link>
6266 </div>
6367
64 <div className="overflow-hidden rounded-lg border border-gray-200 bg-white shadow-sm">
65 <table className="min-w-full divide-y divide-gray-200">
66 <thead className="bg-gray-50">
67 <tr>
68 <th scope="col" className="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500">
69 Name
70 </th>
71 <th scope="col" className="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500">
72 Description
73 </th>
74 <th scope="col" className="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500">
75 Created
76 </th>
77 <th scope="col" className="px-6 py-3" />
68 <div className="rounded-3xl border border-white/10 bg-black/30 overflow-hidden">
69 <table className="w-full">
70 <thead>
71 <tr className="border-b border-white/10">
72 <th className="px-6 py-3 text-left text-xs font-semibold uppercase tracking-wider text-white/50">Name</th>
73 <th className="px-6 py-3 text-left text-xs font-semibold uppercase tracking-wider text-white/50">Description</th>
74 <th className="px-6 py-3 text-left text-xs font-semibold uppercase tracking-wider text-white/50">Created</th>
75 <th className="px-6 py-3" />
7876 </tr>
7977 </thead>
80 <tbody className="divide-y divide-gray-200 bg-white">
78 <tbody>
8179 {projects.map((p) => (
82 <tr key={p.id}>
83 <td className="whitespace-nowrap px-6 py-4 text-sm font-medium text-gray-900">{p.name}</td>
84 <td className="px-6 py-4 text-sm text-gray-600">
85 {p.description ?? <span className="text-gray-400">—</span>}
86 </td>
87 <td className="px-6 py-4 text-sm text-gray-600">
88 {p.createdAt
89 ? new Date(p.createdAt).toLocaleDateString()
90 : <span className="text-gray-400">—</span>}
80 <tr key={p.id} className="border-b border-white/5">
81 <td className="whitespace-nowrap px-6 py-4 text-sm font-medium">{p.name}</td>
82 <td className="px-6 py-4 text-sm text-white/60">{p.description ?? "—"}</td>
83 <td className="px-6 py-4 text-sm text-white/60">
84 {p.createdAt ? new Date(p.createdAt).toLocaleDateString() : "—"}
9185 </td>
9286 <td className="px-6 py-4 text-right">
9387 <Link
9488 href={`/admin/projects/${p.id}`}
95 className="text-sm font-medium text-black hover:underline"
89 className="text-sm font-medium hover:underline"
90 style={{ display: "inline-flex", alignItems: "center", gap: 4 }}
9691 >
97 Manage
92 <GlossyIconInline name="arrow-right" size={12} /> Manage
9893 </Link>
9994 </td>
10095 </tr>
Modifiedsrc/app/admin/settings/page.tsx+32−10View fileUnifiedSplit
@@ -1,20 +1,42 @@
1import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
2
13export default function AdminSettings() {
24 return (
35 <div className="space-y-6">
4 <div>
5 <div className="text-xs font-semibold tracking-wide text-white/60">SETTINGS</div>
6 <h1 className="mt-2 text-2xl font-semibold tracking-tight">Settings</h1>
7 <p className="mt-2 text-sm text-white/60">
8 Keep this simple. Only the controls you actually use.
9 </p>
6 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
7 <GlossyIcon name="settings" size={36} />
8 <div>
9 <div className="text-xs font-semibold tracking-wide text-white/60">SETTINGS</div>
10 <h1 className="mt-1 text-2xl font-semibold tracking-tight">Settings</h1>
11 </div>
1012 </div>
13 <p className="text-sm text-white/60">
14 Keep this simple. Only the controls you actually use.
15 </p>
1116
1217 <div className="rounded-3xl border border-white/10 bg-black/30 p-6">
13 <div className="text-sm font-semibold">Workspace</div>
14 <div className="mt-2 text-sm text-white/60">
15 Add items like: default projectId, feature toggles, debug mode, and safe admin tools.
18 <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
19 <GlossyIcon name="briefcase" size={30} />
20 <div className="text-sm font-semibold">Workspace</div>
21 </div>
22 <div className="mt-3 text-sm text-white/60">
23 Configure your workspace settings.
1624 </div>
25 <ul className="mt-4 space-y-3">
26 <li className="flex items-center gap-3 text-sm text-white/60">
27 <GlossyIconInline name="layers" size={16} /> Default projectId
28 </li>
29 <li className="flex items-center gap-3 text-sm text-white/60">
30 <GlossyIconInline name="bolt" size={16} /> Feature toggles
31 </li>
32 <li className="flex items-center gap-3 text-sm text-white/60">
33 <GlossyIconInline name="code" size={16} /> Debug mode
34 </li>
35 <li className="flex items-center gap-3 text-sm text-white/60">
36 <GlossyIconInline name="shield" size={16} /> Safe admin tools
37 </li>
38 </ul>
1739 </div>
1840 </div>
1941 );
20}
\ No newline at end of file
42}
Deletedsrc/app/page.jsx+0−207View fileUnifiedSplit
@@ -1,207 +0,0 @@
1import Link from "next/link";
2import { buildMarker } from "@/src/lib/buildMarker";
3import HeroGlow from "@/src/components/marketing/HeroGlow";
4
5/**
6 * Force dynamic rendering to avoid “stale/static/cached HTML” confusion on homepage.
7 * This makes updates show up reliably after deploy.
8 */
9export const dynamic = "force-dynamic";
10export const revalidate = 0;
11
12export default function HomePage() {
13 return (
14 <main className="d8-page">
15 {/* Deploy-proof marker (view-source / curl grep friendly) */}
16 <span className="d8-marker" aria-hidden="true">
17 {buildMarker()}
18 </span>
19
20 {/* FULL-SCREEN HERO TAKEOVER */}
21 <section className="d8-hero-full">
22 {/* WOW background layers (CSS-only) */}
23 <div className="d8-wow-bg" aria-hidden="true">
24 <div className="d8-orb d8-orb-a" />
25 <div className="d8-orb d8-orb-b" />
26 <div className="d8-orb d8-orb-c" />
27 <div className="d8-grid" />
28 <div className="d8-noise" />
29 <div className="d8-vignette" />
30 </div>
31
32 {/* V8: TRUE cursor-follow glow (tiny JS sets CSS vars) */}
33 <HeroGlow>
34 <div className="d8-hero-inner">
35 <header className="d8-hero-copy">
36 <div className="d8-pill">
37 <span className="d8-dot" />
38 <span>Dominat8 — AI Website Automation Builder</span>
39 </div>
40
41 <h1 className="d8-h1">
42 The <span className="d8-grad">wow</span> website builder.
43 <br />
44 Built by AI. Shipped fast.
45 </h1>
46
47 <p className="d8-sub">
48 Describe your business. Dominat8 generates a premium homepage, pages, and structure —
49 ready to publish on your domain.
50 </p>
51
52 <div className="d8-cta-row">
53 <Link className="d8-btn d8-btn-primary" href="/sign-in">
54 Start building
55 </Link>
56 <Link className="d8-btn d8-btn-ghost" href="/templates">
57 Explore templates
58 </Link>
59 </div>
60
61 <div className="d8-trust">
62 <div className="d8-trust-item">⚡ Fast publish</div>
63 <div className="d8-trust-item">🔎 SEO-ready</div>
64 <div className="d8-trust-item">🌐 Custom domains</div>
65 <div className="d8-trust-item">🧠 Agent pipeline</div>
66 </div>
67 </header>
68
69 <aside className="d8-hero-card" aria-label="Preview card">
70 <div className="d8-card-top">
71 <div className="d8-card-dots">
72 <span />
73 <span />
74 <span />
75 </div>
76 <div className="d8-card-title">Live Preview</div>
77 </div>
78
79 <div className="d8-card-body">
80 <div className="d8-card-kicker">AI-generated site blueprint</div>
81
82 <div className="d8-mock">
83 <div className="d8-mock-hero">
84 <div className="d8-mock-title" />
85 <div className="d8-mock-sub" />
86 <div className="d8-mock-sub d8-mock-sub2" />
87 <div className="d8-mock-btnrow">
88 <div className="d8-mock-btn" />
89 <div className="d8-mock-btn d8-mock-btn2" />
90 </div>
91 </div>
92 <div className="d8-mock-grid">
93 <div className="d8-mock-tile" />
94 <div className="d8-mock-tile" />
95 <div className="d8-mock-tile" />
96 <div className="d8-mock-tile" />
97 </div>
98 </div>
99
100 <div className="d8-card-foot">
101 <span className="d8-tag">V8 True Glow</span>
102 <span className="d8-tag">Full-screen</span>
103 <span className="d8-tag">Build-gated</span>
104 </div>
105 </div>
106 </aside>
107 </div>
108
109 {/* Scroll hint */}
110 <div className="d8-scroll-hint" aria-hidden="true">
111 <span className="d8-scroll-dot" />
112 <span className="d8-scroll-text">Scroll</span>
113 </div>
114 </HeroGlow>
115 </section>
116
117 {/* SITEGROUND-STYLE STRUCTURE BELOW THE FOLD */}
118 <section className="d8-logos">
119 <div className="d8-wrap">
120 <div className="d8-logos-title">Trusted by builders who want a premium look</div>
121 <div className="d8-logos-row" aria-label="Logo strip">
122 <div className="d8-logo-pill">Agencies</div>
123 <div className="d8-logo-pill">Founders</div>
124 <div className="d8-logo-pill">Local business</div>
125 <div className="d8-logo-pill">Creators</div>
126 <div className="d8-logo-pill">E-commerce</div>
127 </div>
128 </div>
129 </section>
130
131 <section className="d8-how">
132 <div className="d8-wrap">
133 <h2 className="d8-h2">How it works</h2>
134 <p className="d8-lead">Three steps. Clean output. Fast publishing.</p>
135
136 <div className="d8-how-grid">
137 <div className="d8-step">
138 <div className="d8-step-num">1</div>
139 <div className="d8-step-title">Describe</div>
140 <div className="d8-step-sub">Tell us what you do and the vibe you want.</div>
141 </div>
142 <div className="d8-step">
143 <div className="d8-step-num">2</div>
144 <div className="d8-step-title">Generate</div>
145 <div className="d8-step-sub">Agents build pages, layout, and SEO structure.</div>
146 </div>
147 <div className="d8-step">
148 <div className="d8-step-num">3</div>
149 <div className="d8-step-title">Publish</div>
150 <div className="d8-step-sub">Push live on your domain. Iterate instantly.</div>
151 </div>
152 </div>
153 </div>
154 </section>
155
156 <section className="d8-proof">
157 <div className="d8-wrap">
158 <div className="d8-proof-grid">
159 <div className="d8-proof-card">
160 <div className="d8-proof-kicker">Premium by default</div>
161 <div className="d8-proof-title">Design that looks expensive</div>
162 <div className="d8-proof-sub">Modern lighting, depth, and typography — without a designer.</div>
163 </div>
164
165 <div className="d8-proof-card">
166 <div className="d8-proof-kicker">Built to rank</div>
167 <div className="d8-proof-title">SEO-ready structure</div>
168 <div className="d8-proof-sub">Clean metadata, headings, and page structure from day one.</div>
169 </div>
170
171 <div className="d8-proof-card">
172 <div className="d8-proof-kicker">Fast execution</div>
173 <div className="d8-proof-title">Agents do the heavy lifting</div>
174 <div className="d8-proof-sub">From spec to publish — streamlined and repeatable.</div>
175 </div>
176 </div>
177 </div>
178 </section>
179
180 <section className="d8-final-cta">
181 <div className="d8-wrap">
182 <div className="d8-final-box">
183 <div>
184 <div className="d8-final-title">Ready to build your best site?</div>
185 <div className="d8-final-sub">Generate a premium homepage and publish it fast.</div>
186 </div>
187 <div className="d8-final-actions">
188 <Link className="d8-btn d8-btn-primary" href="/sign-in">Start building</Link>
189 <Link className="d8-btn d8-btn-ghost" href="/pricing">See pricing</Link>
190 </div>
191 </div>
192
193 <footer className="d8-footer">
194 <div className="d8-footer-left">© {new Date().getFullYear()} Dominat8</div>
195 <div className="d8-footer-right">
196 <Link className="d8-footer-link" href="/templates">Templates</Link>
197 <span className="d8-footer-dot">•</span>
198 <Link className="d8-footer-link" href="/use-cases">Use cases</Link>
199 <span className="d8-footer-dot">•</span>
200 <Link className="d8-footer-link" href="/pricing">Pricing</Link>
201 </div>
202 </footer>
203 </div>
204 </section>
205 </main>
206 );
207}
Modifiedsrc/app/page.tsx+255−56View fileUnifiedSplit
@@ -1,15 +1,25 @@
1// === D8_AUTOREPAIR_DEMO_START ===
2// Intentionally missing import to demonstrate Auto Repair fixing a build.
3// This produces a deterministic "Module not found" error with zero UI impact.
4import AutoRepairDemoWidget from "./_client/AutoRepairDemoWidget";
5// === D8_AUTOREPAIR_DEMO_END ===
61export const dynamic = "force-dynamic";
72export const revalidate = 0;
83
4import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
5import Link from "next/link";
6
7const features = [
8 { icon: "bolt" as const, title: "AI-Powered Generation", desc: "Describe your business. Get a full site spec, pages, and copy — generated in minutes, not weeks." },
9 { icon: "target" as const, title: "Conversion-First Design", desc: "Every section is engineered for action: hero, trust strip, features, proof, pricing, CTA ladder." },
10 { icon: "layers" as const, title: "Premium Templates", desc: "Start with proven layouts for SaaS, local service, portfolio, agency, product landing, and more." },
11 { icon: "globe" as const, title: "Publish & Map Domains", desc: "Ship to your custom domain with one click. SSL provisioned, DNS verified, live in seconds." },
12 { icon: "cpu" as const, title: "Agent-Driven Pipeline", desc: "Automated agents handle SEO, metadata, sitemap, robots.txt, and ongoing optimization passes." },
13 { icon: "shield" as const, title: "Build-Gated Deploys", desc: "Nothing ships unless the build is green. No silent failures, no broken production." },
14];
15
16const steps = [
17 { num: "01", icon: "sparkle" as const, title: "Describe your idea", desc: "Enter a brief about your business. The AI generates a full site spec with pages, sections, and copy." },
18 { num: "02", icon: "code" as const, title: "Review & refine", desc: "Preview your generated site. Swap sections, edit copy, reorder — iterate until it's perfect." },
19 { num: "03", icon: "rocket" as const, title: "Publish & grow", desc: "Ship to your domain. Run SEO passes. Track performance. Scale with confidence." },
20];
21
922export default function HomePage() {
10 // D8: Keep this intentionally simple and robust.
11 // The real "locked hero" visuals live in the rendered markup below
12 // (inline styles so it can't go plain if Tailwind fails).
1323 return (
1424 <main
1525 style={{
@@ -25,6 +35,7 @@ export default function HomePage() {
2535 }}
2636 >
2737 <div style={{ width: "100%", maxWidth: 1160, margin: "0 auto" }}>
38 {/* NAV */}
2839 <div
2940 style={{
3041 display: "flex",
@@ -34,7 +45,7 @@ export default function HomePage() {
3445 padding: "10px 0 22px",
3546 }}
3647 >
37 <a
48 <Link
3849 href="/"
3950 aria-label="Dominat8 Home"
4051 style={{
@@ -45,18 +56,7 @@ export default function HomePage() {
4556 color: "#F3EEFF",
4657 }}
4758 >
48 <div
49 style={{
50 width: 34,
51 height: 34,
52 borderRadius: 12,
53 background:
54 "linear-gradient(135deg, rgba(168,85,247,0.95), rgba(59,130,246,0.75))",
55 boxShadow:
56 "0 10px 30px rgba(168,85,247,0.25), 0 10px 30px rgba(59,130,246,0.12)",
57 border: "1px solid rgba(255,255,255,0.18)",
58 }}
59 />
59 <GlossyIcon name="zap" size={34} />
6060 <div style={{ display: "flex", flexDirection: "column", lineHeight: 1.05 }}>
6161 <div
6262 style={{
@@ -73,7 +73,7 @@ export default function HomePage() {
7373 AI website builder for conversion-first sites
7474 </div>
7575 </div>
76 </a>
76 </Link>
7777
7878 <nav
7979 aria-label="Top navigation"
@@ -86,29 +86,34 @@ export default function HomePage() {
8686 }}
8787 >
8888 {[
89 { href: "#preview", label: "Preview" },
90 { href: "/templates", label: "Templates" },
91 { href: "/pricing", label: "Pricing" },
89 { href: "/templates", label: "Templates", icon: "layers" as const },
90 { href: "/pricing", label: "Pricing", icon: "credit-card" as const },
91 { href: "/gallery", label: "Gallery", icon: "eye" as const },
9292 ].map((l) => (
93 <a
93 <Link
9494 key={l.href}
9595 href={l.href}
9696 style={{
9797 fontSize: 13,
9898 color: "rgba(237,234,247,0.82)",
9999 textDecoration: "none",
100 padding: "8px 10px",
100 padding: "8px 12px",
101101 borderRadius: 10,
102102 border: "1px solid rgba(255,255,255,0.08)",
103103 background: "rgba(255,255,255,0.03)",
104 display: "inline-flex",
105 alignItems: "center",
106 gap: 6,
104107 }}
105108 >
109 <GlossyIconInline name={l.icon} size={14} />
106110 {l.label}
107 </a>
111 </Link>
108112 ))}
109113 </nav>
110114 </div>
111115
116 {/* HERO */}
112117 <div
113118 style={{
114119 display: "grid",
@@ -124,7 +129,7 @@ export default function HomePage() {
124129 display: "inline-flex",
125130 alignItems: "center",
126131 gap: 10,
127 padding: "8px 12px",
132 padding: "8px 14px",
128133 borderRadius: 999,
129134 background:
130135 "linear-gradient(90deg, rgba(168,85,247,0.18), rgba(59,130,246,0.10))",
@@ -137,8 +142,8 @@ export default function HomePage() {
137142 fontWeight: 700,
138143 }}
139144 >
140 <span style={{ opacity: 0.95 }}>Craftify-style hero</span>
141 <span style={{ opacity: 0.65 }}>inline-styled fallback</span>
145 <GlossyIconInline name="sparkle" size={14} />
146 <span style={{ opacity: 0.95 }}>AI-Powered Website Factory</span>
142147 </div>
143148
144149 <h1
@@ -176,19 +181,19 @@ export default function HomePage() {
176181 color: "rgba(237,234,247,0.78)",
177182 }}
178183 >
179 Dominat8 builds polished, conversion-first pages fast — with a locked visual layer that
180 still renders properly even if Tailwind/classes fail to load.
184 Dominat8 builds polished, conversion-first pages fast — with AI agents that handle
185 generation, SEO, and publishing so you can focus on growing.
181186 </p>
182187
183188 <div style={{ display: "flex", gap: 12, flexWrap: "wrap", marginTop: 18, alignItems: "center" }}>
184 <a
185 href="/builder"
189 <Link
190 href="/templates"
186191 style={{
187192 display: "inline-flex",
188193 alignItems: "center",
189194 justifyContent: "center",
190195 gap: 10,
191 padding: "12px 16px",
196 padding: "12px 18px",
192197 borderRadius: 14,
193198 textDecoration: "none",
194199 fontWeight: 800,
@@ -201,17 +206,17 @@ export default function HomePage() {
201206 border: "1px solid rgba(255,255,255,0.10)",
202207 }}
203208 >
204 Start Building Now <span aria-hidden="true">→</span>
205 </a>
209 <GlossyIconInline name="rocket" size={16} /> Start Building Now
210 </Link>
206211
207 <a
208 href="#preview"
212 <Link
213 href="/pricing"
209214 style={{
210215 display: "inline-flex",
211216 alignItems: "center",
212217 justifyContent: "center",
213218 gap: 10,
214 padding: "12px 16px",
219 padding: "12px 18px",
215220 borderRadius: 14,
216221 textDecoration: "none",
217222 fontWeight: 800,
@@ -222,11 +227,12 @@ export default function HomePage() {
222227 boxShadow: "0 10px 30px rgba(0,0,0,0.35)",
223228 }}
224229 >
225 Watch video <span aria-hidden="true">▶</span>
226 </a>
230 <GlossyIconInline name="credit-card" size={16} /> View Pricing
231 </Link>
227232 </div>
228233 </section>
229234
235 {/* PREVIEW CARD */}
230236 <aside
231237 id="preview"
232238 aria-label="Preview card"
@@ -255,9 +261,13 @@ export default function HomePage() {
255261 />
256262 <div style={{ position: "relative", zIndex: 2 }}>
257263 <div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
258 {["LIVE_OK", "BUILD PROOF", "NO-TAILWIND SAFE"].map((t) => (
264 {[
265 { label: "AI GENERATED", icon: "cpu" as const },
266 { label: "SEO READY", icon: "chart" as const },
267 { label: "CONVERSION FIRST", icon: "target" as const },
268 ].map((t) => (
259269 <div
260 key={t}
270 key={t.label}
261271 style={{
262272 fontSize: 11,
263273 fontWeight: 900,
@@ -268,9 +278,13 @@ export default function HomePage() {
268278 background: "rgba(0,0,0,0.35)",
269279 border: "1px solid rgba(255,255,255,0.12)",
270280 color: "rgba(237,234,247,0.85)",
281 display: "inline-flex",
282 alignItems: "center",
283 gap: 6,
271284 }}
272285 >
273 {t}
286 <GlossyIconInline name={t.icon} size={12} />
287 {t.label}
274288 </div>
275289 ))}
276290 </div>
@@ -283,9 +297,13 @@ export default function HomePage() {
283297 letterSpacing: "0.14em",
284298 textTransform: "uppercase",
285299 color: "rgba(237,234,247,0.84)",
300 display: "flex",
301 alignItems: "center",
302 gap: 8,
286303 }}
287304 >
288 Live Preview (Proof)
305 <GlossyIcon name="eye" size={28} />
306 Live Preview
289307 </div>
290308
291309 <div
@@ -337,22 +355,200 @@ export default function HomePage() {
337355 color: "rgba(237,234,247,0.80)",
338356 }}
339357 >
340 <div style={{ marginBottom: 10, fontWeight: 900, opacity: 0.95 }}>
341 HOME_OK • Locked Hero Render
358 <div style={{ marginBottom: 10, fontWeight: 900, opacity: 0.95, display: "flex", alignItems: "center", gap: 6 }}>
359 <GlossyIconInline name="check" size={14} />
360 BUILD OK — Site Generated
342361 </div>
343362 <div style={{ opacity: 0.7 }}>
344 If you see this card styled, your homepage can’t “go plain” anymore.
363 Your premium site is live and conversion-ready.
345364 </div>
346365 </div>
347366 </div>
348367
349 <div style={{ marginTop: 14, fontSize: 13, lineHeight: 1.5, color: "rgba(237,234,247,0.72)" }}>
350 Tip: add <span style={{ fontWeight: 900, color: "rgba(237,234,247,0.90)" }}>?ts=</span> to bust cache.
368 <div style={{ marginTop: 14, fontSize: 13, lineHeight: 1.5, color: "rgba(237,234,247,0.72)", display: "flex", alignItems: "center", gap: 6 }}>
369 <GlossyIconInline name="bolt" size={14} />
370 Powered by AI agents — generation to publish in minutes.
351371 </div>
352372 </div>
353373 </aside>
354374 </div>
355375
376 {/* FEATURES GRID */}
377 <section style={{ marginTop: 48 }}>
378 <div style={{ textAlign: "center", marginBottom: 28 }}>
379 <div
380 style={{
381 display: "inline-flex",
382 alignItems: "center",
383 gap: 8,
384 padding: "8px 14px",
385 borderRadius: 999,
386 background: "linear-gradient(90deg, rgba(168,85,247,0.15), rgba(59,130,246,0.08))",
387 border: "1px solid rgba(255,255,255,0.10)",
388 fontSize: 11,
389 fontWeight: 800,
390 letterSpacing: "0.14em",
391 textTransform: "uppercase",
392 color: "rgba(237,234,247,0.85)",
393 }}
394 >
395 <GlossyIconInline name="star" size={14} />
396 Why Dominat8
397 </div>
398 <h2
399 style={{
400 marginTop: 14,
401 fontSize: 32,
402 fontWeight: 900,
403 letterSpacing: "-0.02em",
404 color: "#F6F2FF",
405 }}
406 >
407 Everything you need to ship premium sites
408 </h2>
409 </div>
410
411 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
412 {features.map((f) => (
413 <div
414 key={f.title}
415 style={{
416 borderRadius: 18,
417 padding: 20,
418 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
419 border: "1px solid rgba(255,255,255,0.10)",
420 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
421 }}
422 >
423 <GlossyIcon name={f.icon} size={44} />
424 <div style={{ marginTop: 14, fontSize: 15, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{f.title}</div>
425 <div style={{ marginTop: 8, fontSize: 13, lineHeight: 1.55, color: "rgba(237,234,247,0.68)" }}>{f.desc}</div>
426 </div>
427 ))}
428 </div>
429 </section>
430
431 {/* HOW IT WORKS */}
432 <section style={{ marginTop: 48 }}>
433 <div style={{ textAlign: "center", marginBottom: 28 }}>
434 <div
435 style={{
436 display: "inline-flex",
437 alignItems: "center",
438 gap: 8,
439 padding: "8px 14px",
440 borderRadius: 999,
441 background: "linear-gradient(90deg, rgba(59,130,246,0.15), rgba(168,85,247,0.08))",
442 border: "1px solid rgba(255,255,255,0.10)",
443 fontSize: 11,
444 fontWeight: 800,
445 letterSpacing: "0.14em",
446 textTransform: "uppercase",
447 color: "rgba(237,234,247,0.85)",
448 }}
449 >
450 <GlossyIconInline name="zap" size={14} />
451 How It Works
452 </div>
453 <h2
454 style={{
455 marginTop: 14,
456 fontSize: 32,
457 fontWeight: 900,
458 letterSpacing: "-0.02em",
459 color: "#F6F2FF",
460 }}
461 >
462 Three steps to a premium website
463 </h2>
464 </div>
465
466 <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
467 {steps.map((s) => (
468 <div
469 key={s.num}
470 style={{
471 borderRadius: 18,
472 padding: 22,
473 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
474 border: "1px solid rgba(255,255,255,0.10)",
475 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
476 position: "relative",
477 }}
478 >
479 <div style={{ display: "flex", alignItems: "center", gap: 12 }}>
480 <GlossyIcon name={s.icon} size={44} />
481 <div style={{ fontSize: 28, fontWeight: 900, color: "rgba(168,85,247,0.25)" }}>{s.num}</div>
482 </div>
483 <div style={{ marginTop: 14, fontSize: 15, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{s.title}</div>
484 <div style={{ marginTop: 8, fontSize: 13, lineHeight: 1.55, color: "rgba(237,234,247,0.68)" }}>{s.desc}</div>
485 </div>
486 ))}
487 </div>
488 </section>
489
490 {/* CTA SECTION */}
491 <section
492 style={{
493 marginTop: 48,
494 borderRadius: 24,
495 padding: 32,
496 background: "linear-gradient(135deg, rgba(168,85,247,0.12), rgba(59,130,246,0.08))",
497 border: "1px solid rgba(255,255,255,0.12)",
498 boxShadow: "0 30px 90px rgba(0,0,0,0.3), 0 20px 55px rgba(168,85,247,0.08)",
499 textAlign: "center",
500 }}
501 >
502 <GlossyIcon name="rocket" size={56} style={{ margin: "0 auto" }} />
503 <h2 style={{ marginTop: 16, fontSize: 28, fontWeight: 900, color: "#F6F2FF" }}>
504 Ready to build something premium?
505 </h2>
506 <p style={{ marginTop: 10, fontSize: 15, color: "rgba(237,234,247,0.72)", maxWidth: 500, margin: "10px auto 0" }}>
507 Start free. Generate your first site in minutes. Upgrade when you want full automation.
508 </p>
509 <div style={{ display: "flex", gap: 12, justifyContent: "center", marginTop: 20 }}>
510 <Link
511 href="/templates"
512 style={{
513 display: "inline-flex",
514 alignItems: "center",
515 gap: 8,
516 padding: "12px 20px",
517 borderRadius: 14,
518 textDecoration: "none",
519 fontWeight: 800,
520 fontSize: 14,
521 color: "#07070B",
522 background: "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))",
523 boxShadow: "0 18px 55px rgba(168,85,247,0.26), 0 10px 24px rgba(59,130,246,0.16)",
524 border: "1px solid rgba(255,255,255,0.10)",
525 }}
526 >
527 <GlossyIconInline name="bolt" size={16} /> Get Started Free
528 </Link>
529 <Link
530 href="/contact"
531 style={{
532 display: "inline-flex",
533 alignItems: "center",
534 gap: 8,
535 padding: "12px 20px",
536 borderRadius: 14,
537 textDecoration: "none",
538 fontWeight: 800,
539 fontSize: 14,
540 color: "rgba(237,234,247,0.88)",
541 background: "rgba(255,255,255,0.04)",
542 border: "1px solid rgba(255,255,255,0.12)",
543 boxShadow: "0 10px 30px rgba(0,0,0,0.35)",
544 }}
545 >
546 <GlossyIconInline name="mail" size={16} /> Talk to Us
547 </Link>
548 </div>
549 </section>
550
551 {/* FOOTER */}
356552 <div
357553 style={{
358554 marginTop: 34,
@@ -366,14 +562,18 @@ export default function HomePage() {
366562 color: "rgba(237,234,247,0.65)",
367563 }}
368564 >
369 <div>© {new Date().getFullYear()} Dominat8</div>
565 <div style={{ display: "flex", alignItems: "center", gap: 6 }}>
566 <GlossyIconInline name="zap" size={12} />
567 © {new Date().getFullYear()} Dominat8
568 </div>
370569 <div style={{ display: "flex", gap: 14, flexWrap: "wrap" }}>
371570 {[
372571 { href: "/privacy", label: "Privacy" },
373572 { href: "/terms", label: "Terms" },
374573 { href: "/contact", label: "Contact" },
574 { href: "/about", label: "About" },
375575 ].map((l) => (
376 <a
576 <Link
377577 key={l.href}
378578 href={l.href}
379579 style={{
@@ -384,7 +584,7 @@ export default function HomePage() {
384584 }}
385585 >
386586 {l.label}
387 </a>
587 </Link>
388588 ))}
389589 </div>
390590 </div>
@@ -392,4 +592,3 @@ export default function HomePage() {
392592 </main>
393593 );
394594}
395
Modifiedsrc/components/admin/AdminShellClient.tsx+41−81View fileUnifiedSplit
@@ -3,25 +3,15 @@
33import React, { useMemo, useState } from "react";
44import Link from "next/link";
55import { usePathname } from "next/navigation";
6import GlossyIcon, { GlossyIconInline } from "@/components/ui/GlossyIcon";
7import type { IconName } from "@/components/ui/GlossyIcon";
68
7type NavItem = { href: string; label: string; hint?: string };
9type NavItem = { href: string; label: string; hint?: string; icon: IconName };
810
911function cx(...xs: Array<string | false | null | undefined>) {
1012 return xs.filter(Boolean).join(" ");
1113}
1214
13function Card(props: { title: string; children: React.ReactNode; right?: React.ReactNode }) {
14 return (
15 <div className="rounded-3xl border border-white/15 bg-white/8 shadow-[0_0_0_1px_rgba(255,255,255,0.02),0_20px_60px_rgba(0,0,0,0.45)] p-6">
16 <div className="flex items-center justify-between">
17 <div className="text-sm font-semibold text-white/90">{props.title}</div>
18 {props.right}
19 </div>
20 <div className="mt-3 text-sm text-white/75">{props.children}</div>
21 </div>
22 );
23}
24
2515function NavList(props: { nav: NavItem[]; pathname: string | null; onNavigate?: () => void }) {
2616 return (
2717 <div className="flex flex-col gap-1">
@@ -40,7 +30,10 @@ function NavList(props: { nav: NavItem[]; pathname: string | null; onNavigate?:
4030 )}
4131 >
4232 <div className="flex items-center justify-between">
43 <div className="text-sm font-medium text-white/90">{n.label}</div>
33 <div className="flex items-center gap-2">
34 <GlossyIconInline name={n.icon} size={16} />
35 <div className="text-sm font-medium text-white/90">{n.label}</div>
36 </div>
4437 <div className="text-[10px] text-white/55 group-hover:text-white/75">{n.hint || ""}</div>
4538 </div>
4639 </Link>
@@ -56,25 +49,20 @@ export default function AdminShellClient(props: { children: React.ReactNode; bui
5649
5750 const nav: NavItem[] = useMemo(
5851 () => [
59 { href: "/admin", label: "Dashboard", hint: "Overview" },
60 { href: "/admin/projects", label: "Projects", hint: "Your sites" },
61 { href: "/admin/agents", label: "Agents", hint: "Runs & Bundles" },
62 { href: "/admin/domains", label: "Domains", hint: "Custom domains" },
63 { href: "/admin/billing", label: "Billing", hint: "Plans & Stripe" },
64 { href: "/admin/settings", label: "Settings", hint: "Workspace" },
52 { href: "/admin", label: "Dashboard", hint: "Overview", icon: "zap" },
53 { href: "/admin/projects", label: "Projects", hint: "Your sites", icon: "layers" },
54 { href: "/admin/agents", label: "Agents", hint: "Runs & Bundles", icon: "cpu" },
55 { href: "/admin/domains", label: "Domains", hint: "Custom domains", icon: "globe" },
56 { href: "/admin/billing", label: "Billing", hint: "Plans & Stripe", icon: "credit-card" },
57 { href: "/admin/settings", label: "Settings", hint: "Workspace", icon: "settings" },
6558 ],
6659 []
6760 );
6861
6962 return (
7063 <div className="min-h-screen text-white">
71 {/* Base background (cleaner) */}
7264 <div className="fixed inset-0 -z-10 bg-[#050712]" />
73
74 {/* Softer + cleaner glow (no washout) */}
7565 <div className="fixed inset-0 -z-10 pointer-events-none opacity-18 [background:radial-gradient(900px_circle_at_18%_12%,rgba(168,85,247,0.22),transparent_55%),radial-gradient(900px_circle_at_82%_18%,rgba(59,130,246,0.18),transparent_58%),radial-gradient(900px_circle_at_50%_86%,rgba(245,158,11,0.10),transparent_60%)]" />
76
77 {/* Subtle vignette for depth */}
7866 <div className="fixed inset-0 -z-10 pointer-events-none opacity-70 [background:radial-gradient(1200px_circle_at_50%_40%,transparent_35%,rgba(0,0,0,0.65)_80%)]" />
7967
8068 {/* Mobile drawer */}
@@ -87,9 +75,12 @@ export default function AdminShellClient(props: { children: React.ReactNode; bui
8775 />
8876 <div className="absolute left-0 top-0 h-full w-[86%] max-w-[340px] border-r border-white/15 bg-black/70 backdrop-blur-xl p-4">
8977 <div className="flex items-center justify-between">
90 <div>
91 <div className="text-sm font-semibold tracking-wide text-white/95">Dominat8</div>
92 <div className="text-xs text-white/70">Admin Console</div>
78 <div className="flex items-center gap-2">
79 <GlossyIcon name="zap" size={28} />
80 <div>
81 <div className="text-sm font-semibold tracking-wide text-white/95">Dominat8</div>
82 <div className="text-xs text-white/70">Admin Console</div>
83 </div>
9384 </div>
9485 <button
9586 className="rounded-xl border border-white/15 bg-white/8 px-3 py-2 text-xs text-white/90 hover:bg-white/12"
@@ -99,30 +90,6 @@ export default function AdminShellClient(props: { children: React.ReactNode; bui
9990 </button>
10091 </div>
10192
102 <div className="mt-4">
103 <Card
104 title="Quick actions"
105 right={<span className="text-[10px] text-white/60">v1</span>}
106 >
107 <div className="mt-1 flex flex-col gap-2">
108 <Link
109 href="/admin/projects"
110 onClick={() => setOpen(false)}
111 className="rounded-xl border border-white/12 bg-white/6 px-3 py-2 text-xs text-white/90 hover:bg-white/10"
112 >
113 View Projects →
114 </Link>
115 <Link
116 href="/admin/agents"
117 onClick={() => setOpen(false)}
118 className="rounded-xl border border-white/12 bg-white/6 px-3 py-2 text-xs text-white/90 hover:bg-white/10"
119 >
120 Agents & Bundles →
121 </Link>
122 </div>
123 </Card>
124 </div>
125
12693 <div className="mt-4">
12794 <div className="mb-2 px-2 text-[11px] font-semibold tracking-wide text-white/65">
12895 NAVIGATION
@@ -138,33 +105,17 @@ export default function AdminShellClient(props: { children: React.ReactNode; bui
138105 <aside className="hidden lg:flex lg:w-[300px] lg:flex-col lg:gap-4 lg:border-r lg:border-white/12 lg:bg-black/35 lg:backdrop-blur-xl">
139106 <div className="p-6">
140107 <div className="flex items-center justify-between">
141 <div>
142 <div className="text-sm font-semibold tracking-wide text-white/95">Dominat8</div>
143 <div className="text-xs text-white/70">Admin Console</div>
108 <div className="flex items-center gap-2">
109 <GlossyIcon name="zap" size={32} />
110 <div>
111 <div className="text-sm font-semibold tracking-wide text-white/95">Dominat8</div>
112 <div className="text-xs text-white/70">Admin Console</div>
113 </div>
144114 </div>
145115 <span className="rounded-full border border-white/15 bg-white/8 px-2 py-1 text-[10px] text-white/80">
146116 v1
147117 </span>
148118 </div>
149
150 <div className="mt-5">
151 <Card title="Quick actions">
152 <div className="mt-1 flex flex-col gap-2">
153 <Link
154 href="/admin/projects"
155 className="rounded-xl border border-white/12 bg-white/6 px-3 py-2 text-xs text-white/90 hover:bg-white/10"
156 >
157 View Projects →
158 </Link>
159 <Link
160 href="/admin/agents"
161 className="rounded-xl border border-white/12 bg-white/6 px-3 py-2 text-xs text-white/90 hover:bg-white/10"
162 >
163 Agents & Bundles →
164 </Link>
165 </div>
166 </Card>
167 </div>
168119 </div>
169120
170121 <nav className="px-4 pb-6">
@@ -173,7 +124,9 @@ export default function AdminShellClient(props: { children: React.ReactNode; bui
173124 </div>
174125 <NavList nav={nav} pathname={pathname} />
175126 <div className="mt-6 rounded-2xl border border-white/12 bg-white/6 p-4">
176 <div className="text-xs font-semibold text-white/90">Status</div>
127 <div className="text-xs font-semibold text-white/90" style={{ display: "flex", alignItems: "center", gap: 6 }}>
128 <GlossyIconInline name="shield" size={14} /> Status
129 </div>
177130 <div className="mt-2 text-[11px] text-white/70">High-contrast mode enabled.</div>
178131 <div className="mt-3 flex items-center gap-2">
179132 <span className="h-2 w-2 rounded-full bg-emerald-400/90" />
@@ -192,12 +145,14 @@ export default function AdminShellClient(props: { children: React.ReactNode; bui
192145 className="lg:hidden rounded-2xl border border-white/15 bg-white/8 px-3 py-2 text-xs text-white/90 hover:bg-white/12"
193146 onClick={() => setOpen(true)}
194147 aria-label="Open menu"
148 style={{ display: "inline-flex", alignItems: "center", gap: 6 }}
195149 >
150 <GlossyIconInline name="layers" size={14} />
196151 Menu
197152 </button>
198153
199 <div className="hidden sm:grid h-9 w-9 rounded-2xl border border-white/12 bg-white/8 place-items-center">
200 <span className="text-xs font-semibold text-white/90">D8</span>
154 <div className="hidden sm:block">
155 <GlossyIcon name="zap" size={36} />
201156 </div>
202157
203158 <div>
@@ -210,13 +165,17 @@ export default function AdminShellClient(props: { children: React.ReactNode; bui
210165 <Link
211166 href="/"
212167 className="rounded-xl border border-white/15 bg-white/8 px-3 py-2 text-xs text-white/90 hover:bg-white/12"
168 style={{ display: "inline-flex", alignItems: "center", gap: 6 }}
213169 >
214 View Marketing →
170 <GlossyIconInline name="eye" size={14} />
171 View Site
215172 </Link>
216173 <Link
217174 href="/admin/settings"
218175 className="rounded-xl border border-white/12 bg-white/6 px-3 py-2 text-xs text-white/90 hover:bg-white/10"
176 style={{ display: "inline-flex", alignItems: "center", gap: 6 }}
219177 >
178 <GlossyIconInline name="settings" size={14} />
220179 Settings
221180 </Link>
222181 </div>
@@ -228,12 +187,13 @@ export default function AdminShellClient(props: { children: React.ReactNode; bui
228187
229188 {/* Footer stamp */}
230189 <div className="mx-auto max-w-6xl px-4 pb-10">
231 <div className="rounded-2xl border border-white/10 bg-black/30 p-4 text-[11px] text-white/70">
232 BUILD_STAMP: <span className="font-mono text-white/85">ADMIN_UI_CONTRAST_20260127_193346</span>
190 <div className="rounded-2xl border border-white/10 bg-black/30 p-4 text-[11px] text-white/70" style={{ display: "flex", alignItems: "center", gap: 6 }}>
191 <GlossyIconInline name="code" size={12} />
192 BUILD_STAMP: <span className="font-mono text-white/85">{props.buildStamp}</span>
233193 </div>
234194 </div>
235195 </main>
236196 </div>
237197 </div>
238198 );
239}
\ No newline at end of file
199}
Addedsrc/components/ui/GlossyIcon.tsx+188−0View fileUnifiedSplit
@@ -0,0 +1,188 @@
1import React from "react";
2
3type IconName =
4 | "rocket"
5 | "bolt"
6 | "shield"
7 | "chart"
8 | "globe"
9 | "code"
10 | "star"
11 | "users"
12 | "mail"
13 | "credit-card"
14 | "settings"
15 | "layers"
16 | "question"
17 | "document"
18 | "eye"
19 | "play"
20 | "check"
21 | "arrow-right"
22 | "sparkle"
23 | "cpu"
24 | "target"
25 | "zap"
26 | "palette"
27 | "lock"
28 | "clock"
29 | "briefcase";
30
31type GlossyIconProps = {
32 name: IconName;
33 size?: number;
34 className?: string;
35 style?: React.CSSProperties;
36};
37
38const iconPaths: Record<IconName, string> = {
39 rocket:
40 "M12 2C10.08 4.08 8.5 7.5 8.5 10.5c0 1.5.5 2.88 1.35 4L7 17.5l2.5.5L10 21l2-3 2 3 .5-3 2.5-.5-2.85-3c.85-1.12 1.35-2.5 1.35-4 0-3-1.58-6.42-3.5-8.5zM12 12a2 2 0 110-4 2 2 0 010 4z",
41 bolt:
42 "M13 2L4.09 12.63a1 1 0 00.78 1.62H11v5.75a.5.5 0 00.9.3L20.91 9.37a1 1 0 00-.78-1.62H13V2.25a.5.5 0 00-.9-.3L13 2z",
43 shield:
44 "M12 2L4 5v6.09c0 5.05 3.41 9.76 8 10.91 4.59-1.15 8-5.86 8-10.91V5l-8-3zm-1 14.5l-3.5-3.5 1.41-1.41L11 13.67l5.09-5.09L17.5 10 11 16.5z",
45 chart:
46 "M3 3v18h18M9 17V9m4 8V5m4 12v-4",
47 globe:
48 "M12 2a10 10 0 100 20 10 10 0 000-20zm0 2c1.5 0 3.5 3.5 3.5 8s-2 8-3.5 8-3.5-3.5-3.5-8 2-8 3.5-8zM2 12h20M4.93 7h14.14M4.93 17h14.14",
49 code:
50 "M16 18l6-6-6-6M8 6l-6 6 6 6",
51 star:
52 "M12 2l3.09 6.26L22 9.27l-5 4.87L18.18 21 12 17.27 5.82 21 7 14.14l-5-4.87 6.91-1.01L12 2z",
53 users:
54 "M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2M9 11a4 4 0 100-8 4 4 0 000 8zm14 10v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75",
55 mail:
56 "M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2zm16 2l-8 5-8-5",
57 "credit-card":
58 "M1 10h22M3 4h18a2 2 0 012 2v12a2 2 0 01-2 2H3a2 2 0 01-2-2V6a2 2 0 012-2z",
59 settings:
60 "M12 15a3 3 0 100-6 3 3 0 000 6zm8.7-2.7l-1.2-.7c.1-.5.1-1.1 0-1.6l1.2-.7a.5.5 0 00.2-.6l-1.5-2.6a.5.5 0 00-.6-.2l-1.2.7a6 6 0 00-1.4-.8l-.2-1.4A.5.5 0 0015.5 4h-3a.5.5 0 00-.5.4l-.2 1.4c-.5.2-1 .5-1.4.8l-1.2-.7a.5.5 0 00-.6.2L7.1 8.7a.5.5 0 00.2.6l1.2.7c-.1.5-.1 1.1 0 1.6l-1.2.7a.5.5 0 00-.2.6l1.5 2.6a.5.5 0 00.6.2l1.2-.7c.4.3.9.6 1.4.8l.2 1.4a.5.5 0 00.5.4h3a.5.5 0 00.5-.4l.2-1.4c.5-.2 1-.5 1.4-.8l1.2.7a.5.5 0 00.6-.2l1.5-2.6a.5.5 0 00-.3-.6z",
61 layers:
62 "M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5",
63 question:
64 "M12 22a10 10 0 100-20 10 10 0 000 20zm0-6v-1a3 3 0 10-3-3h2a1 1 0 112 0c0 .6-.4 1.1-1 1.4A2 2 0 0011 15v1h2zm-1 3h2v-2h-2v2z",
65 document:
66 "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-2 0v6h6M16 13H8m8 4H8m2-8H8",
67 eye:
68 "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8zm11 3a3 3 0 100-6 3 3 0 000 6z",
69 play:
70 "M5 3l14 9-14 9V3z",
71 check:
72 "M20 6L9 17l-5-5",
73 "arrow-right":
74 "M5 12h14m-7-7l7 7-7 7",
75 sparkle:
76 "M12 2l2.4 7.2L22 12l-7.6 2.8L12 22l-2.4-7.2L2 12l7.6-2.8L12 2z",
77 cpu:
78 "M6 4h12a2 2 0 012 2v12a2 2 0 01-2 2H6a2 2 0 01-2-2V6a2 2 0 012-2zm3 0V2m6 2V2m3 6h2m-2 6h2M4 8H2m2 6H2m7 4v2m6-2v2M9 9h6v6H9V9z",
79 target:
80 "M12 22a10 10 0 100-20 10 10 0 000 20zm0-6a4 4 0 100-8 4 4 0 000 8zm0-2a2 2 0 100-4 2 2 0 000 4z",
81 zap:
82 "M13 2L3 14h9l-1 8 10-12h-9l1-8z",
83 palette:
84 "M12 2a10 10 0 00-1 19.95A2 2 0 0013 20v-.74A2 2 0 0114.94 17h1.31A3.75 3.75 0 0020 13.25 10 10 0 0012 2zM8.5 8a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm4-2a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm4 4a1.5 1.5 0 110 3 1.5 1.5 0 010-3z",
85 lock:
86 "M19 11H5a2 2 0 00-2 2v7a2 2 0 002 2h14a2 2 0 002-2v-7a2 2 0 00-2-2zm-2 0V7a5 5 0 00-10 0v4m5 4v3",
87 clock:
88 "M12 22a10 10 0 100-20 10 10 0 000 20zm0-14v6l4 2",
89 briefcase:
90 "M20 7H4a2 2 0 00-2 2v10a2 2 0 002 2h16a2 2 0 002-2V9a2 2 0 00-2-2zM16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2",
91};
92
93export default function GlossyIcon({ name, size = 40, className, style }: GlossyIconProps) {
94 const id = `glossy-${name}-${Math.random().toString(36).slice(2, 8)}`;
95 const path = iconPaths[name] || iconPaths.star;
96 const isStrokeIcon = ["chart", "globe", "code", "mail", "credit-card", "layers", "eye", "check", "arrow-right", "clock", "briefcase", "users", "cpu"].includes(name);
97
98 return (
99 <div
100 className={className}
101 style={{
102 width: size,
103 height: size,
104 borderRadius: size * 0.3,
105 background:
106 "linear-gradient(135deg, rgba(168,85,247,0.25), rgba(59,130,246,0.18))",
107 border: "1px solid rgba(255,255,255,0.15)",
108 boxShadow:
109 `0 0 ${size * 0.5}px rgba(168,85,247,0.15), 0 0 ${size * 0.25}px rgba(59,130,246,0.10), inset 0 1px 0 rgba(255,255,255,0.12)`,
110 display: "flex",
111 alignItems: "center",
112 justifyContent: "center",
113 position: "relative",
114 overflow: "hidden",
115 flexShrink: 0,
116 ...style,
117 }}
118 >
119 {/* Glass highlight */}
120 <div
121 style={{
122 position: "absolute",
123 top: 0,
124 left: "10%",
125 right: "10%",
126 height: "45%",
127 background:
128 "linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0))",
129 borderRadius: `0 0 ${size * 0.5}px ${size * 0.5}px`,
130 pointerEvents: "none",
131 }}
132 />
133 <svg
134 width={size * 0.5}
135 height={size * 0.5}
136 viewBox="0 0 24 24"
137 fill="none"
138 xmlns="http://www.w3.org/2000/svg"
139 style={{ position: "relative", zIndex: 1 }}
140 >
141 <defs>
142 <linearGradient id={id} x1="0" y1="0" x2="24" y2="24" gradientUnits="userSpaceOnUse">
143 <stop offset="0%" stopColor="rgba(200,170,255,1)" />
144 <stop offset="100%" stopColor="rgba(120,180,255,1)" />
145 </linearGradient>
146 </defs>
147 <path
148 d={path}
149 {...(isStrokeIcon
150 ? { stroke: `url(#${id})`, strokeWidth: 2, strokeLinecap: "round" as const, strokeLinejoin: "round" as const }
151 : { fill: `url(#${id})` })}
152 />
153 </svg>
154 </div>
155 );
156}
157
158export function GlossyIconInline({ name, size = 20 }: { name: IconName; size?: number }) {
159 const id = `gi-${name}-${Math.random().toString(36).slice(2, 8)}`;
160 const path = iconPaths[name] || iconPaths.star;
161 const isStrokeIcon = ["chart", "globe", "code", "mail", "credit-card", "layers", "eye", "check", "arrow-right", "clock", "briefcase", "users", "cpu"].includes(name);
162
163 return (
164 <svg
165 width={size}
166 height={size}
167 viewBox="0 0 24 24"
168 fill="none"
169 xmlns="http://www.w3.org/2000/svg"
170 style={{ display: "inline-block", verticalAlign: "middle", flexShrink: 0 }}
171 >
172 <defs>
173 <linearGradient id={id} x1="0" y1="0" x2="24" y2="24" gradientUnits="userSpaceOnUse">
174 <stop offset="0%" stopColor="rgba(200,170,255,1)" />
175 <stop offset="100%" stopColor="rgba(120,180,255,1)" />
176 </linearGradient>
177 </defs>
178 <path
179 d={path}
180 {...(isStrokeIcon
181 ? { stroke: `url(#${id})`, strokeWidth: 2, strokeLinecap: "round" as const, strokeLinejoin: "round" as const }
182 : { fill: `url(#${id})` })}
183 />
184 </svg>
185 );
186}
187
188export type { IconName };
Addedsrc/components/ui/GlossyPageShell.tsx+299−0View fileUnifiedSplit
@@ -0,0 +1,299 @@
1import React from "react";
2import Link from "next/link";
3import GlossyIcon, { GlossyIconInline } from "./GlossyIcon";
4import type { IconName } from "./GlossyIcon";
5
6export function GlossyNav() {
7 return (
8 <div
9 style={{
10 display: "flex",
11 alignItems: "center",
12 justifyContent: "space-between",
13 gap: 12,
14 padding: "10px 0 22px",
15 }}
16 >
17 <Link
18 href="/"
19 aria-label="Dominat8 Home"
20 style={{
21 display: "flex",
22 alignItems: "center",
23 gap: 10,
24 textDecoration: "none",
25 color: "#F3EEFF",
26 }}
27 >
28 <GlossyIcon name="zap" size={34} />
29 <div style={{ display: "flex", flexDirection: "column", lineHeight: 1.05 }}>
30 <div
31 style={{
32 fontSize: 13,
33 letterSpacing: "0.22em",
34 textTransform: "uppercase",
35 opacity: 0.9,
36 fontWeight: 700,
37 }}
38 >
39 Dominat8
40 </div>
41 <div style={{ fontSize: 12, opacity: 0.7, marginTop: 3 }}>
42 AI website builder
43 </div>
44 </div>
45 </Link>
46
47 <nav
48 aria-label="Top navigation"
49 style={{
50 display: "flex",
51 alignItems: "center",
52 gap: 10,
53 flexWrap: "wrap",
54 justifyContent: "flex-end",
55 }}
56 >
57 {[
58 { href: "/templates", label: "Templates", icon: "layers" as const },
59 { href: "/pricing", label: "Pricing", icon: "credit-card" as const },
60 { href: "/use-cases", label: "Use Cases", icon: "briefcase" as const },
61 { href: "/faq", label: "FAQ", icon: "question" as const },
62 ].map((l) => (
63 <Link
64 key={l.href}
65 href={l.href}
66 style={{
67 fontSize: 13,
68 color: "rgba(237,234,247,0.82)",
69 textDecoration: "none",
70 padding: "8px 12px",
71 borderRadius: 10,
72 border: "1px solid rgba(255,255,255,0.08)",
73 background: "rgba(255,255,255,0.03)",
74 display: "inline-flex",
75 alignItems: "center",
76 gap: 6,
77 }}
78 >
79 <GlossyIconInline name={l.icon} size={14} />
80 {l.label}
81 </Link>
82 ))}
83 </nav>
84 </div>
85 );
86}
87
88export function GlossyFooter() {
89 return (
90 <div
91 style={{
92 marginTop: 40,
93 display: "flex",
94 justifyContent: "space-between",
95 gap: 12,
96 flexWrap: "wrap",
97 alignItems: "center",
98 opacity: 0.85,
99 fontSize: 12,
100 color: "rgba(237,234,247,0.65)",
101 borderTop: "1px solid rgba(255,255,255,0.08)",
102 paddingTop: 18,
103 }}
104 >
105 <div style={{ display: "flex", alignItems: "center", gap: 6 }}>
106 <GlossyIconInline name="zap" size={12} />
107 © {new Date().getFullYear()} Dominat8
108 </div>
109 <div style={{ display: "flex", gap: 14, flexWrap: "wrap" }}>
110 {[
111 { href: "/about", label: "About" },
112 { href: "/templates", label: "Templates" },
113 { href: "/gallery", label: "Gallery" },
114 { href: "/pricing", label: "Pricing" },
115 { href: "/faq", label: "FAQ" },
116 { href: "/contact", label: "Contact" },
117 { href: "/privacy", label: "Privacy" },
118 { href: "/terms", label: "Terms" },
119 ].map((l) => (
120 <Link
121 key={l.href}
122 href={l.href}
123 style={{
124 color: "rgba(237,234,247,0.70)",
125 textDecoration: "none",
126 borderBottom: "1px solid rgba(237,234,247,0.20)",
127 paddingBottom: 2,
128 }}
129 >
130 {l.label}
131 </Link>
132 ))}
133 </div>
134 </div>
135 );
136}
137
138export function GlossyPageHeader({
139 icon,
140 eyebrow,
141 title,
142 subtitle,
143 ctaHref,
144 ctaLabel,
145 ctaIcon,
146}: {
147 icon: IconName;
148 eyebrow: string;
149 title: string;
150 subtitle: string;
151 ctaHref?: string;
152 ctaLabel?: string;
153 ctaIcon?: IconName;
154}) {
155 return (
156 <div style={{ marginBottom: 32 }}>
157 <div
158 style={{
159 display: "inline-flex",
160 alignItems: "center",
161 gap: 8,
162 padding: "8px 14px",
163 borderRadius: 999,
164 background: "linear-gradient(90deg, rgba(168,85,247,0.18), rgba(59,130,246,0.10))",
165 border: "1px solid rgba(255,255,255,0.12)",
166 boxShadow: "0 10px 40px rgba(168,85,247,0.08)",
167 fontSize: 11,
168 fontWeight: 800,
169 letterSpacing: "0.14em",
170 textTransform: "uppercase",
171 color: "rgba(237,234,247,0.85)",
172 }}
173 >
174 <GlossyIconInline name={icon} size={14} />
175 {eyebrow}
176 </div>
177
178 <div style={{ display: "flex", alignItems: "flex-end", justifyContent: "space-between", gap: 16, flexWrap: "wrap" }}>
179 <div>
180 <h1
181 style={{
182 marginTop: 16,
183 fontSize: 40,
184 lineHeight: 1.05,
185 letterSpacing: "-0.02em",
186 fontWeight: 900,
187 color: "#F6F2FF",
188 textShadow: "0 20px 80px rgba(168,85,247,0.12)",
189 }}
190 >
191 {title}
192 </h1>
193 <p
194 style={{
195 marginTop: 12,
196 maxWidth: 600,
197 fontSize: 15,
198 lineHeight: 1.55,
199 color: "rgba(237,234,247,0.72)",
200 }}
201 >
202 {subtitle}
203 </p>
204 </div>
205
206 {ctaHref && ctaLabel && (
207 <Link
208 href={ctaHref}
209 style={{
210 display: "inline-flex",
211 alignItems: "center",
212 gap: 8,
213 padding: "10px 16px",
214 borderRadius: 14,
215 textDecoration: "none",
216 fontWeight: 800,
217 fontSize: 13,
218 color: "#07070B",
219 background: "linear-gradient(90deg, rgba(168,85,247,1), rgba(59,130,246,1))",
220 boxShadow: "0 18px 55px rgba(168,85,247,0.20), 0 10px 24px rgba(59,130,246,0.12)",
221 border: "1px solid rgba(255,255,255,0.10)",
222 flexShrink: 0,
223 }}
224 >
225 {ctaIcon && <GlossyIconInline name={ctaIcon} size={14} />}
226 {ctaLabel}
227 </Link>
228 )}
229 </div>
230 </div>
231 );
232}
233
234export function GlossyCard({
235 icon,
236 title,
237 children,
238 kicker,
239}: {
240 icon: IconName;
241 title: string;
242 children: React.ReactNode;
243 kicker?: string;
244}) {
245 return (
246 <div
247 style={{
248 borderRadius: 18,
249 padding: 20,
250 background: "linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02))",
251 border: "1px solid rgba(255,255,255,0.10)",
252 boxShadow: "0 18px 55px rgba(0,0,0,0.35)",
253 }}
254 >
255 <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
256 <GlossyIcon name={icon} size={38} />
257 {kicker && (
258 <span
259 style={{
260 fontSize: 10,
261 fontWeight: 800,
262 letterSpacing: "0.14em",
263 textTransform: "uppercase",
264 color: "rgba(168,85,247,0.70)",
265 }}
266 >
267 {kicker}
268 </span>
269 )}
270 </div>
271 <div style={{ marginTop: 12, fontSize: 15, fontWeight: 800, color: "rgba(237,234,247,0.95)" }}>{title}</div>
272 <div style={{ marginTop: 6, fontSize: 13, lineHeight: 1.55, color: "rgba(237,234,247,0.68)" }}>{children}</div>
273 </div>
274 );
275}
276
277export default function GlossyPageShell({ children }: { children: React.ReactNode }) {
278 return (
279 <main
280 style={{
281 minHeight: "100vh",
282 background:
283 "radial-gradient(1200px 800px at 65% 5%, rgba(168,85,247,0.20), rgba(0,0,0,0) 60%)," +
284 " radial-gradient(900px 700px at 15% 20%, rgba(59,130,246,0.12), rgba(0,0,0,0) 62%)," +
285 " linear-gradient(180deg, #07070B 0%, #07070B 40%, #05050A 100%)",
286 color: "#EDEAF7",
287 fontFamily:
288 "ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji'",
289 padding: "28px 16px 56px",
290 }}
291 >
292 <div style={{ width: "100%", maxWidth: 1160, margin: "0 auto" }}>
293 <GlossyNav />
294 {children}
295 <GlossyFooter />
296 </div>
297 </main>
298 );
299}
Deletedsrc/middleware.ts+0−49View fileUnifiedSplit
@@ -1,49 +0,0 @@
1import { NextResponse } from "next/server";
2import type { NextRequest } from "next/server";
3
4export function middleware(req: NextRequest) {
5
6
7 // === D8_ENGINE_0072B_TRUTH_AND_LEGACY ===
8 const __d8_path = req.nextUrl.pathname
9 const __d8_stamp = "D8_MW_TRUTH_0072B_20260128_234407"
10
11 if (__d8_path === "/api/__probe__" || __d8_path === "/api/__probe__/") {
12 const u = req.nextUrl.clone()
13 u.pathname = "/api/probe"
14 const res = NextResponse.redirect(u, 307)
15 res.headers.set("x-dominat8-mw-legacy", "redirect307")
16 res.headers.set("x-dominat8-mw-hit", __d8_stamp)
17 res.headers.set("x-dominat8-mw-path", __d8_path)
18 return res
19 }
20
21 if (__d8_path === "/api/__ping__" || __d8_path === "/api/__ping__/") {
22 const u = req.nextUrl.clone()
23 u.pathname = "/api/ping"
24 const res = NextResponse.redirect(u, 307)
25 res.headers.set("x-dominat8-mw-legacy", "redirect307")
26 res.headers.set("x-dominat8-mw-hit", __d8_stamp)
27 res.headers.set("x-dominat8-mw-path", __d8_path)
28 return res
29 }
30 // === /D8_ENGINE_0072B_TRUTH_AND_LEGACY ===
31const { pathname } = req.nextUrl;
32 if (pathname.startsWith("/api/")) {
33 const res = NextResponse.next(); res.headers.set("x-dominat8-mw", "1"); return res;
34}
35// Do NOT rewrite/redirect routes here. Just set anti-cache headers.
36 const res = NextResponse.next();
37 res.headers.set("Cache-Control", "no-store, no-cache, must-revalidate, max-age=0");
38 res.headers.set("Pragma", "no-cache");
39 res.headers.set("Expires", "0");
40 res.headers.set("Surrogate-Control", "no-store");
41 return res;
42}
43
44export const config = {
45 matcher: ["/api/:path*", "/((?!_next/static|_next/image|favicon.ico).*)",
46 "/api/__probe__",
47 "/api/__ping__",
48 ],
49};
\ No newline at end of file
500
c comment · e edit title · m merge · a approve · r request changes · ? shortcuts