Disse komponenter er typisk sammensat af flere html elementer på siden. De kan desuden bruges i en given context, f.eks. kan skts-layout1-sammen klassen kun bruges indenfor for en div dekoreret med klassen skts-layout1-foldblok såfremt der ønskes en automatisk generering af farvning af linier.

Bruger oplysninger

Viser oplysninger for en indlogget bruger øverst på siden. Bemærk at brugeroplysningerne en inkluderet to gange. Den øverste sektion viser brugeren for en skærm og den nederste bruges ved print. Begge sektioner skal inkluderes.

---

Ikoner og tekst

Top ikon for print og pdf

Dette viser pdf og print ikon i højre hjørne af siden

Hjælp

---

Resultat linier

Viser et resultat af en beregning

Footer tekst

Denne komponent danner footer teksten indenfor en indholdsramme. skts-footer-version og skts-footer-versions-link skubbes til højre indenfor rammen.

---

Tabeller

Tabel i skatteberegning

Denne tabel bruges i Årsopgørelsen for at vise en detaljeret beregning af AM-bidrag. Bemærk at den første celle i thead er sat som en td og data til   da den ikke indeholder noget.

Der skal også sættes en caption; dette er primært brugt af tilgængeligheds årsager og vil vha. stylesheetet ikke blive vist til en almindelig bruger.

Ovenstående tabel er indlagt i en div med klassen skts-layout1-beregning-detaljer for at opnå den rette font størrelse. Dette element er ikke vist i dette eksempel

Indholds tabel

Denne tabel type bruges primært til meddelelser

Indholds tabel 2

Denne tabel type bruges primært til meddelelser

Tabel til skattekort

Tabel med udfoldning

---

Foldud objekter

Beregninsglinier i årsopgørelsen

Denne beregningslinie folder ud under linien. Dette gøres med klassen skts-layout1-sammen. Klassen skts-layout1-detaljer skjules vha. javascript og foldes ud når der trykkes på linien.

Det første span felt indeholder tekst; det andet indeholder typisk et beløb og det tredje a felt indeholder navigations pilen for at kunne folde linien ud. Det skal dog bemærkes at lige meget hvor brugeren trykker på linien vil denne foldes ud.

Alle felter under skts-layout1-detaljer er stylet som blok level elementer, de står derfor under hinanden.

Bemærk: Da white-space er signifikant i html mellem span felter, skal disse stå på samme linie uden noget mellemrum inde i skts-layout1-sammen* elementer som i nedenstående eksempel:

Almindelig foldud objekt

Denne linie har et yderligere felt som kan udfyldes. Der er ialt 4 li felter i linien, hvoraf en af dem kan udfyldes med en kort tekst, som sammen med et tooltip giver en forklaring til dette felt. Derudover er der samme functionalitet som ovenfor.

Følgende linie har ikke en foldud del eller en pil som brugeren kan trykke på:

Følgende linie har ikke en foldud del eller en pil som brugeren kan trykke på, men har et ekstra felt:

Farvning af linier

Man har ikke behov for at farve linierne, disse farvelægges når dokumentet loades via javascript. Dette kræver at linien, som er et <p>, annoterers med en class som starter med skts-layout1-sammen. Desuden kræves det at hver block indenfor farvningen af linier starter med et tag andet end et <p> tag sådan at javascript komponenten ved hvornår der skal startes forfra på farvningen. F.eks. i årsopgørelsen er hver linie sat med et p tag og disse er afgrænset med et <h3> tag.

Yderligere beregninsglinier i årsopgørelsen

Denne beregnings del viser et eksempel på hvordan der foldes ud under en linie. Samtidig indeholder den et eksempel på formateringen af forskellige beløb ved understregning. Eksempelvis bruges klassen skts-layout1-linje_understreg for at understrege og skts-layout1-linje_resultat bruges for at vise et resultat.

Denne linie indeholder ingen funktionalitet, men er typisk en del af et overordnet foldudobjekt.

Fejlhåndtering

---

Kolonner