nx_connect_award_page.nx source
↩ module page · 59 lines · 12330 B
1// nx_connect_award_page.nx -- an AWARD-CALIBER showcase page (attacks the ABSENT creativity cells of
2// nx_award_ui_census): generative animated aurora + inline-SVG constellation hero, expressive gradient
3// display type, CSS entrance + scroll-driven (animation-timeline:view) motion, bold palette on dark,
4// asymmetric editorial layout. 100% SOVEREIGN: inline CSS + inline SVG, ZERO external assets, ZERO JS.
5// Still passes the 6 enforcer invariants (canonical --nx- tokens, responsive, reduced-motion,
6// :focus-visible, sovereign, landmarks) -> incredible AND compliant. Writes web_assets/lds_award.html.
7// license_tier: ORIGINAL expect_exit: 0
8import "nx_syscalls_x86_64.nx"
9const K_MAGIC_262144: i64 = 262144
10
11func aw(buf: *u8, off: i64, s: *u8) -> i64 { var o: i64=off; var i: i64=0; while s[i]!=0 { buf[o]=s[i]; o=o+1; i=i+1 } return o }
12
13func main() -> i64 {
14 let out: *u8 = sys_mmap(K_MAGIC_262144)
15 var o: i64 = 0
16
17 o = aw(out, o, "<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"utf-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"><meta name=\"color-scheme\" content=\"dark\"><title>Connect — the people who changed your life</title><style>" as *u8)
18 // ---- tokens (aurora dark theme, canonical --nx- namespace) ----
19 o = aw(out, o, ":root{--nx-color-bg:#0A0A0F;--nx-color-surface:#14141C;--nx-color-ink:#F5F5FA;--nx-color-ink2:#9EA0B8;--nx-color-primary:#6D5DFF;--nx-color-primary2:#8A7BFF;--nx-color-accent:#FF7A59;--nx-color-accent-ink:#1A0E08;--nx-color-line:#26263A;--bg:var(--nx-color-bg);--ink:var(--nx-color-ink);--ink2:var(--nx-color-ink2);--brand:var(--nx-color-primary);--brand2:var(--nx-color-primary2);--accent:var(--nx-color-accent);--line:var(--nx-color-line);--fd:ui-serif,Georgia,\"Times New Roman\",serif;--fs:ui-sans-serif,system-ui,-apple-system,\"Segoe UI\",Roboto,sans-serif;--ease:cubic-bezier(.2,.7,.2,1)}" as *u8)
20 // ---- base ----
21 o = aw(out, o, "*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--fs);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}h1,h2,h3{margin:0;line-height:1.02;letter-spacing:-.03em;font-weight:800}p{margin:0}a{color:inherit;text-decoration:none}svg{display:block}.wrap{max-width:1200px;margin:0 auto;padding:0 28px}.skip-link{position:absolute;left:-999px}.skip-link:focus{left:16px;top:16px;background:var(--brand);color:#fff;padding:10px 16px;border-radius:8px;z-index:30}:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:6px}" as *u8)
22 // ---- header ----
23 o = aw(out, o, "header.site{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:18px 28px;backdrop-filter:blur(10px);background:rgba(10,10,15,.35)}.brand{display:flex;align-items:center;gap:10px;font-family:var(--fd);font-weight:700;font-size:1.15rem}.dot{width:24px;height:24px;border-radius:7px;background:linear-gradient(135deg,var(--brand),var(--accent));box-shadow:0 0 24px -2px var(--brand)}header nav{display:flex;gap:26px}header nav a{color:var(--ink2);font-size:.95rem}header nav a:hover{color:var(--ink)}@media(max-width:700px){header nav{display:none}}" as *u8)
24 // ---- hero + aurora + constellation ----
25 o = aw(out, o, ".hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden}.aurora{position:absolute;inset:-25%;z-index:0;background:radial-gradient(38% 38% at 22% 32%,rgba(109,93,255,.55),transparent 62%),radial-gradient(34% 34% at 82% 26%,rgba(255,122,89,.42),transparent 60%),radial-gradient(46% 46% at 62% 84%,rgba(255,204,102,.26),transparent 62%);filter:blur(34px);animation:aur 22s var(--ease) infinite alternate}@keyframes aur{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-5%,4%) scale(1.18)}}.grain{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent,rgba(10,10,15,.6));pointer-events:none}.constel{position:absolute;right:-40px;top:14%;width:min(46vw,560px);z-index:1;opacity:.9;animation:spin 60s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.node{animation:pulse 4s var(--ease) infinite}.node2{animation-delay:1.3s}.node3{animation-delay:2.1s}@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}@media(max-width:900px){.constel{opacity:.35;right:-30%}}" as *u8)
26 o = aw(out, o, ".hero .wrap{position:relative;z-index:2;width:100%;padding-top:80px}.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink2);margin-bottom:26px;opacity:0;animation:rise .8s var(--ease) .05s forwards}.eyebrow .pip{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent)}.hero h1{font-family:var(--fd);font-size:clamp(3rem,11.5vw,9.5rem);letter-spacing:-.045em;max-width:15ch}.hero h1 .l{display:block;background:linear-gradient(100deg,#ffffff 18%,var(--brand2) 52%,var(--accent) 88%);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:0;transform:translateY(34px);animation:rise .95s var(--ease) forwards}.l2{animation-delay:.12s}.l3{animation-delay:.24s}@keyframes rise{to{opacity:1;transform:none}}.lede{max-width:50ch;color:var(--ink2);font-size:clamp(1.05rem,1.6vw,1.28rem);margin:30px 0 0;opacity:0;animation:rise .95s var(--ease) .38s forwards}.cta-row{display:flex;gap:15px;flex-wrap:wrap;margin-top:38px;opacity:0;animation:rise .95s var(--ease) .5s forwards}" as *u8)
27 // ---- buttons ----
28 o = aw(out, o, ".btn{display:inline-flex;align-items:center;gap:9px;font:inherit;font-weight:650;font-size:1.02rem;padding:15px 30px;border-radius:999px;border:0;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s}.btn-primary{color:#0A0A0F;background:linear-gradient(100deg,var(--brand),var(--accent));box-shadow:0 12px 44px -10px rgba(109,93,255,.6)}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 22px 60px -12px rgba(255,122,89,.6)}.btn-ghost{color:var(--ink);background:rgba(255,255,255,.05);border:1px solid var(--line)}.btn-ghost:hover{border-color:var(--brand);transform:translateY(-3px)}" as *u8)
29 // ---- editorial rows + scroll reveal ----
30 o = aw(out, o, ".rows{padding:40px 0 40px}.erow{display:grid;grid-template-columns:.8fr 1.4fr;gap:clamp(24px,5vw,72px);align-items:center;padding:clamp(40px,7vw,90px) 0;border-top:1px solid var(--line)}.erow:nth-child(even){grid-template-columns:1.4fr .8fr}.erow:nth-child(even) .etext{order:2}.num{font-family:var(--fd);font-size:clamp(3.4rem,9vw,8rem);line-height:.9;background:linear-gradient(130deg,var(--brand),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}.erow h2{font-size:clamp(1.9rem,4.4vw,3.4rem);margin:.15em 0 .45em;letter-spacing:-.035em}.erow p{color:var(--ink2);font-size:clamp(1.05rem,1.5vw,1.2rem);max-width:48ch}@media(max-width:760px){.erow,.erow:nth-child(even){grid-template-columns:1fr;gap:14px}.erow:nth-child(even) .etext{order:0}}" as *u8)
31 o = aw(out, o, ".reveal{opacity:1}@supports(animation-timeline:view()){.reveal{opacity:0;transform:translateY(46px);animation:rise linear both;animation-timeline:view();animation-range:entry 6% cover 26%}}.final{text-align:center;padding:clamp(90px,14vw,180px) 0}.final h2{font-family:var(--fd);font-size:clamp(2.4rem,7vw,6rem);letter-spacing:-.045em;background:linear-gradient(100deg,#fff 25%,var(--brand2) 60%,var(--accent) 95%);-webkit-background-clip:text;background-clip:text;color:transparent}.final p{color:var(--ink2);max-width:46ch;margin:22px auto 34px;font-size:1.2rem}footer.site{border-top:1px solid var(--line);color:var(--ink2)}footer.site .wrap{padding:44px 28px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;font-size:.9rem}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto}.reveal{opacity:1;transform:none}.l,.eyebrow,.lede,.cta-row{opacity:1;transform:none}}" as *u8)
32
33 // ---- body ----
34 o = aw(out, o, "</style></head><body><a class=\"skip-link\" href=\"#main\">Skip to content</a><header class=\"site\"><a class=\"brand\" href=\"#top\"><span class=\"dot\"></span>Connect</a><nav><a href=\"#story\">Story</a><a href=\"#join\">Join</a></nav></header><main id=\"main\">" as *u8)
35
36 // ---- hero ----
37 o = aw(out, o, "<section class=\"hero\" id=\"top\"><div class=\"aurora\"></div><svg class=\"constel\" viewBox=\"0 0 480 480\" fill=\"none\" aria-hidden=\"true\"><defs><linearGradient id=\"cg\" x1=\"0\" y1=\"0\" x2=\"1\" y2=\"1\"><stop offset=\"0\" stop-color=\"#8A7BFF\"/><stop offset=\"1\" stop-color=\"#FF7A59\"/></linearGradient></defs><g stroke=\"url(#cg)\" stroke-width=\"1.2\" opacity=\".6\"><path d=\"M110 90 L250 150 L360 110 M250 150 L300 280 L160 320 M300 280 L410 250 M160 320 L110 90 M250 150 L160 320\"/></g><g fill=\"url(#cg)\"><circle class=\"node\" cx=\"110\" cy=\"90\" r=\"7\"/><circle class=\"node node2\" cx=\"250\" cy=\"150\" r=\"10\"/><circle class=\"node node3\" cx=\"360\" cy=\"110\" r=\"6\"/><circle class=\"node node2\" cx=\"300\" cy=\"280\" r=\"8\"/><circle class=\"node node3\" cx=\"160\" cy=\"320\" r=\"7\"/><circle class=\"node\" cx=\"410\" cy=\"250\" r=\"5\"/></g></svg><div class=\"grain\"></div><div class=\"wrap\"><span class=\"eyebrow\"><span class=\"pip\"></span>Connect · for the Latter-day Saint community</span><h1><span class=\"l l1\">The people</span><span class=\"l l2\">who changed</span><span class=\"l l3\">your life.</span></h1><p class=\"lede\">Reconnect with the missionaries who taught you, the members you served, and a worldwide community of Saints — youth to adults. Free forever, safe by design.</p><div class=\"cta-row\"><a class=\"btn btn-primary\" href=\"#join\">Find your people</a><a class=\"btn btn-ghost\" href=\"#story\">See how it works</a></div></div></section>" as *u8)
38
39 // ---- editorial rows ----
40 o = aw(out, o, "<section class=\"rows\" id=\"story\"><div class=\"wrap\">" as *u8)
41 o = aw(out, o, "<div class=\"erow reveal\"><div class=\"num\">01</div><div class=\"etext\"><h2>Find the missionaries who taught you.</h2><p>We match by mission, area, and the exact months you overlapped — not guesswork. The elders and sisters who changed your life, and the families they served, are findable again — only ever when you both choose.</p></div></div>" as *u8)
42 o = aw(out, o, "<div class=\"erow reveal\"><div class=\"num\">02</div><div class=\"etext\"><h2>Youth who belong.</h2><p>LDS youth worldwide meet, play, and grow together in rooms that are safe by construction — a two-deep rule in the software itself, no adult ever alone with a youth, no private messages from strangers.</p></div></div>" as *u8)
43 o = aw(out, o, "<div class=\"erow reveal\"><div class=\"num\">03</div><div class=\"etext\"><h2>Free. Forever.</h2><p>No cost, no ads to youth, nothing about you ever sold. A community, not a marketplace — built to grow families and friendships, never engagement metrics.</p></div></div>" as *u8)
44 o = aw(out, o, "</div></section>" as *u8)
45
46 // ---- final CTA + footer ----
47 o = aw(out, o, "<section class=\"final reveal\" id=\"join\"><div class=\"wrap\"><h2>Come home to your people.</h2><p>They remember you too. Somewhere, the family you taught wonders what became of their missionary.</p><a class=\"btn btn-primary\" href=\"#top\">Create your free account</a></div></section>" as *u8)
48 o = aw(out, o, "</main><footer class=\"site\"><div class=\"wrap\"><span class=\"brand\" style=\"font-size:1rem\"><span class=\"dot\"></span>Connect</span><span>A community for members, youth & returned missionaries — never congregation tooling, never proselytizing.</span><span>© 2026 · Built sovereign on Nishi</span></div></footer></body></html>" as *u8)
49
50 let fd: i64 = sys_openat_wr("web_assets/lds_award.html" as *u8, 420)
51 if fd < 0 { return 6 }
52 sys_write(fd, out, o)
53 sys_close(fd)
54 let banner: *u8 = "nx_connect_award_page: wrote web_assets/lds_award.html (award-caliber: aurora + constellation + expressive type + CSS motion)\n" as *u8
55 var bn: i64 = 0
56 while banner[bn] != 0 { bn = bn + 1 }
57 sys_write(1, banner, bn)
58 return 0
59}