← Tilbage til UI-komponentoversigt

NavDesktop — Forhåndsvisning

Den interaktive preview er øverst som sidens navbar-demo. Under den vises alle 4 state-kombinationer (`Logged in × Scroll`) enkeltvis.

Interaktiv navbar (live collapse/expand)

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

Scroll ned for at udløse collapse fra 96px til 64px og scroll op for expand tilbage.

State previews

Logged out + Scroll=false (108px total)

Kontrastflade til verificering af navens hvide hjørnetabs i 12px-rækken.

Scroll-varianten er styret via prop i denne matrix. Brug den interaktive overflade nedenfor for live scroll-collapse.

Eksempelindhold bag nav-bar for at gøre kantform og tabs tydelige.

Logged out + Scroll=true (76px total)

Kontrastflade til verificering af navens hvide hjørnetabs i 12px-rækken.

Scroll-varianten er styret via prop i denne matrix. Brug den interaktive overflade nedenfor for live scroll-collapse.

Eksempelindhold bag nav-bar for at gøre kantform og tabs tydelige.

Logged in + Scroll=false (108px total)

Kontrastflade til verificering af navens hvide hjørnetabs i 12px-rækken.

Scroll-varianten er styret via prop i denne matrix. Brug den interaktive overflade nedenfor for live scroll-collapse.

Eksempelindhold bag nav-bar for at gøre kantform og tabs tydelige.

Logged in + Scroll=true (76px total)

Kontrastflade til verificering af navens hvide hjørnetabs i 12px-rækken.

Scroll-varianten er styret via prop i denne matrix. Brug den interaktive overflade nedenfor for live scroll-collapse.

Eksempelindhold bag nav-bar for at gøre kantform og tabs tydelige.