Z Index

z-index bestemmer hvilket element som ligger øverst når to elementer overlapper. Problemet oppstår når hvert team velger tall selv: en modal med z-index: 100 havner under en header med 999, og så begynner budkrigen.

Derfor har vi tokens for de tilfellene som faktisk trenger stabling. Tokenet er navngitt etter formålet, og verdiene er satt slik at komponenter og overlays ikke kolliderer. Velg tokenet som beskriver det du lager, og la tallet være.

CSS custom property	Verdi	Beskrivelse
--ix-z-background	-1	Bakgrunnselementer som alltid skal ligge bak alt annet.
--ix-z-default	0	Standard z-index for vanlige komponenter og innhold.
--ix-z-elevated	1	Brukes for elementer som skal ligge over standard innhold.
--ix-z-overlay	20	Overlay som skal ligge over innholdet på siden.
--ix-z-dialog	60	Dialoger som skal ligge over alt annet.
--ix-z-max	100	For når du har noe som må ligge øverst uansett hva. Vi annbefaler å bruke denne like mye som !important. Dvs. aldri.