matrix.org/templates/governing-board/elections.html

{% extends "page.html" %}
{% import "macros/nominee.html" as nominee %}
{% block head_extra %}
<script>
    window.addEventListener('DOMContentLoaded', () => {
        const nomineeSections = document.querySelectorAll('.nominees');
        for (const nomineeSection of nomineeSections) {
            const nomineesDetails = nomineeSection.querySelectorAll('details');

            nomineeSection.querySelector('.expand-all')?.addEventListener('click', () => {
                for (const nomineeDetail of nomineesDetails) {
                    nomineeDetail.setAttribute("open", "");
                }
            });

            nomineeSection.querySelector('.collapse-all')?.addEventListener('click', () => {
                for (const nomineeDetail of nomineesDetails) {
                    nomineeDetail.removeAttribute("open");
                }
            });
        }
    });
</script>
{% endblock %}
{% block content %}
<article id="elections" class="content">
    <header>
        <h1>{{ page.title }}</h1>
    </header>

    {{ page.content | safe }}

    {% set nominees_path = page.path ~ "nominees.toml" %}
    {% set nominees = load_data(path=nominees_path, format="toml") %}

    {% if nominees.individual_members %}
    <h3 id="individual-nominees">Individual Members (Max. 4 Seats)</h3>
    <div class="nominees">
        <div class="nominees-buttons-row">
            <button class="expand-all">Expand all</button> &ndash; <button class="collapse-all">Collapse all</button>
        </div>
        {% for individual in nominees.individual_members %}
        {{ nominee::individual(individual=individual) }}
        {% endfor %}
    </div>
    {% endif %}


    {% if nominees.ecosystem_members %}
    <h3 id="ecosystem-nominees">Ecosystem Members (Max. 3 Seats)</h3>
    <div class="nominees">
        <div class="nominees-buttons-row">
            <button class="expand-all">Expand all</button> &ndash; <button class="collapse-all">Collapse all</button>
        </div>
        {% for representative in nominees.ecosystem_members %}
        {{ nominee::project(representative=representative) }}
        {% endfor %}
    </div>
    {% endif %}

    {% if nominees.associate_members %}
    <h3 id="associate-nominees">Associate Members (Max. 2 Seats)</h3>
    <div class="nominees">
        <div class="nominees-buttons-row">
            <button class="expand-all">Expand all</button> &ndash; <button class="collapse-all">Collapse all</button>
        </div>
        {% for representative in nominees.associate_members %}
        {{ nominee::project(representative=representative) }}
        {% endfor %}
    </div>
    {% endif %}

    {% if nominees.platinum_members %}
    <h3 id="platinum-nominees">Platinum Members (Max. 4 Seats)</h3>
    <div class="nominees">
        <div class="nominees-buttons-row">
            <button class="expand-all">Expand all</button> &ndash; <button class="collapse-all">Collapse all</button>
        </div>
        {% for representative in nominees.platinum_members %}
        {{ nominee::project(representative=representative) }}
        {% endfor %}
    </div>
    {% endif %}

    {% if nominees.gold_members %}
    <h3 id="gold-nominees">Gold Members (Max. 3 Seats)</h3>
    <div class="nominees">
        <div class="nominees-buttons-row">
            <button class="expand-all">Expand all</button> &ndash; <button class="collapse-all">Collapse all</button>
        </div>
        {% for representative in nominees.gold_members %}
        {{ nominee::project(representative=representative) }}
        {% endfor %}
    </div>
    {% endif %}

    {% if nominees.silver_members %}
    <h3 id="silver-nominees">Silver Members (Max. 2 Seats)</h3>
    <div class="nominees">
        <div class="nominees-buttons-row">
            <button class="expand-all">Expand all</button> &ndash; <button class="collapse-all">Collapse all</button>
        </div>
        {% for representative in nominees.silver_members %}
        {{ nominee::project(representative=representative) }}
        {% endfor %}
    </div>
    {% endif %}

    {% if nominees.guardians %}
    <h3 id="guardian-nominees">Guardians (Max. 3 Seats)</h3>
    <div class="nominees">
        <div class="nominees-buttons-row">
            <button class="expand-all">Expand all</button> &ndash; <button class="collapse-all">Collapse all</button>
        </div>
        {% for guardian in nominees.guardians %}
        {{ nominee::individual(individual=guardian) }}
        {% endfor %}
    </div>
    {% endif %}

    {% if nominees.sct_members %}
    <h3 id="sct-nominees">Spec Core Team Members (Max. 2 Seats)</h3>
    <div class="nominees">
        <div class="nominees-buttons-row">
            <button class="expand-all">Expand all</button> &ndash; <button class="collapse-all">
                Collapse all
            </button>
        </div>
        {% for individual in nominees.sct_members %}
        {{ nominee::individual(individual=individual) }}
        {% endfor %}
    </div>
    {% endif %}
</article>
{% endblock content %}