nx_kit_shell.nx source

1// nx_kit_shell.nx -- the ONE shared shell-neutralisation layer every design family composes (rule 15: 2// the pattern appeared in 3 families, so it belongs in one place). 3// 4// ★WHY THIS EXISTS: a family restyles the SHARED page shell (nx_sclass_kit's header/footer chrome), and 5// three separate hard-won facts about that shell were being re-derived and re-typed per family: 6// 1. the base `.bar` is a FIXED-HEIGHT STICKY FLEX bar -- a family that makes its nav a block MUST also 7// reset height/min-height/position/overflow or the nav renders OUTSIDE the header (the Journal 8// masthead collided with the lead's kicker line until this was found by rendering, 07-25); 9// 2. the shell's brand mark is a GRADIENT DOT -- any family with its own wordmark must suppress it in 10// BOTH the header AND the footer (the footer copy survived the header fix and was caught by a second 11// render pass); 12// 3. doc-tier form controls (.field input/.btnp) carry SaaS defaults -- rounded fields and a gradient 13// submit -- which every non-SaaS family has to re-square. 14// Each helper takes only what genuinely varies (a token name, a radius), so this is composition, not a 15// configuration flag farm (rule 22). Pure emit. license_tier: ORIGINAL 16import "nx_uigen_l1.nx" 17 18// (1) neutralise the base shell's sticky fixed-height flex chrome so a family may lay its own header out. 19// Emit this BEFORE the family's own header rules. 20func kx_shell_reset(buf: *u8, off: i64) -> i64 { 21 return he_puts(buf, off, "header.site{position:static;height:auto;min-height:0;overflow:visible;box-shadow:none}header.site .bar{height:auto;min-height:0}footer.site{background:transparent}" as *u8) 22} 23 24// (2) the family wordmark: its own type, and the shell's gradient dot suppressed in header AND footer. 25// fontvar = a CSS custom-property name holding the family's display stack (e.g. "var(--kc-serif)"). 26func kx_wordmark(buf: *u8, off: i64, fontvar: *u8, weight: *u8, extra: *u8) -> i64 { 27 var o: i64 = he_puts(buf, off, "header.site .brand{font-family:" as *u8) 28 o = he_puts(buf, o, fontvar) 29 o = he_puts(buf, o, ";font-weight:" as *u8) 30 o = he_puts(buf, o, weight) 31 o = he_puts(buf, o, ";color:inherit;" as *u8) 32 o = he_puts(buf, o, extra) 33 o = he_puts(buf, o, "}header.site .brand .dot{display:none}" as *u8) 34 o = he_puts(buf, o, "footer.site .brand{font-family:" as *u8) 35 o = he_puts(buf, o, fontvar) 36 o = he_puts(buf, o, ";font-weight:" as *u8) 37 o = he_puts(buf, o, weight) 38 o = he_puts(buf, o, ";color:inherit}footer.site .brand .dot{display:none}" as *u8) 39 return o 40} 41 42// (3) doc-tier controls re-squared onto the family's own ink. radius in px; accentvar/inkvar are token 43// names (e.g. "var(--kc-gold)" / "var(--kc-deep)"). Kills the rounded field + gradient submit. 44func kx_doc_controls(buf: *u8, off: i64, radius: i64, accentvar: *u8, inkvar: *u8, ringvar: *u8) -> i64 { 45 var o: i64 = he_puts(buf, off, ".field input,.field textarea,.field select{border-radius:" as *u8) 46 o = l1_put_u8(buf, o, radius) 47 o = he_puts(buf, o, "px;border:1px solid var(--nx-color-line);background:var(--nx-color-surface);padding:13px 15px;font-size:1rem}" as *u8) 48 o = he_puts(buf, o, ".field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible{outline:none;border-color:" as *u8) 49 o = he_puts(buf, o, accentvar) 50 o = he_puts(buf, o, ";box-shadow:0 0 0 3px " as *u8) 51 o = he_puts(buf, o, ringvar) 52 o = he_puts(buf, o, "}" as *u8) 53 o = he_puts(buf, o, ".btnp{background:" as *u8) 54 o = he_puts(buf, o, inkvar) 55 o = he_puts(buf, o, ";border-radius:" as *u8) 56 o = l1_put_u8(buf, o, radius) 57 o = he_puts(buf, o, "px;box-shadow:none}.btnp:hover{transform:none}.btnp:focus-visible{outline:3px solid " as *u8) 58 o = he_puts(buf, o, accentvar) 59 o = he_puts(buf, o, ";outline-offset:3px}" as *u8) 60 return o 61}