{% extends "pages/_content_index.jinja" %}

{% block head_title %}{{ l10n("search.head.title", "projects", user_lang) }}{% endblock %}
{% block head_description %}{{ l10n("search.head.title", "projects", user_lang) }}{% endblock %}

{% block header_title %}
    <i class="fad fa-briefcase t-size-16 mr-s t-muted"></i>{{ l10n("header.root", "projects", user_lang) }}<span class="mobile-hide">
    <span class="mx-s t-size-15">❱</span>{{ l10n("header.search", "projects", user_lang) }}</span>
{% endblock %}

{% block content_filters %}
[Tools filters here !]
{% endblock %}

{% block content_listing %}

    {% for tool_id, tool_data in get_tools().items() %}
        <div class="p-s border r-m">
            <a href="{{ l10n_url_abs('/tools/' + tool_id, raw_lang) }}" class="a-hidden">
                <div class="content-search-entry">
                    <img class="content-search-image mr-s r-l"
                         src="{{ url_for("static", filename=tool_data.metadata.index.image_url) }}"
                         alt="TODO">
                    <h3 class="mb-xs">
                        {{ l10n(tool_data.metadata.index.title_key, tool_id, user_lang) }}
                    </h3>
                    <p>{{ l10n(tool_data.metadata.index.preamble_key, tool_id, user_lang) }}</p>
                </div>
            </a>

            <p class="mt-xs">
                <i class="fad fa-tags t-size-8"></i>
                {% for tool_tag in tool_data.metadata.general.tags %}
                    <a href="{{ l10n_url_abs('/tools/?tags=' + tool_tag, raw_lang) }}" class="ml-xs">#{{ tool_tag }}</a>
                {% endfor %}
            </p>
        </div>

    {% endfor %}
{% endblock %}