/* =============================================================
ki.solidlab.no — landingsside for KI-rådgivning.
Statisk side, JSX kompilert i nettleseren. Samme designspråk
som solidlab.no: colors_and_type.css + site.css + ki.css.
============================================================= */
const { useState, useEffect, useRef } = React;
/* Mobil viser selvtesten som trekkspill: svaret åpnes rett under
nivået du trykker på, sa du slipper a scrolle for a se det.
Samme grep som seksjon 03 pa solidlab.no. */
function useMobil(brekk) {
const sporring = "(max-width: " + (brekk || 760) + "px)";
const [mobil, setMobil] = useState(
() => typeof window !== "undefined" && window.matchMedia(sporring).matches
);
useEffect(() => {
const mq = window.matchMedia(sporring);
const ved = (e) => setMobil(e.matches);
setMobil(mq.matches);
if (mq.addEventListener) mq.addEventListener("change", ved);
else mq.addListener(ved);
return () => {
if (mq.removeEventListener) mq.removeEventListener("change", ved);
else mq.removeListener(ved);
};
}, [sporring]);
return mobil;
}
const rullTil = (id) => {
const el = document.getElementById(id);
if (el) el.scrollIntoView({ behavior: "smooth", block: "start" });
};
/* Alle handlingsknapper apner skjemaet. E-post og telefon nederst
i kontaktseksjonen er fortsatt ekte mailto:/tel:-lenker - det er
kontaktinfo, ikke en knapp. */
/* ============ HEADER ============ */
function Header() {
return (
);
}
/* ============ HERO ============ */
function Hero() {
const h = INNHOLD.hero;
return (
{h.stikkord}
{h.tittel_for}{h.tittel_uthevet}
{h.ingress}
);
}
/* ============ 01 — SELVTEST ============ */
function Selvtest() {
const s = INNHOLD.selvtest;
const [valgt, setValgt] = useState(s.nivaaer[0]);
const [lukket, setLukket] = useState(false);
const mobil = useMobil(760);
/* Ingen manuell scrollkorreksjon her - med vilje.
Nettleseren gjor dette selv (scroll anchoring) nar innhold over
viewporten endrer hoyde. Legger vi var egen scrollBy oppa,
kompenserer begge for det samme og siden skyter til topps pa
ekte mobil. Seksjon 03 pa solidlab.no gjor heller ingenting,
og oppleves rolig nettopp derfor. */
const velg = (n) => {
if (n.id === valgt.id) { setLukket((l) => !l); return; }
setValgt(n); setLukket(false);
};
const svar = (n) => (
);
}
/* ============ 02 — HVOR DET STOPPER ============ */
function Stopper() {
const s = INNHOLD.stopper;
return (
{s.merke}
{s.tittel}
{s.ingress}
{s.punkter.map((p) => (
{p.nr}
{p.tittel}
{p.tekst}
))}
);
}
/* ============ 03 — SLIK JOBBER VI ============ */
function Metode() {
const m = INNHOLD.metode;
return (
{m.merke}
{m.tittel}
{m.ingress}
{m.steg.map((s) => (
{s.nr}
{s.tittel}
{s.tekst}
))}
{m.kjedelige_tittel}
{m.kjedelige.map((k, i) => (
→ {k}
))}
);
}
/* ============ 04 — I PRAKSIS ============ */
/* Mork flate som bryter opp siden, i slekt med footeren. Vi navngir
prosjektene, men beskriver dem ikke i detalj enna. */
function Praksis() {
const p = INNHOLD.praksis;
return (
{p.merke}
{p.utsagn_for}{p.utsagn_uthevet}
{p.tekst.map((t, i) =>
{t}
)}
{p.tall.map((t) => (
{t.verdi}
{t.merke}
))}
{p.prosjekt_merke}
{p.prosjekter.map((pr) => (
{pr.navn}{pr.kort}
))}
{p.fot}
);
}
/* ============ 05 — KONTAKT ============ */
function Kontakt() {
const k = INNHOLD.kontakt;
return (