{% extends "base.html" %}

{% block navigation %}
{% endblock %}

{% block content %}
<div class="functoweb-container">
    <h1 class="functoweb-title">{{ page_title }}</h1>
    
    <div class="functoweb-items">
        {% for item in items %}
            {{ render_item(item) }}
        {% endfor %}
    </div>
</div>
{% endblock %}

{% macro render_item(item) %}
    {% if item.type == 'function' %}
        {% if not item.hidden %}
        <a href="{{ item.url }}" class="functoweb-function-card">
            <h3 class="functoweb-function-card-title">{{ item.name }}</h3>
            {% if item.description %}
            <p class="functoweb-function-card-description">{{ item.description }}</p>
            {% endif %}
        </a>
        {% endif %}
    {% else %}
        <div class="functoweb-group">
            <button class="functoweb-group-header">
                <span class="functoweb-group-name">{{ item.name }}</span>
                <span class="functoweb-group-icon">▼</span>
            </button>
            <div class="functoweb-group-content">
                {% for child in item.children %}
                    {{ render_item(child) }}
                {% endfor %}
            </div>
        </div>
    {% endif %}
{% endmacro %}