Server-first rendering
Useful HTML is rendered first; reactive scopes hydrate only where declared.
WRNexusJS v0.2.15
Build from the server.
Ship only what matters.
WRNexusJS is an SSR-first, Bun-native full-stack framework. Build typed pages, APIs, validated forms, realtime rooms, secure sessions, workspaces, and optional mobile experiences with the .wrn component language.
Packages require approved private-registry access. No public installation command is currently available.
+ W WRNexusJS
+
+ Private Developer PreviewBuild from the server.
}
}
\ No newline at end of file
diff --git a/app/styles/global.css b/app/styles/global.css
index 9c7aaf83..1565cc07 100644
--- a/app/styles/global.css
+++ b/app/styles/global.css
@@ -1040,3 +1040,228 @@ footer a {
padding-top: 30px;
}
}
+
+/* Marketing shell restored from the visual system at 5eea460. */
+.marketing-shell {
+ background:
+ radial-gradient(circle at 50% 18%, rgba(99, 102, 241, 0.12), transparent 30rem),
+ radial-gradient(circle at 92% 88%, rgba(168, 85, 247, 0.1), transparent 32rem), var(--bg);
+}
+.marketing-header {
+ grid-template-columns: 1fr auto 1fr;
+}
+.marketing-header > nav {
+ justify-self: center;
+}
+.marketing-mobile-nav {
+ display: none;
+}
+.marketing-main {
+ width: 100%;
+}
+.marketing-main .marketing-hero {
+ min-height: 860px;
+ padding: 96px clamp(20px, 5vw, 80px) 120px;
+}
+.marketing-hero .status {
+ display: none;
+}
+.marketing-hero .eyebrow {
+ margin-bottom: 0.5rem;
+}
+.marketing-hero h1 {
+ max-width: 1080px;
+ font-size: clamp(4rem, 7.5vw, 7.5rem);
+}
+.marketing-hero > p:not(.access-note) {
+ max-width: 760px;
+}
+.marketing-hero .access-note {
+ width: auto;
+ margin-top: 1rem;
+ font-size: 0.78rem !important;
+}
+.marketing-hero .code-window {
+ width: min(760px, 100%);
+ margin-top: 3.5rem;
+ border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
+ box-shadow: 0 28px 90px rgba(0, 0, 0, 0.36);
+}
+.marketing-hero .code-window > span::before {
+ content: "● ● ● ";
+ color: #64748b;
+ letter-spacing: 0.15em;
+}
+.marketing-section,
+.marketing-cta {
+ width: min(1180px, calc(100% - 40px));
+ margin: 0 auto;
+ padding: clamp(5rem, 9vw, 9rem) 0;
+ border-top: 1px solid var(--border);
+}
+.marketing-section > .eyebrow,
+.marketing-cta > .eyebrow {
+ display: block;
+ margin-bottom: 1rem;
+}
+.marketing-section > h2,
+.marketing-cta h2 {
+ max-width: 800px;
+ margin: 0 0 2.5rem;
+ font-size: clamp(2.4rem, 5vw, 4.8rem);
+ line-height: 1.03;
+ letter-spacing: -0.055em;
+}
+.marketing-main .feature-grid {
+ padding-bottom: 0;
+}
+.marketing-main .feature-grid article {
+ min-height: 220px;
+ padding: 2rem;
+ box-shadow: none;
+}
+.marketing-main .feature-grid article b {
+ color: var(--brand);
+ font-size: 0.72rem;
+ letter-spacing: 0.12em;
+}
+.marketing-main > section:nth-child(3) {
+ display: grid;
+ grid-template-columns: minmax(240px, 0.65fr) minmax(0, 1.35fr);
+ gap: clamp(2rem, 7vw, 7rem);
+ align-items: start;
+}
+.marketing-main > section:nth-child(3) > h2 {
+ margin-top: 1.2rem;
+}
+.marketing-main > section:nth-child(3) > pre {
+ margin: 0;
+}
+.marketing-main .lifecycle {
+ grid-template-columns: repeat(5, 1fr);
+}
+.marketing-main .lifecycle li {
+ min-height: 150px;
+ padding: 1.25rem;
+ background: linear-gradient(
+ 145deg,
+ var(--surface),
+ color-mix(in srgb, var(--brand) 5%, var(--surface))
+ );
+}
+.marketing-main .lifecycle li b {
+ color: var(--brand);
+ font-size: 0.7rem;
+}
+.marketing-main > section:nth-child(5) .feature-grid {
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+.marketing-main > section:nth-child(5) .feature-grid article {
+ min-height: 260px;
+}
+.marketing-main > section:nth-child(6) .table-wrap {
+ background: var(--surface);
+}
+.marketing-main > section:nth-child(7) {
+ text-align: center;
+ border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
+ border-radius: 24px;
+ padding-inline: 2rem;
+ background: radial-gradient(
+ circle at 50% 0,
+ color-mix(in srgb, var(--brand) 14%, transparent),
+ transparent 65%
+ );
+}
+.marketing-main > section:nth-child(7) h2 {
+ margin-inline: auto;
+}
+.marketing-main > section:nth-child(7) .actions {
+ justify-content: center;
+}
+
+@media (max-width: 900px) {
+ .marketing-header {
+ grid-template-columns: 1fr auto;
+ }
+ .marketing-header > nav {
+ display: none;
+ }
+ .marketing-header .topbar-actions {
+ display: flex;
+ }
+ .marketing-header .preview-pill {
+ display: none;
+ }
+ .marketing-mobile-nav {
+ display: block;
+ border-bottom: 1px solid var(--border);
+ padding: 0.8rem 20px;
+ background: color-mix(in srgb, var(--bg) 88%, transparent);
+ }
+ .marketing-mobile-nav summary {
+ cursor: pointer;
+ font-weight: 700;
+ }
+ .marketing-mobile-nav nav {
+ display: grid;
+ gap: 0.8rem;
+ padding: 1rem 0 0.35rem;
+ }
+ .marketing-main .lifecycle {
+ grid-template-columns: repeat(2, 1fr);
+ }
+ .marketing-main > section:nth-child(3) {
+ grid-template-columns: 1fr;
+ }
+}
+
+@media (max-width: 600px) {
+ .marketing-main .marketing-hero {
+ min-height: auto;
+ padding: 72px 20px 86px;
+ }
+ .marketing-hero h1 {
+ width: calc(100vw - 40px);
+ max-width: calc(100vw - 40px);
+ font-size: clamp(2.35rem, 11vw, 3rem);
+ line-height: 0.98;
+ overflow-wrap: normal;
+ }
+ .marketing-hero h1 em {
+ display: block;
+ max-width: 100%;
+ font-size: 0.94em;
+ }
+ .marketing-hero > p,
+ .marketing-hero .actions {
+ width: calc(100vw - 40px);
+ max-width: calc(100vw - 40px);
+ }
+ .marketing-hero .actions {
+ justify-content: center;
+ }
+ .marketing-hero .actions a {
+ width: 100%;
+ }
+ .marketing-hero .code-window {
+ margin-top: 2.5rem;
+ }
+ .marketing-hero .code-window pre {
+ max-height: 360px;
+ }
+ .marketing-section,
+ .marketing-cta {
+ width: calc(100% - 40px);
+ padding-block: 4.5rem;
+ }
+ .marketing-section > h2,
+ .marketing-cta h2 {
+ font-size: clamp(2.2rem, 11vw, 3.2rem);
+ }
+ .marketing-main .feature-grid,
+ .marketing-main > section:nth-child(5) .feature-grid,
+ .marketing-main .lifecycle {
+ grid-template-columns: 1fr;
+ }
+}
diff --git a/docs/audits/recovery/README.md b/docs/audits/recovery/README.md
new file mode 100644
index 00000000..fb495531
--- /dev/null
+++ b/docs/audits/recovery/README.md
@@ -0,0 +1,19 @@
+# Premium homepage recovery visual audit
+
+Date: 2026-07-12
+
+- Current source commit before recovery: `d150e99`
+- Last-good visual source: `5eea460`
+- Recovery branch: `recovery/restore-premium-homepage`
+- Production build: passed, 67 page routes
+- HTTP smoke audit: 72 discovery/static URLs passed
+- Internal link smoke audit: 64 unique internal paths passed
+
+Screenshots cover 1440×900, 1280×800, 1024×768, 768×1024, 430×932,
+390×844, and 360×800. Microsoft Edge headless enforces a minimum CSS layout
+viewport near 500px; the three narrower bitmap captures therefore crop that
+minimum-width layout. The site CSS still applies explicit `100vw` bounds at the
+mobile breakpoint, but owner approval should include a real-device check before
+deployment.
+
+No deployment or production push was performed.
diff --git a/docs/audits/recovery/home-1024x768.png b/docs/audits/recovery/home-1024x768.png
new file mode 100644
index 00000000..99d19ef1
Binary files /dev/null and b/docs/audits/recovery/home-1024x768.png differ
diff --git a/docs/audits/recovery/home-1280x800.png b/docs/audits/recovery/home-1280x800.png
new file mode 100644
index 00000000..0af3e361
Binary files /dev/null and b/docs/audits/recovery/home-1280x800.png differ
diff --git a/docs/audits/recovery/home-1440x900.png b/docs/audits/recovery/home-1440x900.png
new file mode 100644
index 00000000..65bf9b7f
Binary files /dev/null and b/docs/audits/recovery/home-1440x900.png differ
diff --git a/docs/audits/recovery/home-360x800.png b/docs/audits/recovery/home-360x800.png
new file mode 100644
index 00000000..0a1d0bc9
Binary files /dev/null and b/docs/audits/recovery/home-360x800.png differ
diff --git a/docs/audits/recovery/home-390x844.png b/docs/audits/recovery/home-390x844.png
new file mode 100644
index 00000000..2908f234
Binary files /dev/null and b/docs/audits/recovery/home-390x844.png differ
diff --git a/docs/audits/recovery/home-430x932.png b/docs/audits/recovery/home-430x932.png
new file mode 100644
index 00000000..b47dcacd
Binary files /dev/null and b/docs/audits/recovery/home-430x932.png differ
diff --git a/docs/audits/recovery/home-768x1024.png b/docs/audits/recovery/home-768x1024.png
new file mode 100644
index 00000000..6e4dc199
Binary files /dev/null and b/docs/audits/recovery/home-768x1024.png differ
diff --git a/docs/audits/recovery/packages-1440x900.png b/docs/audits/recovery/packages-1440x900.png
new file mode 100644
index 00000000..f6c9b270
Binary files /dev/null and b/docs/audits/recovery/packages-1440x900.png differ
diff --git a/scripts/generate-portal.ts b/scripts/generate-portal.ts
index b6aac56a..e4b9ac39 100644
--- a/scripts/generate-portal.ts
+++ b/scripts/generate-portal.ts
@@ -47,6 +47,45 @@ function shell(title: string, description: string, body: string, section = "Docu
}`;
}
+function marketingShell(description: string, body: string) {
+ const codeCard = `Menu
WRNexusJS v0.2.15
Build from the server.
Ship only what matters.
WRNexusJS is an SSR-first, Bun-native full-stack framework. Build typed pages, APIs, validated forms, realtime rooms, secure sessions, workspaces, and optional mobile experiences with the .wrn component language.
Private developer preview. Request access to the package registry.
app/pages/dashboard.wrn
page Dashboard {
+ ssr { api tasks GET /api/tasks { return tasks } }
+ view {
+ <main>
+ <h1>Tasks</h1>
+ {#each tasks as task}
+ <article>{task.title}</article>
+ {:empty}
+ <p>Nothing waiting.</p>
+ {/each}
+ </main>
+ }
+}Why WRNexusJS
.wrn components
Pages, layouts, props, state, events, server loops, and directives live in a focused language.
Bun-native runtime
The runtime is Bun. Node compatibility is not claimed.
Typed data and validation
Database queries and shared validation connect server routes to forms.
Integrated security
CSP, CSRF, sessions, authorization, encryption, and safe output are framework primitives.
Realtime and workspaces
Rooms, Redis pub/sub, and multi-app gateways support live and isolated applications.
A small full-stack flow
// app/schemas/contact.ts
import { v } from "@wrnexus/validation";
@@ -26,7 +38,7 @@ export const POST = async (ctx) => {
Production proof
WorkRoot
Public creator/company site and approved WRNexusJS production showcase.
wrnexusjs.dev
This documentation application runs WRNexusJS 0.2.15.
Capability status
Capability Status Details SSR, routing, compiler, APIs Preview Installed in 0.2.15; public support policy pending. Mobile/native Experimental Capacitor compatibility and native generation have platform limitations. Durable queues Experimental Production durability requires an appropriate driver strategy.
Continue exploring
app/pages/dashboard.wrn
`;
+ const marketingBody = body
+ .replace("hero portal-hero", "hero marketing-hero")
+ .replace(
+ "Packages require approved private-registry access. No public installation command is currently available.",
+ "Private developer preview. Request access to the package registry.",
+ )
+ .replace("", `${codeCard}`);
+ return `page Home {
+ seo {
+ title = "WRNexusJS — Bun-native server-first framework"
+ description = "${description.replaceAll('"', "'")}"
+ canonical = "https://wrnexusjs.dev/"
+ }
+ view {
+ Skip to content
+
+ }
+}`;
+}
+
const slugs: Recordpage Dashboard {
+ ssr { api tasks GET /api/tasks { return tasks } }
+ view {
+ <main>
+ <h1>Tasks</h1>
+ {#each tasks as task}
+ <article>{task.title}</article>
+ {:empty}
+ <p>Nothing waiting.</p>
+ {/each}
+ </main>
+ }
+}WRNexusJS v${version}
Build from the server.
Ship only what matters.
WRNexusJS is an SSR-first, Bun-native full-stack framework. Build typed pages, APIs, validated forms, realtime rooms, secure sessions, workspaces, and optional mobile experiences with the .wrn component language.
Packages require approved private-registry access. No public installation command is currently available.
WRNexusJS v${version}
Build from the server.
Ship only what matters.
WRNexusJS is an SSR-first, Bun-native full-stack framework. Build typed pages, APIs, validated forms, realtime rooms, secure sessions, workspaces, and optional mobile experiences with the .wrn component language.
Packages require approved private-registry access. No public installation command is currently available.
Why WRNexusJS
Server-first rendering
Useful HTML is rendered first; reactive scopes hydrate only where declared.
.wrn components
Pages, layouts, props, state, events, server loops, and directives live in a focused language.
Bun-native runtime
The runtime is Bun. Node compatibility is not claimed.
Typed data and validation
Database queries and shared validation connect server routes to forms.
Integrated security
CSP, CSRF, sessions, authorization, encryption, and safe output are framework primitives.
Realtime and workspaces
Rooms, Redis pub/sub, and multi-app gateways support live and isolated applications.
A small full-stack flow
${code(`// app/schemas/contact.ts\nimport { v } from "@wrnexus/validation";\nexport default v.object({ email: v.string().email(), message: v.string().min(10) });\n\n// app/api/contacts.ts\nimport schema from "../schemas/contact";\nimport { parseBody } from "@wrnexus/validation";\nexport const POST = async (ctx) => {\n const result = await parseBody(schema, ctx.req);\n return result.ok ? Response.json({ ok: true }, { status: 201 }) : result.response;\n};`)}Request lifecycle
- RequestSecurity headers and request limits
- MiddlewareAuthentication, policy, and context
- File routePage or API handler
- Compiler + SSRSafe HTML and scoped runtime
- ResponseHTML, JSON, stream, or realtime upgrade
Production proof
WorkRoot
Public creator/company site and approved WRNexusJS production showcase.
wrnexusjs.dev
This documentation application runs WRNexusJS ${version}.
Capability status
| Capability | Status | Details |
|---|---|---|
| SSR, routing, compiler, APIs | Preview | Installed in ${version}; public support policy pending. |
| Mobile/native | Experimental | Capacitor compatibility and native generation have platform limitations. |
| Durable queues | Experimental | Production durability requires an appropriate driver strategy. |