html(lang="en")
  head
    title= "Mailinglisten"
    meta(charset="UTF-8")
    meta(name="viewport", content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no")
    link(rel="stylesheet", type="text/css", href="https://transfer.hft-stuttgart.de/css/bootstrap/bootstrap.css")
    link(rel="stylesheet", href="https://use.fontawesome.com/releases/v5.8.2/css/all.css", integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay", crossorigin="anonymous")
    style.
        .collapse {
            display: none;
        }
        .collapse.in {
            display: block;
        }
        .collapsing {
            position: relative;
            height: 0;
            overflow: hidden;
            -webkit-transition-timing-function: ease;
            -o-transition-timing-function: ease;
            transition-timing-function: ease;
            -webkit-transition-duration: .35s;
            -o-transition-duration: .35s;
            transition-duration: .35s;
            -webkit-transition-property: height,visibility;
            -o-transition-property: height,visibility;
            transition-property: height,visibility;
        }
  body
    <hr />
    div()
        h5(align="left") Aktive Mailinglisten
        div(class="flex-container" style="align-items:flex-start")
            div(class="table")
                table(border="0" id="listtable" class="table table-striped")
                    thead
                        tr
                            th Name
                            th Link
                            th zugeh. Projekt
                    tbody
                        for item in mailinglists
                            if item.projectstatus == '1'
                                tr
                                    td #{item.name}
                                    td <a href="#{item.src}">#{item.src}</a>
                                    td <a href='projectoverview?projectID=#{item.id}'>#{item.project_title}</a>
    <hr />
    div()
        h5(align="left") Eintragung in Mailingliste
        p() Wenn Sie sich in eine Mailingliste eintragen wollen, folgen Sie folgender Anleitung:
    // jQuery
    script(src="https://code.jquery.com/jquery-3.3.1.min.js")
    script(src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js", integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1", crossorigin="anonymous")
    // Bootstrap
    script(src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous")
    // Header
    if isUserAuthenticated
        script(src="/js/headfootLogout.js")
    else
        script(src="https://transfer.hft-stuttgart.de/js/headfoot.js")