<!DOCTYPE html>
<%- include("./snippets/timon.ejs") %>
<html lang="de-ch" data-theme="light">
    <head>
        <%- include("./snippets/head.ejs", {
            title: title,
            date: date,
            desc: desc,
            url: url,
            env: env,
            sitetype: sitetype
        }) %>
        <script type="text/javascript" src="/js/calendar.js" defer></script>
    </head>
    <body>
        <%- include("./snippets/header.ejs") %>
        <%- include("./snippets/nav.ejs") %>
        <main>
            <%- include("./snippets/hero.ejs", {
                img_alt: "Das Titelbild unserer Seite",
                img_path: "https://ik.imagekit.io/zmt/assets/hero",
                title: hero.title,
                subtitle: hero.subtitle,
                cta_text: hero.button_text,
                cta_link: hero.link,
                origin_url
            }) %><%
            let link_mitglied;
            if (typeof user !== "undefined" && user !== null) {
                user?.valid ? link_mitglied = "/profile?js=profile_toMembership" : link_mitglied = "/login";
            } else {
                link_mitglied = "/login";
            }; %>
            <h1 class="title w-575 w575">Spenden</h1>
            <div class="mobile-donation">
                <a class="cta-btn flex" href="/spenden">Spenden</a>
                <a class="cta-btn flex" href="https://www.unikat-hoengg.ch">Shop</a>
                <a class="cta-btn flex" href="<%= link_mitglied %>">Mitglied werden</a>
            </div>
            <%- include("./snippets/news.ejs", {
                text: news.text,
                img_path: news.img_path,
                img_alt: news.img_alt,
                img_pos: news.img_pos,
                cta: news.btn,
                cta_text: news.btn_text,
                cta_link: news.btn_link,
                pdf: news.pdf,
                pdf_src: news.pdf_src,
                origin_url: origin_url
            }) %>
            <a class="news-more special" href="/archiv">Mehr anzeigen</a>
            <h1 class="title">Terminkalender</h1>
            <ul class="calendar">
                <%- include("./snippets/calendar.ejs", {
                    events
                }); %>
            </ul>
            <h1 class="title">BlogbeitrÃ¤ge</h1>
            <%- include("./snippets/blogCards.ejs", {
                title: undefined,
                rows: 2,
                img: [
                    last4blogs[0].img.img[0],
                    last4blogs[1].img.img[0],
                    last4blogs[2].img.img[0],
                    last4blogs[3].img.img[0]
                ],
                img_alt: [
                    last4blogs[0].img.alt[0],
                    last4blogs[1].img.alt[0],
                    last4blogs[2].img.alt[0],
                    last4blogs[3].img.alt[0]
                ],
                subtitle: [
                    last4blogs[0].title, 
                    last4blogs[1].title, 
                    last4blogs[2].title, 
                    last4blogs[3].title
                ],
                desc: [
                    last4blogs[0].preview, 
                    last4blogs[1].preview, 
                    last4blogs[2].preview, 
                    last4blogs[3].preview
                ],
                origin_url: origin_url
            }) %>
            <h1 class="title" id="scroll_to_vorstand">Unser Vorstand</h1>
            <%- include("./snippets/teamMember.ejs", {
                members: member_list
            }); %>
        </main>
        <%- include("./snippets/footer.ejs", {
            origin_url: origin_url,
            js: js
        }) %>
    </body>
</html>