Kontekstdrevet UI

Et moderne overblik over layout, komponentkontekst og native interaktion på webplatformen.

Fundament og layout

2 emner

Frontendfaglighed i en AI-tid

Hvorfor platformforståelse og faglig dømmekraft bliver vigtigere, når kode er lettere at producere.
Layoutrelationer og intrinsisk responsivitet

Vælg Flexbox eller Grid ud fra relationen, og lad indholdet bestemme, hvornår layoutet skifter.

3 emner

Typed attr(): fra HTML-data til CSS-værdi

Læs tal, længder, farver og afgrænsede keywords fra HTML uden at behandle alt som tekst.
Size queries og komponentens plads

Lad en komponent reagere på den plads, den faktisk får, frem for på hele viewporten.
Style queries og semantiske varianter

Lad efterkommere reagere på nedarvede design-input i stedet for at kopiere hele komponentens CSS.

4 emner

Scroll snap som grundlag

Byg en horisontal scroller, der stadig fungerer med touch, trackpad og tastatur.
Invoker commands og deklarativ interaktion

Beskriv relationen mellem en knap og dens target i HTML, og behold kun den egentlige logik i JavaScript.
Star rating med gradient og mask

Omsæt et tal til en visuel rating med én gradient og én genbrugelig ikonmaske.
Scroll-driven progress og timeline-scope

Lad scrollerens position drive en progressindikator – også når indikatoren er en søskende.

1 emner

Betingede og flydende responsive detaljer

Brug containerkontekst og progress() til detaljer, der ellers ofte ender som ekstra breakpoints.