Document list

Used for document attachments on a page. If a document has multiple language versions, these should be listed as links in parenthesis after the document title. A document's file size is displayed in parenthesis at the end of the document link. File sizes are displayed in MBs, unless file size is less than 1MB, whereupon KBs should be used.

Dokumentliste

    • DokumenttittelDokumentet er av typen pdf, er på bokmål, og er 970 kB stort.
    • DokumenttittelDokumentet er av typen pdf, er på nynorsk, og er 970 kB stort.
    • Document titleThe document is of type pdf, is in english, and is 970 kB in size.
<section class="document-list">
    <h2 class="h5">Dokumentliste</h2>
    <ul class="document-list__groups">
        <li class="document-list__group">
            <ul class="document-list__items">
                <li class="document-list__item document-list__icon document-list__icon--pdf">
                    <a href="#">This is the title of the document</a> – <span class="show-for-sr">The document is of type pdf, is in english, and is 3,29 MB in size.</span> <span class="document-list__meta-data" aria-hidden="true">English <span class="document-list__filesize">(3,29 MB)</span></span>
                </li>
            </ul>
        </li>
        <li class="document-list__group">
            <ul class="document-list__items">
                <li class="document-list__item document-list__icon document-list__icon--xls">
                    <a href="#">Dette er dokumenttittelen</a> – <span class="show-for-sr">Dokumentet er av typen xls, er på bokmål, og er 262 kB stort.</span> <span class="document-list__meta-data" aria-hidden="true">Bokmål <span class="document-list__filesize">(262 kB)</span></span>
                </li>
            </ul>
        </li>
        <li class="document-list__group">
            <ul class="document-list__items">
                <li class="document-list__item document-list__icon document-list__icon--doc">
                    <a href="#">Dette er dokumenttittelen</a> – <span class="show-for-sr">Dokumentet er av typen doc, er på nynorsk, og er 90 kB stort.</span> <span class="document-list__meta-data" aria-hidden="true">Nynorsk <span class="document-list__filesize">(90 kB)</span></span>
                </li>
            </ul>
        </li>
        <li class="document-list__group">
            <ul class="document-list__items">
                <li class="document-list__item document-list__icon document-list__icon--ppt">
                    <a href="#">Dette er dokumenttittelen</a> – <span class="show-for-sr">Dokumentet er av typen ppt, er på bokmål, og er 123 kB stort.</span> <span class="document-list__meta-data" aria-hidden="true">Bokmål <span class="document-list__filesize">(123 kB)</span></span>
                </li>
            </ul>
        </li>
        <li class="document-list__group">
            <ul class="document-list__items">
                <li class="document-list__item document-list__icon document-list__icon--pdf">
                    <a href="#">Dokumenttittel</a> – <span class="show-for-sr">Dokumentet er av typen pdf, er på bokmål, og er 970 kB stort.</span> <span class="document-list__meta-data" aria-hidden="true">Bokmål <span class="document-list__filesize">(970 kB)</span></span>
                </li>
                <li class="document-list__item document-list__icon document-list__icon--pdf">
                    <a href="#">Dokumenttittel</a> – <span class="show-for-sr">Dokumentet er av typen pdf, er på nynorsk, og er 970 kB stort.</span> <span class="document-list__meta-data" aria-hidden="true">Nynorsk <span class="document-list__filesize">(970 kB)</span></span>
                </li>
                <li class="document-list__item document-list__icon document-list__icon--pdf">
                    <a href="#">Document title</a> – <span class="show-for-sr">The document is of type pdf, is in english, and is 970 kB in size.</span> <span class="document-list__meta-data" aria-hidden="true">English <span class="document-list__filesize">(970 kB)</span></span>
                </li>
            </ul>
        </li>
    </ul>
</section>